by WebSurfer
20. June 2010 13:22
先のエントリ WP-Cumulus(3) で書きましたように、Widget の Tagcloud に WP-Cumulus を導入しましたが、その後 reCaptcha が表示されなくなっているのに気がつきました。
調べてみると、reCaptcha を表示するための JavaScript で、「'Recaptcha' は宣言されていません。」というエラーが出ています。
Widget の Tagcloud の WP-Cumulus を動かすため、Flash Player を起動する JavaScript を追加しましたが(詳しくは WP-Cumulus(3) を参照)、原因はどうやらこれと reCaptcha を起動するするスクリプトとの相性のようです。
WP-Cumulus の Flash Player 用の JavaScript を、reCaptcha 用の JavaScript より先に起動すれば問題はないのですが、逆だとダメでした(Widget の Tagcloud に WP-Cumulus を表示しようとすると、どうしても逆になってしまいます)。
タイミングの問題かと思って、setTimeout を使って reCaptcha 用の JavaScript の起動を遅らせてみたんですが、同じ結果でした。
BlogEngine の App_Code\Extensions\Recaptcha\RecaptchaControl.cs の中で、reCaptcha 本家のサイトからスクリプトをダウンロードしてくる設定になっています(下記参照)。"宣言されていません" というエラーになる Recaptcha はその中に定義されています。
<script type="text/javascript" src="http://api.recaptcha.net/js/recaptcha_ajax.js" defer="defer">
理由は全く不明ですが、recaptcha_ajax.js をダウンロードしてローカルに置いて、ローカルのファイルを参照するように変更したら、エラーは出なくなりました。
具体的には、RecaptchaControl.cs の中の RenderContents メソッドで、以下のように変更しました。
//output.AddAttribute("src", "http://api.recaptcha.net/js/recaptcha_ajax.js");
output.AddAttribute("src", "/BlogEngine/recaptcha_ajax.js");
本当にこれだけで問題解決になっているかイマイチ疑問ですが(汗)、とりあえずこのまま様子を見るつもりです。
***************** 2010/6/23 追記 *****************
やっぱり上記の処置では問題解決になっていませんでした。(涙)
reCaptcha を管理している google のサイトによると、recaptcha_ajax.js をダウンロードして自サーバーに置くのは、"Caching the reCAPTCHA javascript increases the risk that we might accidentally break your site in an upgrade." という理由で好ましくないとのことです。やむを得ず元に戻して、reCaptcha のサーバーからダウンロードするようにしました。
でもそうすると、IE ではスクリプトエラーが出て reCaptcha が動かなくなってしまいます。script タグから defer 属性を削除するとエラーを回避できるので、そうしてみましたが、今度は表示の遅れが目立つようになってしまいました。その問題を解決するため(defer 属性をつけたままでもスクリプトエラーが出ないようにするため)、問題のスクリプトの位置を HTML コードの最後の方になるように変更しました。そのため、2010/6/23 現在、コードは上記とは異なりますのでご注意ください。詳しい話は後日別途ポストします。