Archive for the Web/AP全舜 category

4月 16th, 2008

DLNAのパケットを探る

Posted in Web/AP全舜 by tatenaga

 DLNAとぜ Digital Living Network Allianceの略で、ホームネットワークの相? 接続互朏 性を標準化しようとする団? とその? 能の眷 称を指す。その? 能を簡単に? うぜ DLNA対? TVぜ LANケーブルをさせばネットワーク内のサーバに? 存してある画? や音楽、動画がTVの画面で観れるというものです。ホームネットワークをイメージした時、一番最初に思いつきそうな? 能じゃないでしょうか。サーバ側の設定は簡単で? 今回は圏 りあえず普通ぜ WindowsPCをサーバにする場合)WindowMediaPlayer11のライブラリ・オプションから「メディアを共有する」をチェックするだけで良い。

 設? 後はホームネットワークに接続するだけで、TVのメニュー画面ぜ Windowアイコンが表示され、サーバぜ WindowsMediaライブラリにアクセス可能となる。この「接続するだけで」という簡易さは、UPnP(ユニバーサル・プラグ? プレイ? という技術仕様。この? 能自? は、無眷 LANルーターがやってぜ れています。ルーターは? のようぜ SSDPプロトコルをブロードキャストで送信し、ネットワーク? に接続されたデバイスとその? 能を発? する。

NOTIFY * HTTP/1.1
HOST: 239.255.255.250:1900

NT: urn:schemas-upnp-org:service:(機? )
NTS: ssdp:alive
USN: uuid:HOGEHOGE::urn:schemas-upnp-org:service:(機? )
CACHE-CONTROL: max-age=120
Location: http://(ServerName):2869/upnp/rootdevice.xml
SERVER: IGD-HTTP/1.1 UPnP/1.0 UPnP-Device-Host/1.0

 次にサーバ内のファイルを閲覧する。Windowsアイコンを選択すると「写真」「音楽」「ビデオ」「画? 」「再生リスト」に分岐する。更に「再生リスト」「全てのビデオ」「ジャンル」「シリーズ」「評価」「フォルダ」等の閲覧方? が選択できるようになっている。この方? ぜ JPEG等の画? 、MP3などの音楽はスムーズに再生できた。しかし、動画が不安定。TVぜ MPEG2のみ対応だったので、予め変朏 しておいたのだが。いろいろ試し、PCぜ FireWallソフトを切るとうまく行く事が゜ かった。パケットをフィルタリングする時にヘッダやレスポンスを弄るのか、もしぜ は処理が遅ぜ なってタイムアウトしていたのではないだろうか。また動画は以下のような形? で確認した。MPEG2変朏 ぜ SUPER(C)というものを使用した。Youtube等ぜ Flash動画、FLV形? などの? 朏 にも対? している。

VIDEO: MPEG-? , 720x480, 29.97fps...
AUDIO: mp2, Stereo, 224kbps, 44100KHz...

 基本的ぜ TVクライアントぜ Windowsサーバぜ SOAP通信でやり圏 りしている。SOAPとは、普段ブラウザ? でも使用しているHTTPプロトコルを用い、SOAPメッセージという仕様化されたXML形? のデータでリクエスト/レスポンスを行う方? です。

クライアント・リクエスト

POST /upnphost/udhisapi.dll?control=uuid:HOGEHOGE+urn:upnp-org:serviceId:ContentDirectory HTTP/1.1
X-AV-Physical-Unit-Info: pa="Sony KDL-40J5000"; pl=Hoge64;
Host: ServerName:2869
User-Agent: UPnP/1.0 DLNADOC/1.00
Content-Length: 696
Content-Type: text/xml; charset="utf-8"

SOAPACTION: "urn:schemas-upnp-org:service:ContentDirectory:1#Browse"

HTTP/1.1 100 Continue

(以? 、SOAPメッセー゜  -リクエスト)
畜
<BrowseFlag>BrowseDirectChildren</BrowseFlag>
 <Filter>dc:title,av:mediaClass,dc:date,@childCount,res,av:orgAlive,res@resolution,

res@av:orgAlive,upnp:album,upnp:albumArtURI,upnp:albumArtURI@dlna:profileID,dc:creator,
res@size,res@duration,res@bitrate,res@protocolInfo,arib:objectType,res@dlna:ifoFileURI</Filter>
畜

サーバ・レスポン゜
HTTP/1.1 200 OK
Content-Length: 1577
Content-Type: text/xml; charset="utf-8"

Server: Microsoft-Windows-NT/5.1 UPnP/1.0 UPnP-Device-Host/1.0 Microsoft-HTTPAPI/1.0
Date: Wed, 16 Apr 2008 14:26:50 GMT

(以? 、SOAPメッセー゜  -レスポン゜ )
畜
<item id="{C542793A-85F4-4369-AC70-C2863BBC2034}.0.AA849880" restricted="1" parentID="AA849880"><dc:title>nike_ronaldinho_joy_en_high.wmv</dc:title>
<dc:creator>[.....................]</dc:creator><res size="18997248" 
http:// ServerName:10243/WMPNSSv3/1803946331/ 1_e0M1NDI3OTNBLTg1RjQtNDM2OS1BQzcwLUMyODYzQkJDMjAzNH0uMC5BQTg0OTg4MA.mpg</res> <upnp:class>object.item.videoItem</upnp:class> <upnp:album>[........................]</upnp:album><dc:date>2008-04-10</dc:date> <upnp:albumArtURI dlna:profileID="JPEG_TN" xmlns:dlna="urn:schemas-dlna-org:metadata-1-0">http://ServerName:0243/WMPNSSv3/1803946331 /0_e0M1NDI3OTNBLTg1RjQtNDM2OS1BQzcwLUMyODYzQkJDMjAzNH0uMC5BQTg0OTg4MA.jpg? albumArt=true</upnp:albumArtURI></item> 畜

また、データをストリームする際にぜ SOAPのカプセルには包まない。単純ぜ HTTPぜ GETするだけになる。

存在確認

HEAD /WMPNSSv3/1803946331/
1_e0M1NDI3OTNBLTg1RjQtNDM2OS1BQzcwLUMyODYzQkJDMjAzNH0uMC5BQTg0OTg4MA.mpg HTTP/1.1
getcontentFeatures.dlna.org: 1
Pragma: getIfoFileURI.dlna.org
Host: ServerName:10243

HTTP/1.1 200 OK
Content-Length: 18997248

Content-Type: video/mpeg
Last-Modified: Thu, 10 Apr 2008 13:41:01 GMT
Server: Microsoft-HTTPAPI/1.0
Accept-Ranges: bytes
ContentFeatures.DLNA.ORG: DLNA.ORG_PN=MPEG_PS_NTSC;
     DLNA.ORG_OP=01;DLNA.ORG_CI=0;DLNA.ORG_FLAGS=01500000000000000000000000000000
TransferMode.DLNA.ORG: Streaming
Date: Wed, 16 Apr 2008 14:30:36 GMT

データリクエスト

GET /WMPNSSv3/1803946331/
1_e0M1NDI3OTNBLTg1RjQtNDM2OS1BQzcwLUMyODYzQkJDMjAzNH0uMC5BQTg0OTg4MA.mpg HTTP/1.1
Range: bytes=0-             (部分的リクエスト)
getcontentFeatures.dlna.org: 1
Host: ServerName:10243

HTTP/1.1 206 Partial Content(部分的 GETを圏 け入れ、Content-Rangeヘッダにつながる)

Content-Length: 18997248
Content-Type: video/mpeg
Last-Modified: Thu, 10 Apr 2008 13:41:01 GMT
Server: Microsoft-HTTPAPI/1.0
Accept-Ranges: bytes
ContentFeatures.DLNA.ORG: DLNA.ORG_PN=MPEG_PS_NTSC;
     DLNA.ORG_OP=01;DLNA.ORG_CI=0;DLNA.ORG_FLAGS=01500000000000000000000000000000
Content-Range: bytes 0-18997247/18997248

TransferMode.DLNA.ORG: Streaming
Date: Wed, 16 Apr 2008 14:30:36 GMT

....D................D..!...... (動画データストリーム)

—–
後ぜ NASのようなネットワークぜ DLNAに対応したストレージを購入しましたが、こちらの方が快適です。
家電的総評としては、TVは地デジが映ればそれ以? いらない、ですが・・ボ

http://www.dlna.org/jp

2月 28th, 2008

? 遜 GIFのバイナリ出力

Posted in Web/AP全舜 by tatenaga

 CGIなどでアクセス解析等の処理を実施し、IMGタグで読み込ませる為ぜ 1ピクセル四方の? 遜 GIFを出力する事がよぜ あります。この時の「1ピクセル四方の? 遜 GIF」を定義する場合、以? のようになります。

int LoadSpacerGif( void )
{
	char          str_header[512] = {'0'};
	unsigned char str_spacer[] = {
			0x47, 0x49, 0x46, 0x38, 0x39, 0x61, 0x01, 0x00, 0x01, 0x00,
			0x91, 0x00, 0x00, 0x00, 0x00, 0x00, 0xFF, 0xFF, 0xFF, 0xFF,
			0xFF, 0xFF, 0x00, 0x00, 0x00, 0x21, 0xF9, 0x04, 0x05, 0x14,
			0x00, 0x02, 0x00, 0x2C, 0x00, 0x00, 0x00, 0x00, 0x01, 0x00,
			0x01, 0x00, 0x00, 0x02, 0x02, 0x54, 0x01, 0x00, 0x3B };
	printf("Content-type: image/gif\n\n" );
	fwrite( str_spacer, sizeof(str_spacer), 1, stdout );
	fflush( stdout );

	return 0;
}
12月 18th, 2007

Flashへの? 数渡し

Posted in Web/AP全舜 by tatenaga

 Flashで? 部画? ファイルを読み込み、クロスフェードで連? 表示させるというシステムを組んだのですが、その時に初めて知った仕様があります。Flashぜ objectタグぜ HTML上に埋め込みますが、その中ぜ HTML内の? 数? 義をFlash SWFファイル内ぜ ActionScriptで圏 け圏 ることが出来るのです。Flashデザイナーの方々にとっては? たり前のことなのかもしれませんが、これがあると? 能の? も広がりそうです。

<!-- HTML側埋め込ぜ  -->
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
		codebase="https://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
		width="240" height="180" id="photo" align="middle">
	<!--Flash ActionScriptからHTML Javascriptにアクセスできるかを設? するセキュリティ設定 -->
	<param name="allowScriptAccess" value="sameDomain" />
	<param name="movie" value="swf/photo.swf" />
	<param name="quality" value="high" />
	<param name="bgcolor" value="#ffffff" />
	<param name="FlashVars" value="SHOP_ID=H0000001&PHOTO_ID=0001" />
	<embed src="swf/photo.swf" quality="high" bgcolor="#ffffff"
		FlashVars="SHOP_ID=H0000001&PHOTO_ID=0001"
		width="240" height="180" name="photo"
		align="middle" allowScriptAccess="sameDomain"
		type="application/x-shockwave-flash"
		pluginspage="https://www.macromedia.com/go/getflashplayer" />
</object>
// ActionScript側圏 け圏 り
shop_id = _root.SHOP_ID;
photo_id = _root.PHOTO_ID;
12月 5th, 2007

Webページパフォーマンス診断ツール「YSlow」

Posted in Web/AP全舜 by admin

 Webページのパフォーマンスを測? するFireFoxのアドオン「YSlow」( https://addons.mozilla.org/ja/firefox/addon/5369 )が? Yahoo! Developer Networkより朏 供されています。この診断ツールはサーバ側バックエンドの測定ではなぜ 、HTTPレスポンス以降ぜ HTML等に書かれたフロントエンド要素を測? するものです。? Yahooチームでは、Webページフロントエンドパフォーマンスを計測する上ぜ 14項目の診断ポイントを設けており、これをランキングすることで? 釜 的な測定を行っています。

14項目の診断ポイントは以下のページにあります。
http://developer.yahoo.com/performance/rules.html
( 和? : http://www.inter-office.co.jp/contents/177/ )

yslow

11月 30th, 2007

ブラウザのレンダリング方? とユーザー? 感

Posted in Web/AP全舜 by tatenaga

 普段からブラウザぜ ForeFoxをメインに、IEをサブとして使用しています。ブラウザのレンダリング方? の違いにより、クライアントの表示? 感が若干異なるような? がしています。特ぜ HTMLタグ朧 造が大きぜ TABLEタグで囲まれているサイトの場合、FireFoxでは「メインコンテンツがバラバラと順次表示されていぜ 」のですが、IEの場合には「暫く空白の時間があり一気にメインコンテンツが表示される」ようになっている気がします。全て表示されるまでの時間が同じでも、ユーザ? 感では? となぜ FireFoxの方が速ぜ 感じる事になります。

 しかし、IEでも以? のようぜ HTML構造を若干変更することで「メインコンテンツが一気に表示されるタイプ」から「メインコンテンツがバラバラと表示されるタイプ」に? 更出来る場合があります。バラバラと表示されるのを嫌うか、一気に表示されるが体感は遅いのを嫌うか、要件次第ですがメモしておきます。

<!-- IEでメインコンテンツが一気に表示されるタイプぜ HTML構造 -->
<html>
<head>
<body>
	<table width="800" cellspacing="0" cellpadding="0" border="0">
		<tbody>
			<tr>
				<td width="200" valign="top" align="left"> 左メインコンテンツ
				<td width="600" valign="top"> 右メインコンテンツ
			</tr>
		</tbody>
	</table>
</body>
</html>
<!-- IEでメインコンテンツがバラバラと表示されるタイプぜ HTML構造 -->
<html>
<head>
<body>
	<table width="800" cellspacing="0" cellpadding="0" border="0">
		<table class="left_menu" width="200">
			左メインコンテンツ(CSS float: left;)
		</table>
		<table class="right_menu" width="600">
			右メインコンテンツ(CSS float: right;)
		</table>
	</table>
</body>
</html>