Amazonの国内倉庫発行のみを表示する検索ボックス

JavaScriptロゴ JavaScript

最近はAmazonの検索結果が多すぎて怪しい販売も多そうだなあ、と思っていたところ togetter で参考になるニュースがあった。

Amazonの検索URL末尾に、あるコードを入れると怪しいパチモンとか高額商品とかが排除されるのでとても快適「何この魔法の呪文」
更新日:11月27日17時21分

結論からするとAmazonで商品を検索して得られるURLの末尾に

&emi=AN1VRQENFRJN5

を加えれば良い、という事だったので自分用に最初から検索結果末尾に &emi=AN1VRQENFRJN5 を加えてくれる検索ボックスをJavaScriptで作ってみたのがこちら。

Amazon国内倉庫発送のみ表示
Amazon国内倉庫発送の検索結果のみを表示する検索ボックスです

実際の検索を比較してみた

実際どれくらい違うのか「ハンモック」というキーワードで確認してみた。(ハンモックは海外でも商品が多そうだったので…)

通常のAmazon検索

Amazonでいつものように検索すると何と40000件以上

Amazon国内倉庫配送のみ

&emi=AN1VRQENFRJN5 を末尾につけた国内倉庫配送のみの検索結果は 60件 !これなら見比べて選べそうな数です。
通常の検索結果では Prime商品の宣伝が先頭にあったが、国内倉庫配送では最初から商品が表示されているのも良い。

わたしの予想以上の結果となった。
もちろん商品によってはここまで大差はつかないが、明らかにネットショッピングがしやすそうだ。

プログラム部分

今回アップしたHTML, CSS, JavaScript全体は以下の通りです。

index.html

1<!DOCTYPE html>
2<html>
3<head>
4    <meta charset="utf-8">
5    <meta name="viewport" content="width=device-width">
6    <meta name="robots" content="INDEX,FOLLOW">
7    <meta name="description" content="Amazon国内倉庫発送の検索結果のみを表示する検索ボックスです">
8    <link rel="stylesheet" href="style.css">
9    <script src="main.js" type="text/javascript"></script>
10    <title>Amazon国内倉庫発送のみ表示</title>
11</head>
12<body>
13    <header>
14        <h1>Amazon国内倉庫発送のみ表示</h1>
15    </header>
16 
17    <div id="contents">
18        <!-- リンク1 -->
19        <div class="simple-link">
20            <p><input type="search"" size="20" id="search_words_text" placeholder="商品を検索"></p>
21        </div>
22    </div>
23 
24    <footer>
25        <p><small>&copy;2020 <a target="_blank" href="https://torisky.com/">torisky.com</a></small></p>
26    </footer>
27</body>
28</html>

style.css

1/* style.css */
2@charset "utf-8";
3 
4*{
5    margin: 0;
6    padding: 0;
7}
8body{
9    font-family: Helvetica, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック', meiryo, sans-serif/* フォント */
10}
11/* ヘッダ */
12header{
13    background-color: orange;
14    color: black;
15}
16header h1{
17    font-size: 24pt;
18    padding: 20px 3em;
19    line-height: 1.7em;
20    letter-spacing: .2em;
21    text-align: center;
22}
23/* コンテンツ */
24div#contents{
25    font-size: 16pt;
26    background-color: white;
27    width: 800px;
28    margin: 1em auto;
29    padding: 0;
30}
31div#contents p{
32    line-height: 1.7em;
33    letter-spacing: .2em;
34    text-align: justify;
35}
36/* フッタ */
37footer{
38    text-align: center;
39    padding: 20px 40px;
40    font-size: 14pt;
41    background-color: black;
42    color: orange;
43}
44/* 汎用タグ */
45small{
46    font-size: 14pt;
47}
48a{
49    color: orange;
50    text-decoration: none;
51}
52a:hover{
53    color: white;
54}
55 
56/* リンクボタン部分 */
57.simple-link{
58    box-shadow: 3px 3px 7px #ddd;   /* ボタンの影 */
59    padding: 10px;
60    margin-bottom: 0.5em;
61    transition: all 0.3s ease 0s;   /* イベント毎の表示を0.3秒後にする*/
62}
63 
64.simple-link:hover{ /* マウスが乗ったとき */
65    box-shadow: 3px 3px 7px #555;   /* 少し影を濃く */
66    transform: translateY(-0.18em); /* 上方向に少し移動 */
67}
68 
69.simple-link p input{
70    width: 100%;
71    font-size: 1.5em;
72    border: solid 1px #ddd;
73    padding: 0.5em;
74}
75 
76/* メディアクエリ設定 */
77@media screen and (min-width:376px) and (max-width:960px) {
78/* タブレット用のcssを記述 */
79    header h1{
80        padding: 20px;
81        font-size: 16pt;
82    }
83    div#contents{
84        width: auto;
85        margin: 10px 10px;
86        padding: 1em;
87        font-size: 14pt;
88    }
89    footer{
90        padding: 20px;
91    }
92}
93  
94@media screen and (max-width:376px) {
95/* スマホ用のcssを記述 */
96    header h1{
97        padding: 20px;
98        font-size: 14pt;
99    }
100    div#contents{
101        width: auto;
102        margin: 0 0;
103        padding: 5px 10px;
104        font-size: 12pt;
105    }
106    footer{
107        padding: 20px;
108    }
109    small{
110        font-size: 11pt;
111    }
112}

main.js(プログラム部分)

1/* main.js */
2 
3// 検索用テキストボックス
4let search_words_text = null;
5 
6// 検索実行時の処理をする関数
7search_function = (event) => {
8    // 入力キー取得
9    let key = event.key;
10 
11    // 検索ボックスの文字列取得
12    let search_words = search_words_text.value;
13 
14    // 検索ボックスに何も入力されていないときは何もしない
15    if(search_words === "") return;
16 
17    // Enterキーを押したときのみ処理を行う(IME変換時のEnterキーはこの場合関係ない)
18    if(key === "Enter"){
19        // 国内倉庫発送のみのパラメタをつけてAmazon検索ワードを設定する
20        let location = "https://www.amazon.co.jp/s?k=" + search_words + "&emi=AN1VRQENFRJN5";
21        console.log("location: " + location);
22 
23        // 検索結果を別タブで開く
24        window.open(location, "_blank");
25    }
26}
27 
28// 起動時の処理
29window.addEventListener("load", function(){
30    // 検索ボックスDOM取得
31    search_words_text = document.getElementById("search_words_text");
32 
33    // キー入力時のイベント処理設定
34    search_words_text.addEventListener("keyup", search_function);
35});

まあ、国内倉庫発送だから安心!というわけでも無いですが、トラブルに会う確率は下がるのではないかと思います。
以上、Amazonの国内倉庫発行のみを表示する検索ボックスでした。

コメント

タイトルとURLをコピーしました