安心ネット通販ブックマークレットを作ってみた

最近、「Amazon」のマーケットプレイスの口コミ偽装が酷いのでみんな結構迷惑しているそうな。で、それを排除するにはAmazonが販売する商品だけを表示するのが手っ取り早いのだが、あいにくそういうオプションを普通には選ぶことはオトナの事情で不可能でURLに「&emi=AN1VRQENFRJN5」と自分で付ける必要があるらしい。
どうやら、「ブックマークレット」ってやつにすればいちいち手動でやる必要はないらしいという話をみたので、ついでに同じ商品が「ヨドバシ・ドッド・コム」で販売されているかも検索できるブックマークレットを作ってみた。

概要

ブックマークレットの機能は以下のとおり。

1. 「Amazon」で検索したキーワードを元に、別タブに以下を表示する
   • 出品者がAmazonの商品のみに絞った検索結果
   • 「ヨドバシ・ドッド・コム」で現在販売中の検索結果
2. 「ヨドバシ・ドッド・コム」で検索したキーワードを元に、別タブに以下を表示する
   • 「Amazon」で出品者がAmazonの商品のみに絞った検索結果

動作環境

とりあえず確認済のもの。

• Windows 10 (1903)
  • Chrome　(76.0.3809.132)
  • FireFox (68.02)
• Mac OS (10.14.6)
  • Chrome (76.0.3809.100)
  • Safari (12.1.2)
• Android 9
  • Chrome (76.0.3809.132)
• iOS (12.4.1)
  • Safari (???)　→うまく動いてるかよくわからん

iOSのSafariはタブ表示ができなかった気がするけど、そもそもタブ表示できるのかとかすいませんよくわからねえっす…。

設定

以下のブックマークとして登録する。

javascript:(function(){function c(a){window.open("https://www.amazon.co.jp/s?k="+a+"&emi=AN1VRQENFRJN5","_blank","noopener")}var b={"www.amazon.co.jp":{key:"k",a:[c,function(a){window.open("https://www.yodobashi.com/?word="+a+"&discontinued=false","_blank","noopener")}]},"www.yodobashi.com":{key:"word",a:[c]}}[location.host];if(void 0===b)alert("\u3053\u306e\u30b5\u30a4\u30c8["+location.host+"]\u3067\u306f\u5b9f\u884c\u3067\u304d\u307e\u305b\u3093\u3002");else{var d=function(a){a=window.location.href.match(new RegExp("[?&]"+
a+"=(.*?)(&|$|#)"));return null==a?"":decodeURIComponent(a[1])}(b.key);""===d?alert("\u5546\u54c1\u691c\u7d22\u3092\u884c\u3063\u3066\u304b\u3089\u5b9f\u884c\u3057\u3066\u304f\u3060\u3055\u3044\u3002"):b.a.forEach(function(a){a(d)})}})();

ブックマーク登録の仕方はOSやブラウザで異なるので頑張れ。

使い方

Amazonまたはヨドバシドッドコムで商品検索してから、登録したブックマークをクリックしてをブックマークレットを実行する。

その１

1. 「Amazon」で普通に商品検索する
2. ブックマークレットを実行する
3. Amazon(Amazon出品のみ)とヨドバシドッドコム(現在販売中のみ)の検索結果がそれぞれ別タブで表示される

その２

1. 「ヨドバシ・ドッド・コム」で普通に商品検索する
2. ブックマークレットを実行する
3. Amazon(Amazon出品のみ)の検索結果がそれぞれ別タブで表示される

注意点

• AmazonはJPのみ対応
• 別タブで検索結果が表示されない場合は、恐らくブラウザのポップアップブロックが原因なのでオリジナルのページを表示しているタブの上のほうに警告が出てないかチェックして解除して
• AndroidでAmazonショッピングアプリをインストールしている場合はAmazonショッピングアプリが指定したオプションを捨てて開くのでアプリ設定からリンクで開かないようにしないと駄目っす
• サイトの設計が変わると動作しなくなるのでその時は終わりで
• iOSとMacOSはちゃんとテストしてないので正直動かなかったらすまん

参考

ブックマークレットは以下のサイトを参考に作成。

Bookmarkletを作ろう(準備編） - Qiita 純正JavaScriptでのクエリパラメータ取得 - Qiita アレな出品を一括除外？ Amazonの検索結果をクリーンにできる「魔法の文字列」が話題に【やじうまWatch】 - INTERNET Watch

オリジナルコード

ブックマークレット用にコンパイルする前のコード。JavaScriptはあんまり書かないので突っ込まないで欲しい。

javascript:(
    function () {
        const configs = {
            'www.amazon.co.jp': {
                key: 'k',
                functions: [
                    openPureAma,
                    openNowYodo,
                ]
            },
            'www.yodobashi.com': {
                key: 'word',
                functions: [
                    openPureAma
                ]
            }
        };

        const config = configs[location.host];
        if (config === undefined) {
            alert('このサイト[' + location.host + ']では実行できません。');
            return;
        }

        const key = getQueryParam(config.key);
        if (key === '') {
            alert('商品検索を行ってから実行してください。');
            return;
        }

        config.functions.forEach((f) => {
            f(key);
        });

        function getQueryParam(key) {
            const value = window.location.href.match(new RegExp('[?&]' + key + '=(.*?)(&|$|#)'));
            if (value == null) return '';
            return decodeURIComponent(value[1]);
        }

        function openPureAma(key) {
            // 'emi=AN1VRQENFRJN5'で出品者Amazonに絞り込む
            const url = `https://www.amazon.co.jp/s?k=${key}&emi=AN1VRQENFRJN5`;
            window.open(url, '_blank', 'noopener');
        }

        function openNowYodo(key) {
            // 'discontinued=false'で販売終了商品を非表示にする
            const url = `https://www.yodobashi.com/?word=${key}&discontinued=false`;
            window.open(url, '_blank', 'noopener');
        }
    }
)();

圧縮後

オリジナルのコードを以下のサイトでコンパイルして先頭に「javascript:」を付けるとブックマークレットの完成。

Closure Compiler Service

(function(){function c(a){window.open("https://www.amazon.co.jp/s?k="+a+"&emi=AN1VRQENFRJN5","_blank","noopener")}var b={"www.amazon.co.jp":{key:"k",a:[c,function(a){window.open("https://www.yodobashi.com/?word="+a+"&discontinued=false","_blank","noopener")}]},"www.yodobashi.com":{key:"word",a:[c]}}[location.host];if(void 0===b)alert("\u3053\u306e\u30b5\u30a4\u30c8["+location.host+"]\u3067\u306f\u5b9f\u884c\u3067\u304d\u307e\u305b\u3093\u3002");else{var d=function(a){a=window.location.href.match(new RegExp("[?&]"+
a+"=(.*?)(&|$|#)"));return null==a?"":decodeURIComponent(a[1])}(b.key);""===d?alert("\u5546\u54c1\u691c\u7d22\u3092\u884c\u3063\u3066\u304b\u3089\u5b9f\u884c\u3057\u3066\u304f\u3060\u3055\u3044\u3002"):b.a.forEach(function(a){a(d)})}})();

ということで、なにか自分流に改造したい時は上記オリジナルコードをベースに編集しちゃってください。