ログイン後のページでapp_proxyが動作するかどうか試したいがERR_NGROK_6024エラーになる

お世話になります。

同様の状況になった方がいたらご教示いただきたいです。

Shopifyの開発ストアでアプリを構築中です。

現在、ストアのフロントからapp_proxyを用いて、アプリへリクエストを送る機能を実装中です。

theme-app-extensionも利用していて、アプリ立ち上げ時の

Preview your theme app extension:
http://127.0.0.1:9292

で表示されるURLからはこの機能は問題なく動作します。

▼リンクをクリックするとアプリが立ち上がる様子

9b8dca7f82c7bc77414156a46600095c.gif

ですが、開発ストアのURL(https://XXXXXXXXX.myshopify.com/)からこちらのリンクをクリックすると、

ERR_NGROK_6024 エラーとなります。

https://XXXXXXXXX.myshopify.com/から同じリンクをクリックした場合こちらの画面に遷移する

何か設定が足りないのでしょうか?ご教示いただけますと幸いです。

2枚目の事象についてですが、NGROK (Store frontではなく、App Bridge側)の制限のようで

私は

"To remove this page " 〜以下で示されている3つの方法のうち

一番手軽な

User-Agentの書き換えで対応しています。

chromeなどの機能拡張でuser-agentを書き換える方が多いのでしょうか

例:user-agent switcher

https://chrome.google.com/webstore/detail/user-agent-switcher-for-c/djflhoibgkdhkhhcedjiklpkjnoahfmg/related?hl=ja

私はなんとなく、、、機能拡張を入れたくなかったので

DevToolsで専用のUAを持ったデバイスを作成して作業しています。

UserAgentString 例:customer/non-standard chrome

本音としては、上記のような制限が煩わしいので、ngrok以外方法で

使い勝手の良い方法があれば、試したいと思っています。

※他の方が良い方法をご存知なら私も教わりたいです

1 Like

上記の投稿をした後気がついたのですが

ブラウザのCookieの設定を下記のように緩めると

UserAgentの設定を行わずに、ngrokのエラーが消えました。

(私は当初3rd Party Cookieをブロックする設定になっていました)

また、本投稿をご覧になった、別の開発者の方は

ブラウザの設定はどのようにされていますでしょうか。

推奨ブラウザについてドキュメントは見つかったのですが

推奨設定は見つからず

Shopify Adminでは3rd Party Cookieは必須でしたでしょうか。

https://help.shopify.com/en/manual/shopify-admin/supported-browsers

https://help.shopify.com/ja/manual/shopify-admin/supported-browsers

1 Like

ありがとうございます!検証が遅くなってしまい申し訳ございませんが、いただいた方法にて解決することができました。