Liquid、JavaScriptなどに関する質問
アプリの開発を行い、ローカルでは正常なテストアプリですが、
デプロイ完了しインストールを試みましたがエラー(404)となり、どうしても解決する情報がヒットしませんため、質問させていただきました。
【 症状・解決 】
サーバーへデプロイし、開発ストアへインストールしようとすると、
「404 このアドレスにはページがありません」となり、インストール画面が表示されない。
開発ストアへインストールし、動作の確認がしたく思っております。
【 現在の状況 】
下記のNginxのアクセスログではでは正常にアクセス出来ている様子で、
リダイレクトの問題かと思いますが、はっきりとした原因がわからず、困り果てております。
ローカル起動(npm run dev)のアプリはアインストール・再インストールが可能です
(パートナーアカウント > アプリ管理 > 該当アプリ > ストアを選択するからも可能)
【 開発環境 】
Node.js, Rimix, React
基本的に npm init @Shopify/app@latest をベースに開発
npm init @Shopify/app@latest
- Start with Remix (recommended)
- JavaScript
(未実行) npm run generate extension
{ APP_NAME } = 管理画面 > アプリ管理 > 該当アプリ > アプリ名 { APP_HANDLE } = 管理画面 > アプリ管理 > 該当アプリ > アプリハンドル { MY_DOMAIN } = 独自ドメイン { SHOPIFY_APP_URL } = https://{ MY_DOMAIN } { SHOPIFY_API_KEY } = 管理画面 > アプリ管理 > 該当アプリ > クライアントID { SHOPIFY_API_SECRET } = 管理画面 > アプリ管理 > 該当アプリ > クライアントシークレット として以降記述させていただきます。
【 Shopify パートナーアカウント アプリ管理情報 】
アプリURL
https://{ MY_DOMAIN }/ (ここでは末の「/」入力
設定URL
未記入
許可されたリダイレクトURL
https://{ MY_DOMAIN }/auth/callback
https://{ MY_DOMAIN }/auth/shopify/callback
イベントのバージョン
2024-01 (最新)
コンプライアンスのWebhook
顧客データリクエストエンドポイント
https://{ MY_DOMAIN }/webhooks/customer_request
顧客データ消去エンドポイント
https://{ MY_DOMAIN }/webhooks/customer_deletion
ショップデータ消去エンドポイント
https://{ MY_DOMAIN }/webhooks/deletion
【 パートナーアカウントからアクセスした際のサーバーログ 】
[ Server Log - Nginx ]
IP_ADDRESS - - [16/Feb/2024:07:14:04 +0000] "GET /?hmac=b0a4f9*****&host=YWRta*****&shop=test55devshop.myshopify.com×tamp=1708067644 HTTP/1.1" 302 5 "https://partners.shopify.com/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.3.1 Safari/605.1.15" "IP_ADDRESS"
[ Server Log - App ]
GET / 200 - - 2.392 ms GET / 200 - - 2.029 ms GET /?hmac=b0a4f9*****&host=YWRta*****&shop=test55devshop.myshopify.com×tamp=1708067644 302 - - 2.251 ms GET /app?hmac=b0a4f9*****&host=YWRta*****&shop=test55devshop.myshopify.com×tamp=1708067644 302 - - 13.080 ms GET / 200 - - 2.098 ms GET / 200 - - 4.542 ms
【 Server 設定ファイル 】
[ .env ]
DATABASE_URL = "" SHOPIFY_APP_URL = "{ SHOPIFY_APP_URL }" SCOPES = "read_products,write_products" // 商品読み書きのみのスコープ SHOPIFY_API_KEY = "{ SHOPIFY_API_KEY }" SHOPIFY_API_SECRET = "{ SHOPIFY_API_SECRET }"
[ shopify.app.toml ]
client_id = "{ SHOPIFY_API_KEY }" name = "{ APP_NAME }" handle = "{ APP_HANDLE }" application_url = "{ SHOPIFY_APP_URL }" embedded = true [build] automatically_update_urls_on_dev = true dev_store_url = "test55devshop.myshopify.com" include_config_on_deploy = true [access_scopes] # Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes scopes = "read_products,write_products" [auth] redirect_urls = [ "https://{ MY_DOMAIN }/auth/callback", "https://{ MY_DOMAIN }/auth/shopify/callback" ] [webhooks] api_version = "2024-01" [pos] embedded = false
※ application_url はここでは末の「/」なし
【 Nginx 設定ファイル 】
[ nginx.conf ] user nginx; worker_processes 1; error_log /var/log/nginx/error.log warn; pid /var/run/nginx.pid; events { worker_connections 1024; } http { include /etc/nginx/mime.types; default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on; #tcp_nopush on; keepalive_timeout 65; #gzip on; include /etc/nginx/conf.d/*.conf; }
[ { MY_DOMAIN }.conf ] upstream { NODE_APP_CONTAINER } { server { NODE_APP_CONTAINER }:3000; } server { listen 80; location / { proxy_pass { NODE_APP_CONTAINER }; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection 'upgrade'; proxy_set_header Host $host; proxy_cache_bypass $http_upgrade; }
redirect_urls と 許可されたリダイレクトURL を
https://{ MY_DOMAIN }/auth/callback
https://{ MY_DOMAIN }/auth/shopify/callback
https://{ MY_DOMAIN }/api/auth/callback
にしたり、.env の SHOPIFY_APP_URL や アプリURL、
ポートの設定やwebhooksを確認しつつここまできましたが、インストールだけがどうしても解決出来ません。。
上記の情報以外で必要な情報が御座いましたら記述させていただきます。
初歩的な質問かもしれませんが、何卒、よろしくお願いいたします。
ご投稿いただきありがとうございます。
こちら詳しく調査が必要であるかと存じますので、Shopifyパートナー窓口までお問い合わせいただけますでしょうか。パートナーサポートに特化したチームがご案内いたします。
下記にお問い合わせの手順を記載させていただきます。
1. こちらのURLよりヘルプセンターにアクセスし、パートナーアカウントでログインを行います。
2. 問い合わせに使用する組織を選択します。
3. 問い合わせのトピックを選択します (※`Get support for a store`を選択の場合、一般サポートに問い合わせされます)。
4. チャットまたはメールにて問い合わせを開始することが出来ます。チャットですと接続次第パートナー担当者とチャットによるやり取りをすることが出来ます。
上記手順でパートナーとして認証を行い、お問合せを行なっていただきますよう、お願いいたします。
Rinaflora | Shopify
- 回答は役に立ちましたか?いいね! ボタンをクリックして教えてください。
- 質問に対する答えは得られましたか? 回答に満足いただけたら、ベストソリューションとして承認
- を選択してください。 - Shopify Help Center と Shopify Blogも是非ご参照ください。
Shopifyの請求書の支払いが失敗したという通知を受け取って驚いたことはありますか。初めての支払いでエラーが発生したり、これまで何の問題もなく支払いできていたのに突然失敗し...
By Minami_ Sep 8, 20242023年2月、Shopifyはcheckout.liquidを廃止し、Checkout Extensibilityに移行することを発表いたしました。この新しいチェックアウト...
By JasonH Aug 15, 2024「味噌の可能性を、とき放つ」をコンセプトに、豊かな自然に恵まれた信州で味噌の製造販売を行う新田醸造。江戸末期に創業した老舗のみそ屋さんですが、2024年春、顧客層や販売範囲の...
By Minami_ Jul 30, 2024