🙌

Shopifyアプリがどうしても動かない・表示されないときに確認すること

2022/10/27に公開

Shopifyアプリに関する情報は、まだまだ非常に少ないです。

海外フォーラムを読み漁っても、うまく解決策が見つからない場合もあると思います。

そこで今回は、Shopifyアプリ開発の際に遭遇したトラブルやエラーについてまとめておきます。

権限は変更されているか?

サンプルアプリ(ボタンを押すと商品数が5個増える)をベースにして、改造を行う場合、権限に注意してください。

例えば、サンプルアプリの場合は、write_products(商品編集)しか権限を持っていません。

もし、注文についての情報をAPIから引き出す場合には、read_orders(商品読み込み),read_customers(個人情報読み出し)などの権限を与える必要があります。

https://shopify-dev.translate.goog/api/usage/access-scopes?_x_tr_sl=en&_x_tr_tl=ja&_x_tr_hl=ja&_x_tr_pto=wapp

権限を設定しているファイルは、アプリ名のディレクトリ直下にある「shopify.app.toml」というファイルに記載されています。

scopes = "write_products,write_orders,read_customers"

配布方法を選択しているか?

Shopifyパートナーにログイン後、画面左側メニューの[アプリ管理]を選択。

アプリ名をクリックし、画面右上にある「本番環境の準備を整える」の設定が終わっているかを確認してください。

この画面で、公開アプリにするか?カスタムアプリにするか?の設定が終えていないと、Graphql APIで正常なレスポンスを返してこないコマンドがありました。

デバッグしてみる

API叩いて返ってきたjsonとかオブジェクトの中身を見てみると、何か分かるかもしれません。

console.logコマンドを使う

.jsや.jsxなどのJavaScriptファイルは、「console.log」コマンドを使用します。

console.log(data);

フロントエンドなら、ブラウザ上でF12を押して表示されるコンソール画面上に。

サーバーサイド側なら、ターミナル上に表示されます(ngrokの接続に使用した画面)

適当な.txtファイルを作成する

console.logでうまく出力されない場合は、変数やオブジェクトを詰め込んだ適当なファイルを作成してチェックしてみます。

PHP
ob_start();
var_dump($response_count);
$dump = ob_get_contents();
ob_end_clean();
file_put_contents("test.txt",$dump);

英語のフォーラムにも突撃しよう

shopifyアプリ関連の情報は、日本語だとまだまだ少ないですが、海外では結構盛んです。

エラー文を検索すると、英文が出てきてしまうので、避けてしまう人もいるかもしません。

しかし、ためしに見てみてください。

私の経験上、日本語で書かれたブログよりも、海外のフォーラムの方が明確な解決策が提示してある可能性が高いです。

Google翻訳を使えば、それなりに意味を理解することは可能です。

このようにGoogle翻訳のフォームにURLを入力すれば、ページ丸ごと翻訳してくれます↓
https://translate.google.co.jp/?hl=ja&sl=en&tl=ja&text=https%3A%2F%2Fshopify.dev%2Fapi%2Fusage%2Faccess-scopes&op=translate

Discussion