AmazonJSの不具合を修正。グルグル問題を改善
当サイトはアフィリエイトの収益により運営されております。つまり収益がなくなれば当サイトの存在意義を果たせないというわけです。
現在当サイトではGoogleアドセンスとAmazonアソシエイトの二つだけのアフィリエイトを利用しています。開始当初はほかのアフィリエイトも利用していたのですが、管理が面倒という点と、収益にばらつきが出てしまうため二つだけに絞りました。
アドセンスに関してはとりあえず好調といったところでしょうか。アソシエイトについても徐々にですが、多少の売り上げがあります。
このAmazonアソシエイトについて先日から少し様子がおかしいと思っていました。
AmazonアソシエイトはAmazonJSというJavascriptで動かしているわけですが、このスクリプトがどうにもこうにも不具合が多いのです。
それもそのはずで、二年前より更新がされていないのです。
PHPを新しくすれば不具合。
ワードプレスのバージョンを上げれば不具合。
HTTPS化をすると不具合。
他のプラグインをいれれば不具合。
といった具合で、何かをすれば何らかの不具合によって作業を強いられる結果に。今回もキャッシュ系プラグインを入れた結果、動きが悪くなってしまいました。
とりあえず読み込むものの、画像が表示されません。
こんな感じでグルグル回ったままとなっています。今回はこれを修正するため色々と改善をしてみました。
ネットの情報から、AmazonJSのPHPの一部を変更していきます。
AmazonJSの設定変更
AmazonJSのPHPの96行目あたりのhttpをhttps化します。これをすることで常時SSL通信に対応できるようにしました。これだけでなおる人もいるようですが、当サイトはこれでは何も変わりませんでした。
'JP' => array(
'label' => __( 'Japan', $this->text_domain ),
'domain' => 'Amazon.co.jp',
'baseUri' => 'https://webservices.amazon.co.jp',
'linkTemplate' => '<iframe src="https://rcm-jp.amazon.co.jp/e/cm?t=${t}&o=9&p=8&l=as1&asins=${asins}&fc1=${fc1}&IS2=${IS2}<1=${lt1}&m=amazon&lc1=${lc1}&bc1=${bc1}&bg1=${bg1}&f=ifr" style="width:120px;height:240px;" scrolling="no" marginwidth="0" marginheight="0" frameborder="0"></iframe>',
キャッシュ系プラグインのスクリプト統合の禁止
過去にキャッシュ系プラグインで散々悩まされました。しかしこれらのプラグインを入れておかないと読み込み速度が遅くなります。そのため今回も入れたわけですが、やはりこんな感じで不具合が出ております。スクリプトをひとまとめにしておくと読み込み速度が速くなるわけですが、まとめると不具合が生じます。そのためキャッシュ系プラグインを入れたとしてもスクリプトを統合しない形にします。またCSSもキャッシュを残さないように設定します。
今回問題になっているのはAmazonJSなのでこれのキャッシュが残らないようにすること。それと統合されないようにすることです。統合しないことで読み込みに多少時間がかかってしまいますが、ここについては仕方がありません。
Jqueryの読み込みの変更
二つの施策をしましたが、しっかりと読み込むこともあれば読み込まないこともあります。つまりそれ以外に問題があるということです。chromeでサイトの診断をしてみたところ、Jqueryを読み込むときと読み込まないときがあるようです。AmazonJSはJqueryに依存します。つまりJqueryが読み込まれなければAmazonJSは動かないわけです。このたまに読み込むけど読み込まないことがあるのは、Jqueryが読み込まれる時と読み込まれないときで変わるようです。
本来Javascriptは上から順に読み込んでいくわけですが、どうやら上から順に読み込むものの、読み込み完了までにそれより下のscriptを読み込んでしまい、エラーとなってしまうわけです。つまりはサーバー側の読み込み速度の問題なわけですが、ここについては私でどうにかするとなるとお引越ししか方法がないわけです。
しかし、引っ越すのも大変。かといってAmazonからの収益は確保したい。
だったら配置場所を変えるしかない。
このような結果となりました。
当サイトのJavascriptは全てフッターに移動させています。その理由はヘッダーにあるとその分サイトの表示が遅くなるから。Javascriptなんて最後に読み込めばいいんです。それであれば全部下の方に持っていっちゃおうということでJavascriptも一部のCSSも最下層に置くことにしました。これが問題だったようです。表示速度は多少早くなっています。しかし今回のような不具合が出ております。そのためJqueryだけをヘッダーに配置し、それ以外をフッターに回すという形で対処しました。
こうすることでscriptの読む順番もそのまま。かつヘッダーから取得するのとフッターから取得するタイムラグを使って順番に読み込むようにしました。
すごい強引な方法ですが、とりあえず読み込んでくれるようになりました。
こんな感じで試行錯誤して強引ではありますが回答を導くことができました。
今回は何が原因なんだかわからず手探りで行いました。その際ワードプレスのバージョンを上げたりもしてみました。その結果、アソシエイトIDを再取得しなければならないことにもなってしまいましたが、まぁこれで何とか動くのではないでしょうか。