自分用メモ。
アプリを作成する前に前提として以下の3つの準備が必要
①ngrokの設定
最初からサーバを用意できるのならば、それでも良いかもしれないが
自分の場合、ローカルマシンを開発サーバとして、
Shopifyから「直接」アクセスさせる方法を試す。
localhostで動いているサーバーを、LANの外から直接アクセスできるように
させるためのツールとして「ngrok」を使用する。
詳しい設定の方法は以下を参照
qiita.com
②Shopifyパートナーのアカウント作成
アプリの作成にはこのアカウントが必要なるため登録必須。
作成は以下のページから。
Shopify Partner Program — Become the next Shopify Expert
③アプリテスト用のショップがある
設定が終わったら、以下のようにしてアプリを作成する。
1) ngrokを起動
上記の記事などで、ngrokの環境設定が終わったら、
railsが動作しているポートにあわせて、ngrokを起動させる。
例)3000番ポートで動作している前提
$ngrok http 3000
Forwardingで表示されている箇所に、
表示されているURL(例: https://betb5484.ngrok.io)で
外部から現在動作しているRailsにアクセスできる。
※以降の説明は、アプリURLが「https://betb5484.ngrok.io」であることを前提に話を進める。
一度ブラウザ上で、動作するか確認してみてほしい。
※ちなみにhttp版とhttps版があるが、特に選ばないのであればhttps版でいいだろう。
2)Shpifyパートナーのアプリ作成画面より、アプリ設定を新規作成
Shopifyパートナーの「Apps」ページの右上にある「Create app」から
アプリの新規設定を行う。
「Create app」を押すと、以下のモーダル画面が表示されるので
「App name」には作成するアプリ名を入力し、
「App URL」には1)でも説明したngrokのForwarding箇所に表示されているURLを設定し
画面内の「Create app」ボタンを押す。
作成できるとアプリのOverviewページに遷移する。
このページ内の「App Info」タブをクリックし、
「Whitelisted redirection URL(s)」を以下のように設定する。
https://betb5484.ngrok.io/auth/shopify/callback
また同ページ以下の「App credentials」にある「API key」と「API secret key」は
以降の説明で使用するのでメモしておく。
3)RailsでShopify Appの設定をする
gem 'shopify_app'をインストールする
GitHub - Shopify/shopify_app: A Rails Engine for building Shopify Apps
gem 'shopify_app'
デフォルトのジェネレータコマンドがあるので、
それを使用し、Shopifyとの接続に最低限必要なファイルを生成する。
そのためには2)でメモしておいた
「API key」と「API secret key」を以下のフォーマットのように設定し、
ファイルを生成する
$ bundle exec rails generate shopify_app --api_key <your_api_key> --secret <your_app_secret>
問題なくコマンドが流れれば、以下のようなファイル群が生成される。
生成されたファイル群の中に、Shopify用のmigrationファイルが
存在するのでマイグレーションを行う。
$ bundle exec rake db:migrate
また生成されたファイル群の中に
config/initializers/shopify_app.rbというファイルがあるが
このファイルのscope(権限)を設定することで、
使用できるShopify APIの権限を設定することができる。
デフォルトでは「read_orders, read_products」となっているため
「注文情報の読込権限」と「商品情報の読込権限」のみが設定されていることになる。
設定できるスコープの詳細は以下。
API access scopes - OAuth - Shopify Help Center
アプリの用途によって、設定する値を変更してほしい。
※注意してほしいのは、ショップにアプリを一度インストールした後に、
このスコープを変更しても、変更されない。
4)Railsを起動
$ bundle exec rails s
5)ショップにアプリをインストールする
「https://betb5484.ngrok.io」にアクセスすると
以下の画面になる。
ここに、インストール先のアプリURL(xxxxxx.myshopify.com)を入れて
アプリをショップにインストールする。
インストールボタンを押すと、以下のページになる。
設定したスコープに応じて、アプリ内で使用可能な権限が表示される。
問題なければ右下の「install unlisted app」をクリックし、インストールする。
問題なくインストールが終わると、デフォルトのアプリ画面トップに遷移し
以下のようなページが表示される。
上画面では、ジェネレーターで表示されたhome_contoller.rb内で
設定されている「商品10件」と、「Webhook一覧」が表示される。
app/controllers/home_controller.rb
class HomeController < ShopifyApp::AuthenticatedController def index @products = ShopifyAPI::Product.find(:all, params: { limit: 10 }) @webhooks = ShopifyAPI::Webhook.find(:all) end end
後は公式のAPIドキュメントを見ながら、必要に応じたAPIを活用し
アプリを作成すればよい。
ちなみにアプリはデフォルトでは「埋め込みアプリ」として
インストールされる。
詳細は以下。埋め込みアプリじゃない方法としても使用できる方法も紹介している。
参考にされたし。
thoames.hatenadiary.jp