Tech Sketch Bucket of Technical Chips by TIS Inc.

FileAPIを利用して簡単なWebアプリをつくる

Pocket

HTML5の周辺技術のFileAPIを使ってblobURLを利用してどのようなことが出来るか、簡単なWebアプリケーションを作成して少しばかり触ってみました。

S3上の画像をCORSを利用してCanvasで使う

Pocket

Amazon S3でCross-Origin Resource Sharing(CORS)というものが使えるようになっていたようなので、クロスドメインで取得した画像をCanvasで利用する目的で実際に使ってみました。

DataURLとCanvasとドメイン

Pocket

HTML5の一要素として利用可能なCanvasのtoDataURL()メソッドからRFC2397("The data URL scheme")なども参照しつつ、DataURL形式の利用とドメインの制約などを取り上げます。

JavaScriptでバイナリファイルを扱う方法

Pocket

HTML5によって、<audio>や<video>などメディアファイルを扱う機能が拡充され、JavaScriptからも音声ファイルが取り扱えるようになりました。
各ブラウザ毎に対応状況は異なりますが、これらの機能を有効活用するためAjaxリクエストによって音楽のバイナリファイルを取得し、再生するまでのJavaScriptをまとめてみました。