SafariのAdblockかけた時のエラーを回避


SafariのAdblockという拡張機能をオンにした時、一部ページが表示されないという事で対応したのでそのメモを。

拡張機能によるエラーの追い方

今まで拡張機能あるなしという環境の違いでの改修をしたことなかったので、一応手順を書いておく。

開発環境で再現できるか?

まずこれを確認するのが大事。
できるだけ報告された環境に近づけつつも、本番環境でしか起きないとなるとやっかい。。
今回の場合は、Mac/Safari/Adblockオンで再現できたので非常にやりやすかった。
本番環境でしか起きないときは、限りなく近い環境にしたテスト環境みたいなのを構築した上で進めていく事になる。
JSだけのエラーなら開発ツールを駆使すればできなくないかも?(これは試してません。)

1. 開発ツールでエラーを確認

今回は開発環境で再現できたので、その時の対応。
再現した開発環境で開発ツールを開き、エラーが出ていないかを確認。
詳しくわからないけど、拡張機能はJSでいろいろブラウザにやらせるみたいで、JSがエラーになっている事が多いみたい?なので、JSのエラーをまずは確認した。

2. 実際の対応

実際に確認してみると、fingerprintがエラーになっていて、このページではfingerprintをできればとりたいぐらいの部分だったため、無理ならtry catchでスキップできるようにした。
こんな感じ。

 try{
   var fingerprint = new Fingerprint({canvas: true}).get();
   $.cookie('fingerprint', fingerprint, {expires:365, path:'/'});
 }
 catch (e) {
   // fingerprintがなくても支障がないので、取得できなかったら何もしない
 }

tryにかかれている処理がエラーになったらcatchにかかれた処理を行う。
(逆にtryでエラーにならなかったら、catchは行われない。)
取れなかった時の対応はなしで良いと今回は判断したため、catchに処理はかかなかった。