リンク集的メモ。
今夜つける HTTPレスポンスヘッダー （セキュリティ編） - うさぎ文学日記の中で、よく知らなかったヘッダーについて調べたメモ。
いくつかのヘッダーについてのブラウザ別のサポート状況はこちら。
（ちょっと古いが、少なくともこれ以降のバージョンではサポートしているということは分かる。）
↓
IPA ISEC セキュア・プログラミング講座：Webアプリケーション編 第8章 マッシュアップ：クライアントサイドマッシュアップ: #4 対策に利用できる技術
X-XSS-Protection
IE8以降のXSSフィルターはデフォルトで有効になっている（ブロッキングモードではない）。
↓
Security through HTTP response headers
[IEInternals] XSS フィルターを制御する | Hebikuzure's Tech Memo
Internet Explorer 8 には、XSS フィルターとして知られている、反射型クロスサイト スクリプティング攻撃を防止するのに有効な画期的新機能があります。このフィルターは既定ではインターネット ゾーン、信頼済みサイト ゾーン、制限付きサイト ゾーンで動作します。
X-XSS-Protection: 1; mode=block
CSP is quite usable in Chrome 16+, Safari 6+, and Firefox 4+, and has (very) limited support in IE 10.
Content-Security-Policy:
default-src 'self';
script-src 'unsafe-inline' *;
img-src data: *;
frame-src *;
font-src *;
style-src 'unsafe-inline' *;
report-uri /csp-report.php
Titanium Stuidoで作ったAndroidアプリをMarketに登録できる証明書付きapkファイルにする手順は下記の通り。
app.jsを下記の2行にする。（URLは起動したいURLにする。）
Ti.Platform.openURL("http://www.google.co.jp/"); // Googleの場合
Ti.Android.currentActivity.finish(); // ブラウザを起動したらアプリ本体は終了させる
ブラウザで表示している画面のスクリーンショットを撮るプラグインのメモ。
Zoom.itはMicrosoftのLive Labsが作ったWebページに埋め込める画像Viewer。
もともとはSeadragonという名前だったようだ。（参考：巨大な画像のビューアーを作ってくれる『Seadragon』 - 100SHIKI）
画像のURLを指定すると、その画像をZoom.it側で取り込んで、表示できるようになる。
Zoom.it側で取り込むので、見るときはZoom.itの発行するURLで見るか、埋め込み用のJavaScriptを自分のサイトに埋め込んで見る。
画像のファイルサイズは無制限のようだ。（参考：Zoom.it - FAQ）
Web公開用画像の外部ストレージサービスとしても使えるのかな．．．！
そしてこれ、画像だけでなく、実はWebページのキャプチャもしてくれる。URLとして、画像のURLの代わりにWebページのURLを入力するだけ。
UTF-8のページなら日本語でも問題なくキャプチャできた。（Shift_JISの場合は文字化けした。）
注意点としては、一度Zoom.itに取り込ませた画像は削除も変更もできない。「あなたがそのURLを公開しない限りは見つかることはないから大丈夫だよ」（Zoom.it - FAQ）と言われても、公開してしまったら後で困るかもしれないので慎重に？
これを作ったMicrosoftのLive LabsはBing部門に吸収された（参考：Microsoft Live Labs）ようだが、今後Zoom.itはどうしていくつもりなんだろう？
FlickrのようなCGMとして展開していかないのかな。
ところでZoom.itはGoogle Analyticsが仕込んである。MSも自前でアクセス統計を持ってなかったっけ？
使いどころは思いつかないがメモしておく。
$path = 'path/to/target.gif';
$uri = 'data:' . mime_content_type($path) . ';base64,';
$uri .= base64_encode(file_get_contents($path));
echo '<img src="' . $uri . '" />';
4つ見つけた。
getimagesizeを使う方法
$info = getImageSize($path);PHPのGD拡張が必要。
echo $info['mime'];
echo image_type_to_mime_type(exif_imageType($path));前提としてPHPのExif拡張が有効になっている必要あり。（参考：PHP: インストール手順 - Manual）
echo mime_content_type($path);シンプルで良いのだが、なぜか非推奨。
$info = new FInfo(FILEINFO_MIME_TYPE);PHP5.3以降で使える。それ以前はPECL拡張だった（参考：PHP: インストール手順 - Manual）
echo $info->file($path);
とりあえずよく使いそうな機能はこんなとこか。
楕円書いたりいろいろできるみたいだけど、使うかな？
四隅を角丸にしたいかも．．．
<?php
$string = 'こんにちはこんにちは！';
$fontSize = 12;
$padSize = 10;
$angle = 0; //角度を指定できる
$fontPath = 'C:/WINDOWS/Fonts/MSGOTHIC.TTC'; //Windowsの場合
try {
//文字列の大きさを取得 http://jp2.php.net/imageTtfBBox
$box = imageTtfBBox($fontSize, $angle, $fontPath, $string);
if ($box === false) {
throw new Exception('imageTtfBBox()失敗');
}
$boxWidth = abs($box[2] - $box[0]);
$boxHeight = abs($box[7] - $box[1]);
//キャンバス生成 http://jp2.php.net/imageCreateTrueColor
$width = $boxWidth + $padSize * 2;
$height = $boxHeight + $padSize * 2;
$img = imageCreateTrueColor($width, $height);
if ($img === false) {
throw new Exception('imageCreateTrueColor()失敗');
}
//背景色と文字色をそれぞれ造る
// http://jp2.php.net/imageColorAllocate
// http://jp2.php.net/imageColorAllocateAlpha （透過の場合）
$red = 0xFF;
$green = 0x00;
$blue = 0x00;
$bgColor = imageColorAllocate($img, $red, $green, $blue);
if ($bgColor === false) {
throw new Exception('imageColorAllocate()失敗');
}
$red = 0xFF;
$green = 0xFF;
$blue = 0xFF;
$alpha = 20; //0～127。127は完全に透明
$textColor = imageColorAllocateAlpha($img, $red, $green, $blue, $alpha);
if ($textColor === false) {
throw new Exception('imageColorAllocate()失敗');
}
//キャンバスに色を塗る http://jp2.php.net/imageFill
$startX = 0;
$startY = 0;
if (!imageFill($img, $startX, $startY, $bgColor)) {
throw new Exception('imageFill()失敗');
}
//文字を書く http://jp2.php.net/imageTtfText
$startX = $padSize;
$startY = $boxHeight + $padSize; //左下の座標を指定する
if (!imageTtfText($img, $fontSize, $angle, $startX, $startY, $textColor, $fontPath, $string)) {
throw new Exception('imageChar()失敗');
}
//出力（第2引数にファイルパスを渡すとファイルに保存する）
$type = 'gif';
header('Content-type: image/' . $type);
switch ($type) {
case 'gif': // http://jp2.php.net/imageGif
$result = imageGif($img);
break;
case 'jpeg': // http://jp2.php.net/imageJpeg
$quality = 100; //0～100。大きいほど高品質。デフォルトは75
$result = imageJpeg($img, null, $quality);
break;
case 'png': // http://jp2.php.net/imagePng
$quality = 0; //0～9。小さいほど高品質
$result = imagePng($img, null, $quality);
break;
}
if (!$result) {
throw new Exception('出力失敗');
}
} catch (Exception $e) {
header('Content-type: text/html');
echo $e->getMessage();
}
//後始末 http://jp2.php.net/imageDestroy
if ($img && !imageDestroy($img)) {
throw new Exception('imageDestroy()失敗');
}
（2010/09/02:情報が古くなっていたので全面的に改定）
Google Codeにあるもの（全て英語）
Google Maps JavaScript API V2 Reference - Google Maps JavaScript API V2 - Google Code
半分にするならこんな感じ。
<img src="test.jpg" alt="test" onload="this.width /= 2" />
<img src="test.jpg" alt="test" onload="this.width = Math.min(this.width, 100)" />
動的にsrc属性の値を変えた時、かつ変更前と変更後のsrc属性の値が同じ場合にonloadが実行されるかどうかが違う。
IE（7）、Firefox（3.5）ではonloadが実行されたが、Safari（4）では実行されなかった。
テスト用コード
<img src="test.jpg" alt="test"
onload="alert('Loaded!')"
onclick="this.src = 'test.jpg'" />
<img src="test.jpg" alt="test"
onload="alert('Loaded!')"
onclick="this.src = 'test2.jpg'" />
IE6では透過PNGが透過しない。それを無理やり透過させてしまうJavaScriptライブラリを調べたメモ。
//例：Railsによる更新タイムスタンプ付与への対応
.search(/\.png$/) → .search(/\.png(\?[0-9]+)?$/)
JavaScriptで画像を定期的に入れ替え。かつエフェクト効果を付けたい。
コマンド一発で済みそうなのを軽く探してみたけど、要件を満たすライブラリが見つからなかった。で、自分で書いたらこうなった。
諸事情によりprototype.js系にした。
需要はありそうだと思ったけど、そうでもないのかな？
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js"></script>
<script type="text/javascript">
var urls = ["foo.jpg", "bar.gif"]
var i = 0;
Event.observe(window, "load", function() {
var img = $("img");
setInterval(function() {
img.visualEffect("Fade", {duration: 1});
setTimeout(function() {
img.src = urls[i];
i++;
if (i == urls.length) {
i = 0;
}
img.visualEffect("Appear", {duration: 1});
}, 1500);
}, 4000);
}, true);
</script>
初めてPhotoshopに触れた。WindowsのペイントツールやFlash（Playerではなく編集ツールの方）みたいに使えるかと思っていたが、Ctrl＋C/X/Vが使えなかったりして使い勝手が全然違う。
既存のPhotoshopのファイルに別の画像ファイルを取り込む方法すら分からない。
哲さんの雑記帳: Photoshop CS2で2枚の写真を連結して、1枚の写真にする方法です。 JTrimですと簡単に出来ますが、あえてPhotoshopで挑戦してみました。（タイトル長い）を参考にしてやった分かった。
Windowを隣に並べてドラッグ＆ドラッグすると。
さすがMac出身のソフト。マウスがメインか。
1. 新規会員登録後に送られてくるメールに付いている画像
携帯サイトの場合、キャリア・機種によって絵文字の出力、表示可能データ量、画面の大きさなどが異なる為、キャリア・機種判別、絵文字の出し分け等、携帯サイト向けの知識が不可欠です。参考：
mod_ktaiを使用すると、それらの処理を簡単に行なうことが可能です。
国内の主要携帯(3キャリア)向けコンテンツ変換ミドルウェアをApache2.x用のモジュールとして作成します。参考：ke-tai.org > Blog Archive > 携帯向け自動変換用Apacheモジュール「mod_chxj」が0.10系にバージョンアップ
CHTMLや通常のHTMLで作成したコンテンツを出力時にUserAgentを見てそれぞれの端末用に変換します(画像はJPG、GIF、PNGからJPG、GIF、PNG、BMPへ)。
QRコード生成機能付。
mod_cidr_lookupは、アクセスしてきたクライアントのIPアドレスが、起動時に読み込んでおいたCIDRブロック群のいずれかにマッチするかどうかを判別するためのモジュールです。参考：DSAS開発者の部屋:ケータイやクローラの判別などに使えるmod_cidr_lookupを公開しました
探したら3つあった。
yumでインストールできるらしいが、やり方が分からなかったので地道にやる。
tarの最新版のバージョンはSourceForgeのLinux用tarのDownloadページで確認。
wget http://nchc.dl.sourceforge.net/sourceforge/opencvlibrary/opencv-1.0.0.tar.gz
tar xvzf opencv-1.0.0.tar.gz
cd opencv-1.0.0
# 文字化け解消。viで開いて1137行目の文字化け文字を削除
vi cvaux/include/cvaux.h
# makeにはけっこう時間がかかる。
./configure
make
make install
# ライブラリのパス設定。viで新規ファイルを作り、「/usr/local/lib」とだけ記述して保存。
vi /etc/ld.so.conf.d/opencv.conf
ldconfig
export PKG_CONFIG_PATH=/usr/local/lib/pkgconfig:${PKG_CONFIG_PATH}
skuare.net : 画像関連 アーカイブから選別した。（←それにしても、このサイトのJavaScriptデータは物凄いことになってる。）
投稿
すべてのコメント
