WordPressで出力したXMLをFlashで表示してみる備忘録 : その3

この記事をフルスクリーンで見るフルスクリーンモードを終了するには Esc キーを押してください。または、ココをクリックしてください。

前回の記事で、WordPressが出力した XML ファイルを Flash で表示することが、一応できました。
ただ、前回も書いた通り『<』などの記号が文章中あるとパースエラー(XML Parsing Error)になります。
エラーを回避する方法として、最初に思いつくことは『URL エンコード・デコード』を使うということです。
それ以外の方法もあると思いますが、取り敢えずサンプルを作りましたので、まず見ていただければうれしい… :D

XMLを読み込むFlashサンプル

上記のコンテンツは、このブログの最新記事5件の概要を表示して、そこから各記事を表示するという簡単な Flash Blog です。
本文の表示などで気になるところもあると思いますが、この Flash コンテンツの説明は後ほど…

で、本題の『URL エンコード・デコード』についてですが、まず、PHP の URL 関数を見てみる。
PHP: PHP マニュアル – Manual によると2種類の URL エンコード・デコードがあるようです。

  • rawurldecode ? URL エンコードされた文字列をデコードする
  • rawurlencode ? RFC 1738 に基づき URL エンコードを行う
  • urldecode ? URL エンコードされた文字列をデコードする
  • urlencode ? 文字列を URL エンコードする

違いは何かというと、

PHP: rawurlencode – Manual

-_.を除くすべての非アルファベット文字をパーセント 記号 (%)に続いて 2 つの 16 進数がある表現形式に 置き換えた文字列を返します。

PHP: urlencode – Manual

-_. を除くすべての非英数文字が % 記号 (%)に続く二桁の数字で置き換えられ、 空白は + 記号(+)にエンコードされます。

ということです。
特にスペース(空白)が、rawurlencode では ” %20 “urlencode では ” + 記号 “ にエンコードされるというのが大きな違いでしょうね。
ということなので、通常であれば rawurlencode を使って、

<?php /*
Template Name: sampleXML
*/ ?>

<?php header('Content-Type: text/xml; charset='.get_option('blog_charset'), true); ?>
<?php echo '<?xml version="1.0" encoding="'.get_option('blog_charset').'"?'.'>'; ?>

<root>
 <content><?php ephp echo rawurlencode(get_the_content()); ?></content>
</root>

のようにすればいいと思います。
あと、WordPress の関数として attribute_escape というのがあります。
これは、『<』、『&』、『>』などのパースエラー引き起こすタグを消去してくれる関数です。
ということは、

<?php /*
Template Name: sampleXML
*/ ?>

<?php header('Content-Type: text/xml; charset='.get_option('blog_charset'), true); ?>
<?php echo '<?xml version="1.0" encoding="'.get_option('blog_charset').'"?'.'>'; ?>

<root>
 <content><?php ephp echo attribute_escape(get_the_content()); ?></content>
</root>

と、してもいいのではないでしょうか?
ただし、前回の記事でも取り上げた『数値実体参照』を使うようです。

というわけで、上記の方法でエンコードすれば、パースエラーを引き起こすことはなくなると思います。
あとは、『Flash 側でどれだけ正確にデコードしてくれるか』ということなのですが、今のところ問題なさそうです。
まぁ、細かい検証はできていませんけど…

検証といえば、XML の『CDATAセクション』を使用するというのはどうなんだろう?
全然検証していないのですが、

<?php /*
Template Name: sampleXML
*/ ?>

<?php header('Content-Type: text/xml; charset='.get_option('blog_charset'), true); ?>
<?php echo '<?xml version="1.0" encoding="'.get_option('blog_charset').'"?'.'>'; ?>

<root>
 <content>< ![CDATA[<?php the_content(); ?>]]></content>
</root>

と、いうような書き方もアリなんでしょうか?
これから、時間のあるときに検証していこうかな…

最後にサンプルコンテンツについて。
ブログの内容はもちろんですが、背景画像や BGM も WordPress で管理しています。
例えば、背景画像を変更したければ WordPress でアップロードし、ファイル名を記述するだけで背景画像が入れ替わります。
今回は、5件の最新記事だけですが、月別アーカイブやカテゴリアーカイブもできると思います。
ただ、基本的なテンプレートタグだけで『単一記事』の内容をどう XML 出力するかというのが、よくわかりません。
もっと頭を働かさないとねぇ… :-)
それこそ、全部の記事を XML 出力すればいいのでしょうが、記事が100件や500件など多くなればそれも大変ですよね。
記事に ID が振り分けられるので、それを利用すればできそうですが、Flash とのやりとりで何かしらのプログラムが必要な気がする。
PHP でプログラムすればできそうですけど、私にはお手上げかも… :(

それと、『単一記事』のエンコードを rawurlencode ではなく urlencode を使っています。
というのも、通常のブログ記事を表示していますので Flash が対応していない表示(スタイルシート)があったり、本文中のリンクや画像を削除するために、敢えて urlencode を使っています。
Flash ブログ専用にして、それなりのルールを決めれば rawurlencode でも問題ないと思います。
urlencode を使うと『<img>』タグなどが認識されなくなるみたい。
” + 記号 “ が頻繁に出てくるので鬱陶しいと思いますが、お許しを…
Flash がサポートしている スタイルシートのプロパティが、もうちょっと充実すればいいのにね。
そうそう、CSS の『display』はサポートしているとリファレンスガイドに書いてあるのに、利かないときがあるようです。
このあたりももっと検証してみないとね。

フルスクリーン・モードを使ってみたりしてちょっと遊んでいますが、以前作った『Movable Type を利用した Flash のブログとフォト・ギャラリー』と同じように、「こんなことができるんだぁ。」という参考になればうれしいです。

何か「ココがおかしいぞ。」とか「こうすればいいのでは?」などのご意見やコメントいただけるとありがたいです。
あまり、突き詰めて作っていませんので技術的な質問は、わからないかも… :)
というか、AS3.0がよくわからん。(AS2.0 もわかっているかと言われれば…)

  • このエントリーをはてなブックマークに追加

フルスクリーンモードを終了するには Esc キーを押してください。または、ココをクリックしてください。