Shopify:特定の国IPからのアクセスを除外する

やりたいこと

  • Shopifyで運営するストアで、特定の国からのアクセスを除外させたい。
  • 有料のアプリを使わず、コード直書きで対応したい。

実装例

JavaScript でユーザIPを取得し、除外国(例:日本)からのアクセスの場合、任意のページにリダイレクトさせる。

Layout/theme.js

jQuery と js-cookie を CDN でインポートし、

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>

その配下に次のコードを記載する。

{% unless customer %}
  <!-- Excluding particular country IPs -->
  <script>
    if (Cookies.get('country') == null) {
        $.getJSON('https://ipapi.co/json/', function(data) {
          const country = data.country,
                      url = window.location.href;
          Cookies.set('country', country);
          })
      };
      if (Cookies.get('country') == 'JP' && !(url == 'YOUR_ROOT_URL' || url == 'YOUR_REDIRECT_URL')) {
        $('main').hide();
        window.location.replace('YOUR_REDIRECT_URL');
      };
  </script>
{% endunless %}

ポイント

  • 「{% unless customer %}〜{% endunless %}」で囲って、ログインしてないユーザのみに処理を適用
  • 「https://ipapi.co/json/」でユーザIPを識別
  • 2回目以降のアクセスは、セットしたクッキーで判定

Sources

兵庫県西宮市生まれのフリーランスRailsエンジニア。案件によってWordPressの作業も請け負ったりしてます。2014年から2016年にかけてオーストラリアで生活。 現在は東京を拠点に活動。/ 前職・資格:公認会計士 / プログラミング言語:Ruby, JavaScript, HTML, CSS / 日本語・英語
コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です