やれることをやってみる AmazonJS 0.4リリース

何故か毎週リリースしていますが、WordPressプラグインであるAmazonJS 0.4を今週、先ほど0.4.1をリリースしました。

イキってAmazonJSを久しぶりに更新したらいろいろな方が紹介してくださったりして使う人が増えて、なんとなくリスクがありそうだけどまぁ大丈夫だろうと思っていたことが他のテーマやプラグインとの組み合わせで問題が引き起こされるという事態に。

原因はどうであれユーザさんから見れば「AmazonJSで商品が表示されない」という問題には違いなく、一人ひとりにJavascriptのエラーを調べてもらうのは効率が悪いのでなんとかしようと思いました。

AmazonJS 0.4(.1)での主な変更

  • jQuery 1.4.2以上なら表示されるようにした
    • カスタマーレビューの表示をオプションにした
  • document.writeでの出力をオプションにした

方針立て直し

結局のところ自分のために作っているわけなので、調子に乗って変なことをするもんじゃないなとつくづく思いました。なので基本的な方針としてデフォルトはミニマムかつもっとも動作するであろうという状態にして、自分のほしいものはオプションにして有効にしていくことにしました。

これは特にWordPressに限ったことではなく、環境によって動かなくなるリスクがある機能はオプションにしてデフォルト無効にした方が安全です。

jQuery 1.4.2以上なら表示されるように

WordPress 3.6からどうかはわかりませんが、WordPressはjQueryのonメソッドをよく使っているようです。僕が確認できただけでもthickbox.js, admin-bar.min.js, Twenty Thirteenのfunction.jsが使っていました。そして1.4系のjQueryに置き換えてくるテーマやプラグインがあるということを報告からわかっていてその環境下ではエラーが発生します。(jQueryが古い場合にAmazonJSが動かない件について)

まずthickbox.jsを使うカスタマーレビューの表示をオプションにしてデフォルトをオフにしました。さらに表示の実行につかうスクリプトの出力のプライオリティを1つあげてフッターに出力されるjavascriptよりも先に実行するようにしました。これでadmin-bar.min.jsやTwenty Thirteenがエラーになる前に処理を登録して切り抜けます。

もちろんヘッダー付近のscriptでエラーがでたらどうしようもないので全てケースで有効な回避策ではないですが、報告を受けて原因がわかっているものについては対応できていると思います。

ちなみにadmin-bar.min.jsはWordPressにログインする画面上部に追加される管理バーで使われるjavascriptファイルです。古いjQueryを差し替えられるとadmin-bar.min.jsでエラーが出る、つまり ログインするとAmazonJSの商品表示が動かなくなる のです。気付いたときはマジで勘弁してくれと思いましたが、今はなんとか動きます。

document.writeでの出力をオプションにした

Javascriptが無効であっても動くようにしたのですが、WordPressにはいろいろありますね。記事コンテンツ内のリンクを置き換えるプラグインがあってdocument.write内のhtmlをエスケープなしで置き換えてくるとかね。本当に余計なことはするもんじゃないですね。

ということでこちらもオプションにしてデフォルトをオフにしました。

最後に

これで問題が全て解決するとは思っていません。そもそもJavascriptで表示を更新するという手法そのものがWordPressではリスクであるとよく思い知らされました。

昔Amazonプラグインの世界がカオスということは書きましたが(WordPressのAmazonプラグインはカオスで定番がないらしい)WordPressは Javascript の世界もカオスのようです。

AmazonJSで起きた問題は単純に見た目が目立つということに過ぎません。Javascriptにエラーが発生していて必要な処理が動いていないという問題が、一見、見た目は表示されているということで気が付かれていないのかもしれません。

人見知りソフトウェアエンジニアです。ビジュアル系、お笑い、Pixarが好き。勢いで吉本超合金おたけびBOTを作った。オールザッツ漫才が放送されない東京在住。

趣味や日常からアウトプットの場としてブログを書いています。自作のWordPressプラグインにGitHub Flavored MarkdownAmazonJSなど。