mixiアプリでcss,js,img などの外部ファイルを使用するときの注意点をメモ
mixiアプリでcssを使うときには気をつけなきゃいけないことがあったので、メモ。
１．キャッシュを無効化する方法
opensocial には大きく別けて、４つのキャッシュが存在します。
- ガジェットXMLのキャッシュ
- makeRequestでアクセスされる外部APIのキャッシュ
- featureを固めたJavaScriptのキャッシュ
- JavaScript、CSS、imgなどHTMLからリンクされたリソースのキャッシュ
この４つです。
今回は、一番下の
『JavaScript、CSS、imgなどHTMLからリンクされたリソースのキャッシュ』
の回避方法をメモ。
<link href="http://sample.com/sample.css" rel="stylesheet" type="text/css">
こんな感じ。
しかし、mixiアプリはキャッシュが強力なので、すぐにcssされます。
これは、実際に公開した後は負荷を減らしてくれて便利ですが、開発中は不便なことこの上ありません。
htmlのキャッシュは『アプリ設定画面』の『キャッシュを消去』から消すことができますが、cssは過去のキャッシュを読み続けて、全く反映されないってこともしばしば・・・。
gadget XMLにキャッシュ無効の記述を行う。
opensocial には Content Rewriter という機能があり、この記述をXMLに書くことでキャッシュを制御できます。
こちらのサイト様に詳しく書いてありました。
Tender Surrender » content-rewite機能で外部ファイルのキャッシュを制御する
86400
excluded
moreexcluded
true
true
true
- expires: キャッシュの有効期限を秒で指定。デフォルトは86400秒(24時間)。
- include-url: キャッシュしたい外部コンテンツのURLを指定。"*"アクタリスクが使える。".gif"などとすると、前後にアスタリスクがあるものと想定される。繰り返し可。
- exclude-url: キャッシュしたくない外部コンテンツのURLを指定。適用方法はinclude-urlと同じ。
- minify-css: CSSファイルの内容を圧縮してキャッシュするかどうかを"true"または"false"で指定。デフォルトは"true"
- minify-js: JSファイルの内容を圧縮してキャッシュするかどうかを"true"または"false"で指定。デフォルトは"true"
- minify-html: HTMLファイルの内容を圧縮してキャッシュするかどうかを"true"または"false"で指定。デフォルトは"true"
そこでこんな記述をXMLに加えてみましょう。
<ModulePrefs title="use Social Data">
<Require feature="opensocial-0.8"/>
<Optional feature="content-rewrite">
<Param name="exclude-urls"></Param>
<Param name="exclude-urls">.*</Param>
<Param name="include-tags"></Param>
</Optional>
</ModulePrefs>これで、css 及び、全ての外部ファイルがキャッシュされなくなります。
キタコレ〜
