PHPの中に埋め込んだxml(svg)の処理でハマる[追記あり]

2016年4月6日iPad/iPod/iPhone,Mac,Web-log・ココログ関連,WordPress

絶滅危惧種のアクセスカウンタを、本ウェブサイトに貼り付けています。PHPで処理していて、MySQLのデータベースの値を画像化しています。今までは、ガラケー用にはGIFを、それ以外にはPNGを提供していました。

アクセスカウンタSVG

「SVG形式(Scalable Vector Graphics)にした方が、データサイズが小さくなって、処理も軽くなって、ブラウザへの表示時間が短くなるのでは?」と思い、SVGで表示するようにしました。次の画像は、画面キャプチャです。

アクセスカウンタSVG

違いにしたら、これだけの事なのですが、Firefox/Safariに何も表示されなくて、非常に困りました。まったく手がかりがつかめず、原因究明まで、かなりの時間を費やしました。

SVGフォーマットである事を示すために、HTTPヘッダは、"Content-Type: image/svg+xml"にし、出力される一行目は次の設定を入れる必要があります。

<xml version="1.0" encoding="UTF-8" standalone="no"?>

最初、この一行をPHP構文の外側に直置きしてました。テスト環境(VCCW)ではそれでも動いていました。ところが、本番環境(GoDaddy)に持って行ったら、動きません。画面に表示されないというか、データがまったく返ってこない(0Byteとなる)のです。

PHPファイルへの直書きを止めて、echoで出力する様にしたら正しく表示される様になりました。

テスト環境と本番環境で、PHPはマイナーバージョンまで同じです。ビルドオプションは違う様です。ですが、真の原因がどこにあるかを探すのは大変です。

SVGにした事で、PNGに比べてデータ量が半分くらいになったのですが、処理時間はあまり変わらない事がわかりました。データ転送や表示に時間がかかっているのではなく、MySQL(データベース)の処理時間が支配的の様です。

はぁ〜。それでも、転送量が少なくなるから良い事にしよう。といっても、1kバイトのデータが半分くらいになっただけです。効果薄い!

念のためと思って、iPhoneで表示させたら、外枠は出るのにカウンタ部分が表示されません。なぜだ〜。

もう、原因究明をする気力が残っていません。元の設定に戻しました。

SVGについては、次のウェブサイトが詳しいです。ありがとうございます。

(追記 2015-06-20 23:37)

SVG1.1では、そもそもxml宣言が不要だそうです。ありがとうございます。無駄に悩んでいました…。

xml宣言をつけたのは、Wikipediaにあった交通標識のSVGを見ていたからです。確かに、1.0と書かれてます。

次のウェブページも見てました。

こちらだと、xml宣言はないですね。

サンプルじゃなく、ちゃんとしたドキュメントを見ないとダメですね。

ちなみに、動かなかったスクリプトは、次の様な書き方をしています。バージョン指定が矛盾していますね。

else : // SVG出力
?>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg version="1.1"
     baseProfile="full"
     xmlns="http://www.w3.org/2000/svg"
     width="100" height="25">
                       
     <rect x="0" y="0" width="100" height="25" fill="rgb(249,178,0)"/>
     <text x="50" y="12.5" fill="black" font-weight="bold" font-style="italic" text-anchor="middle" dominant-baseline="central"><?php echo $count;?></text>
</svg>
<?php endif; ?>

(追記 2015-06-21 00:32)

さらに情報をいただきました。ありがとうございます。

(追記 2015-06-21 00:49)

そして、訂正も。ありがとうございます。XMLとSVGのバージョンは、それぞれ別と言うことです。確かに、その通りですね。

いろいろ、基礎からやり直したいです。「とりあえず、解決できればいいや。」と言う姿勢が良くないのでしょうね。

[amazonjs asin="B00IK7TOIY" locale="JP"]

Posted by お市のかた