Archive for the 'Safari' Category

iOS用お絵描きソフト

7月 02 2010 Published by hkitago under HTML,JavaScript,Safari,iOS,iPhone

iPad の Safari で動作するマルチタッチ対応お絵描きソフトを作ってみた” からコードを拝借し、フルスクリーンで起動するように次のタグを追加してローカル上にある Mac OS のサイトディレクトリに配置した。

"apple-touch-icon"を指定しない場合のホームアイコンはページのスクリーンショットになるので、何か描いた後に “ホーム画面に追加” ボタンを実行すると良い。

デモ (リンクは予告無く削除する事があります)

フルスクリーン表示ではアドレスバーの表示が無いので、白紙に戻す時に使う “再読み込み” は “ホーム>アイコン” とタップ数が多くなってしまう事に注意。

P.S. 子供に遊ばせてみる事にする。

更新: "apple-touch-icon"を指定したウェブアプリは iOS4 のマルチタスクに対応する様だ。

更新2(7/22):子供とお絵描きをして遊んだ。彼は飽きたらホームボタンを押すので同時にスリープボタンを押してキャプチャを撮る事に成功。

コメントは受け付けていません。

Safari 5の新機能

6月 16 2010 Published by hkitago under Safari

Mac|Life が Safari 5にある注目すべき17個の新機能を紹介する記事 “17 Cool Safari 5.0 Features and Tips Revealed” を公開していた。

ウェブ開発者としては2ページ目の後半に書かれているユーザエージェントを変更して Apple の公式文書を見ると iPad 用に最適化されたページ設計を垣間見ることができるのを最近とても重宝しているが、コマンド+数字キーというショートカットによるブックマークレットの呼び出しが9つ以上になってきたこともあって、Extension を使った Youtube 動画の保存やタブセッションの保存ボタンを追加することができるのも便利だと思う。(ツールバーに再読み込みボタンを復活させる Extension なんてのもある。)

更に Safari 4 ではキャレットブラウジングという地味な機能が、ウェブ上に公開されているコードをコピペしたり Evernote やメモへ保存するためにテキストを選択する場合に有益だったが、Safari 5 ではコマンド+Zという文字入力のやり直しを行うショートカットが拡張されていて、タブをうっかり閉じてしまった時に実行すると復元する(その後、コマンド+シフト+Zでまた閉じる)という機能が今回の地味なお気に入り機能になっている。

ヘルプ>謝辞からも分かる様にリーダー機能は Arc90 が Apache License で公開している Readability のコードを利用しているそうで、アドレスバー右端(再読み込みボタンの左)に表示されているが、押しっぱなしにすると従来あった RSS を登録するためのプルダウンメニューが表示されるというのも利用者の混乱を最小限に抑える措置として気が利いている。

コメントは受け付けていません。

SQLiteデータベースのバージョンを変更する

2月 07 2010 Published by hkitago under JavaScript,Safari,iPhone,コーディング

iPhone アプリで利用している SQLite のスキーマを変更する必要に迫られ開発中に予期せぬ出来事があった。具体的にはテーブルに一列追加する changeVersion という関数を利用する際に必ずバージョンがマッチしないというエラーを出力するというものだ。

success callback である第五引数内でもoj.versionがoldVersionを返すのが気になります、、、。リロードするとようやくnewVersionに変わるんですけれど、これで良いのかなぁ。

引用元: JavaScript++かも日記: 【iPhone】iPhone用 JavaScriptデータベースプログラミング入門 (6).

Safari の JavaScript のデバッガでこの問題を確認し回避策を模索していたところ、Apple の文書に次のような回答を見つけた。

Unfortunately, the only way for your code to see the new version number is by closing the browser window. If you get an error code 2 (see “Error Codes”) and the database version you passed in for the old version matches the version in db.version, you should either assume that the version change already happened or display an alert instructing the user to close and reopen the browser window.

引用元: Safari Dev Center: Safari Client-Side Storage and Offline Applications Programming Guide: Using the JavaScript Database.

結局のところ挙動は問題ないのだけど、ブラウザを閉じるか再読み込みしないと利用者に反映されないということで、次のようなコードにして iPhone の UIWebView 用に移植する前段階として一旦作業を終えることにした。

try {
  if (window.openDatabase) {
  // db = openDatabase("BackgammonPositionsDB", "1.0", "Backgammon Positions DB", 200000); /* 現行バージョンの記述 */
  db = openDatabase("BackgammonPositionsDB", "2.0", "Backgammon Positions DB", 200000);2.0バージョンは開けずエラーをキャッチするので通常の処理は省略)
} catch(e) {
  if (e.code == DOMException.INVALID_STATE_ERR) { // Version number mismatch.
    var prevdb = openDatabase("BackgammonPositionsDB", "1.0", "Backgammon Positions DB", 200000);
    prevdb.changeVersion("1.0","2.0", 
      function(tx){
        tx.executeSql('ALTER TABLE BGPositions ADD COLUMN crawford INTEGER default 0;VACUUM;');}, 
        function(error){ /* SQLエラー処理 */ }, 
        function(){ /* 成功後初期化処理 */ });
    return;
  }
  alert("Unknown error " + e + ".");
}

またこの検証作業に関して SQLite のバージョンを戻す(1.0 に下げる)必要があり、前述した Apple の文書にもある ~/Library/Safari/Databases/ にあるファイルを削除して Safari を再起動するという若干面倒な手続きを取るしか方法がないので、Rails のような管理手法を Automator や AppleScript で作ることが望ましい気がした。

実際の iPhone 上の UIWevView ではどのような挙動になるのか、悩ましいことになるようであれば追って報告しようと思う。

No responses yet

Care to Safari browser more widely?

6月 09 2009 Published by hkitago under Safari

Google Chrome ブラウザが注目を集めているようだ。

404 Blog Not Found:chromium (google chrome for Mac) を早速試してみた
もう少し上までタブが来ていた方が、chromeっぽくていいとは思うけど。

ユーザーインターフェースだけで話をするなら、Safari ブラウザが持ついくつかのショートカットを覚えるだけで Google Chrome ブラウザのようになる。(注:バージョン4ベータ、USキーボード環境)

  • コマンド+/
  • コマンド+シフト+b
  • コマンド+シフト+\

これは、左手親指が常にコマンドキーを触っているよう習慣化されていれば不便さを感じることはないだろう。

更新:Safari 4が正式にリリースされたのだが、タブの位置や DebugSafari4TabBarIsOnTop コマンドが入らないといった設計に変更が見られた。これは Google への配慮なのだろうか、と気になるところだ。

Apple releases Safari 4 for Mac, Windows | E-mail and Internet | Macworld
Safari 4 Beta’s tabs-on-top feature, where Web page tabs were located at the very top of the window, is gone in the final release. Instead, tabs have returned to where they were in Safari 3, immediately below the bookmarks bar.

No responses yet

Safari and Caret browsing

3月 05 2009 Published by hkitago under Safari,iPhone

I’m using Safari 4 which is added new features. And I’m not sure whether the new one or not, I can use Caret browsing on Safari 4, but nobody seems to dare actually to mention it. Don’t you know that? OK, Let’s take a look to use your Safari web browser.

At first, select the words as a start point. I think it’s easy to double-click on the text of web-page. Then holding shift-key and navigation keys, for instance, right or left key to move caret on same line, up or down key to select multiple lines as you do on Mail or Text Editor application.


As a result, it’s more useful to use Evernote which is able to keep a scrap of web contents, also displayed on iPhone everywhere. (even if in child-care!)

One more thing: I’m unhappy, however, with the shortcut key to change the active tab of Safari 4, because I couldn’t use of it under Caret browsing as previously mentioned. The same can be said about the form elements since Safari 3.

No responses yet

Safari RSS Feeds

4月 21 2008 Published by hkitago under CSS,Safari

Safari ブラウザを 3.1.1 にアップデートしたところ RSS Feeds に読み込みに失敗するという問題が生じたが、こちらのディスカッションを参考に無事回復することができた。具体的には次の2つの、sqlite3 データベース用のファイルとキャッシュファイル格納用のディレクトリを一時的にデスクトップなどの適当な場所に移動した後、Safari を再起動するだけで良いが、RSS Feed の登録数によっては虹カーソルが回り続け、ドックの Safari アイコンを右クリックするとあたかもフリーズしたかのように “アプリケーションが応答しません” と言われるが、再構築まで少しの時間辛抱して待つ必要がある。

~/Library/PubSub/Database/Database.sqlite3
~/Library/PubSub/Feeds

さて、子供が産まれてからというものじっくりと机に向かうことが少なくなり RSS もリビングに設置してある Mac mini で閲覧することが増えてきたのだが、初期状態の見出しフォントが小さく、毎回フォントサイズを大きくする手間がストレスとなっていたため次の場所に置いてある CSS ファイルを編集した。

/System/Library/Frameworks/PubSub.framework/Versions/A/Resources/PubSubAgent.app/Contents/Resources/Main.css

余談まで、Finder で “コンピュータ” や “ホーム” といったショートカットを持たないディレクトリ移動は、以下のようにパスまでをクリップボードに入れた状態でコマンド+シフト+G を押すと良い。

しかし先日、OS の進化を支えてきたと言って過言ではない機能 “コピペ” を知らない方にお会いすることがあった。自分の親も然り、年配であれば無理もないと改めてユーザビリティについて思いにふけってしまった。確認まで、上のテキスト入力フィールドは “コピペ” を信じて設置している。
また、ブックマークレットのインストール(表現が硬いか?登録や設定という方が簡単かも)にもある種の敷居があることを発見した。PDF も良いと思うものの、説明はデモを録画することが最善な気がしている。

さて、font-family と font-size プロパティの値を変更しただけだが、以下のような画面表示となる編集済みのCSS ファイルを公開サーバー上に置いたので自力作業が面倒な方はバックアップを保存した上でお使い頂きたい。(このファイルの置換や編集には管理者権限が必要で作業には認証を求められる。)

最後に、どうして Safari の環境設定で RSS Feeds ページの見栄えを変更することができないのだろうと syndtheme.com というドメインを勢いで取得してしまったが、あまり需要が少なそうなのでサービスインするかどうか分からない…

No responses yet

Safari で 2ちゃんねるが見れない原因

2月 26 2008 Published by hkitago under JavaScript,Safari

今年になってから Safari を使って 2ちゃんねるを閲覧できないと妻から不満を言われていたので調べてみた。具体的には、扉ページから掲示板コンテンツに移動後、左メニューのリンクをクリックしてもページの遷移が発生しないが、コンテクストメニューから “リンクを新規〜で開く” を選択すると問題がない。そこで Debug メニューの JavaScript コンソールを確認したところ、右フレーム内に配置されているページで、ドメインやポートが一致しないにも関わらず JavaScript を実行しようとしていることに問題があるという。

そのドメインが異なるページにはこのような HTML の一行があり、1インラインフレームを使ってフラッシュムービーによる広告を読み込んでいるようだ。そしてこのPHPファイルからリダイレクトされ読み込まれる、第三の異なるドメイン置かれた HTML では writeFlash という JavaScript の関数が実行されていた。

しかし、今までの概念であれば当たり前のようなファイル構成であるし他のブラウザでは問題がないことからこの挙動には疑問があったが、Apple の文書にその答えを見つけた。

セキュリティアップデート 2007-009 について
Safari
CVE-ID:CVE-2007-5858
対象となるバージョン:Mac OS X v10.4.11、Mac OS X Server v10.4.11、Mac OS X v10.5.1、Mac OS X Server v10.5.1
影響:悪意のある Web サイトにアクセスすると、機密情報が漏洩する可能性がある。

説明:WebKit の機能によって、あるページからほかのページのサブフレームへのナビゲーションが可能になるため、悪意を持って作成された Web ページにアクセスすると、クロスサイトスクリプティング攻撃が引き起こされ、機密情報が漏洩する可能性があります。このアップデートでは、フレームのナビゲーションポリシーをより厳しくすることで、この問題を解決しています。

確かに、入力フォームから iframescript タグを使い、異なるのドメインに置いてあるファイルを埋め込み実行されるクロスサイトスクリプティング攻撃の仕組みを考えると、たとえミドルウェアで特殊文字を HTML エンティティに変換し忘れた致命的なミスがあったとしてもブラウザで防ぐことができるというのは良い設計だと思う。

結果的にマックユーザーが 2ちゃんねるを閲覧するには “セキュリティアップデート 2007-009″ を適用している Safari(あるいは Webkit を使ったブラウザと広義になるかもしれないが未確認) 以外で、ということになる。他のブラウザがこの仕様に追随するかどうかは分からないが、ウェブ開発者は注意しておく必要があるだろう。無論、現状でサイト設計者に変更を求めるのはシェアや広告主との絡みがあるので面倒が多いと思われる。

以上のことを妻に伝えたところ、Firefox やマカエレをインストールしてまで見たいとは思わない、ということだった。LOL

  1. 実際使われているインラインフレームのコードを引用して紹介していたが、同様の理由で Safari の RSS ブラウジングに問題が発生したため該当箇所を削除した。



更新1: Janetouch(リンク自主規制)を使うようになって放置してしまっていたこの問題だが、2008-03-18 リリースのSafari 3.1に含まれるセキュリティアップデートで解決しているようだ。

Safari 3.1 のセキュリティコンテンツについて
Safari
CVE-ID:CVE-2008-1002
対象となるバージョン:Mac OS X v10.4.11、Mac OS X v10.5.2、Windows XP または Vista
影響:悪意を持って作成された Web ページにアクセスすると、特定のサイトに書かれているスクリプトが別のサイトへとまたがって実行される(クロスサイト・スクリプティングの)可能性がある。

説明:javascript: URL の処理にはクロスサイト・スクリプティングの問題があります。攻撃者は、悪意を持って作成された Web ページにアクセスするようにユーザを誘導することで、別のサイトのコンテキストで JavaScript を実行する可能性があります。このアップデートでは、javascript: URL の追加検証を行うことで問題を解決しています。この問題の報告は、Google Information Security Team の Robert Swiecki 氏の功績によるものです。

挿絵のように 、2ちゃんねる側のエラー出力は変わっていないところを見るとブラウザが対応したのではないかと推測できる。

No responses yet