アプリ側での顧客管理機能ログイン判定方法

解決済
Tomoyuki_K
遊覧客
20 7 23

質問

onlineshop側にコンテンツを出すアプリの開発をしたいと思っています。
表示するコンテンツはログインしているユーザー毎に変えたいと思っています。

その場合、アプリは、onlineshopにアクセスしたユーザーのログイン情報(ログインしてるか、誰としてログインしているか)はどのように取得するのでしょうか?

 

例えば、ログインしている人の購入履歴にもとづき、おすすめ商品情報を出すアプリを作るとします。
すでに、アプリのDBには購入履歴にもとづいたおすすめする商品情報が保存されている状態です。

onlineshopにアクセスしたとき、アプリ側で用意した、おすすめする商品情報を返すAPIにアクセスするのですが、アクセスした人が誰なのかアプリ側では判別付きません。

 

検討したこと①

APIのパラメーターにliquidテンプレートで出力した {{customer.id}} とかを付与してもいいのですが、その場合、適当なcostomer idを指定してAPIを投げると他の人のおすすめ情報が無関係にから取り出せてしまいます。その情報に価値があるかどうかは一旦ここでは議論しませんが、やはりログインしている本人のデータしか返さないようにしたいです。

 

検討したこと②

webhookを利用して、ユーザーが作られた際にアプリ側のDBにもユーザー情報を保存。
アプリで用意した、おすすめ情報のAPIを呼び出す際に、costomer id と email address をパラメーターに付与して投げる。
この場合、前述のケースと比べて、costomer idとemail addressのパターンを無関係の人が推測するのは難しいので、まだ良いのですが、、、よりスマートな方法があれば知りたいと思っています。

 

以上のように、色々手を尽くせばそれっぽいことができそうではあるのですが、アプリ側がonlineshopにアクセスしに来た人のログイン情報を判別する方法ってそんあ周りくどいことをしないとできないことなのでしょうか??

 

なにか方法があれば、教えていただきたいです。

0 件の「いいね!」
junichiokamura
Community Manager
Community Manager
911 203 340

通城は、おっしゃる通り、Liquidのcustomer.idを使うのが定石かと思います。

その際に、他のIDのデータが引けてしまう問題ですが、アプリ開発をする場合は、App proxy という仕組みを使って、フロントのデータをアプリのバックエンドに渡すことができます。
https://shopify.dev/tutorials/display-data-on-an-online-store-with-an-application-proxy-app-extensio...

これには、改竄防止のハッシュキーによるバリデーションがついているため、例えばApp proxyに  custome_id=123 とコールされているところを、customer_id=234 としてGETした場合、

値が異なるのでハッシュキーもことなり、ハッシュキーの算出に必要なキーは、Shopifyとアプリしか知らないため、実質パラメータの改ざんはできなくなります。

アプリの開発については、日本語で以下にまとめてありますので、一度ご確認ください。

https://www.shopify.jp/blog/partner-shopify-app-development

上記ブログを基にした解説動画もあります。
https://www.youtube.com/watch?v=xgPrMP48W-M&list=PLkR3LRtxAZfod8TvcsKU7IEWeAO5fhcOe&index=3

あとは、公式の方法ではないですが、以下のようなアプローチをされている方もいるようです。
https://community.shopify.com/c/Shopify-APIs-SDKs/Current-best-way-to-get-logged-in-customer-id/td-p...

Technical Partner Manager, Japan
0 件の「いいね!」
Tomoyuki_K
遊覧客
20 7 23

返信ありがとうございます!

 


@junichiokamura さんは書きました:

通城は、おっしゃる通り、Liquidのcustomer.idを使うのが定石かと思います。

その際に、他のIDのデータが引けてしまう問題ですが、アプリ開発をする場合は、App proxy という仕組みを使って、フロントのデータをアプリのバックエンドに渡すことができます。
https://shopify.dev/tutorials/display-data-on-an-online-store-with-an-application-proxy-app-extensio...

これには、改竄防止のハッシュキーによるバリデーションがついているため、例えばApp proxyに  custome_id=123 とコールされているところを、customer_id=234 としてGETした場合、

値が異なるのでハッシュキーもことなり、ハッシュキーの算出に必要なキーは、Shopifyとアプリしか知らないため、実質パラメータの改ざんはできなくなります。


 

上記、App proxyも検討してみたのですが、

  • cookie関連のheaderはshopifyによって削除されてします
  • パラメーターの改ざん防止機能は、shopify ---> proxied app 間の検証で、user ---> shopify ---> proxied app の検証には利用できない

と思い採用しませんでした:汗をかいた笑顔:

パラメーター改ざん防止機能について補足すると、例えば、アプリ側にある example.com/api/user?cid=xxx のパスがapp proxyによりshopify側から転送される予定の場合、以下2通りのアクセスの可能性があると思っています。

  • app proxy により紐付けられたストアのパス(example.myshopify.com/app/my-proxied/user?cid=xx)から転送されるケース
  • 何らかの理由によりアプリのURLが特定され、example.com/api/user?cid=xxx を直接リクエストするケース

App proxyのパラメーター改ざん防止機能は上記ケースのうち、後者の検証のためにだと認識しています。
ご説明頂いた通り、パラメーターとハッシュキーの照合により、リクエストがshopifyから転送されたものかどうか、検証できます。

 

しかし、前者のケースはやはり、cidがログインしているユーザーのものである検証ができません。
example.myshopify.com/app/my-proxied/user?cid=xx のリクエストで、cidを適当に指定してリクエストすると、結局shopifyを経由してアプリ側に転送されるので、shopifyを経由していることの検証はできますが、ログインユーザーである検証ができません。認識違っていたら、コメントもらえると嬉しいです。 🙇

 


あとは、公式の方法ではないですが、以下のようなアプローチをされている方もいるようです。
https://community.shopify.com/c/Shopify-APIs-SDKs/Current-best-way-to-get-logged-in-customer-id/td-p...


上記も事前に、確認していました!
いくつかのテーマではcustomer idはliquidテンプレートからjavascriptからもあつかれるようにセットされているようで、しかしセットされている場所(JavasScript変数名)がテーマ毎に違うので、皆さん頑張って解析してJSからcidを利用していると認識しています。出処はliquidテンプレートで、結局customer idなので、依然として、ログインしているユーザーであることの確証 が得られないので参考にはしていませんでした :汗をかいた笑顔:

 

 

 

 

junichiokamura
Community Manager
Community Manager
911 203 340

確かに、App proxy内でのIDの保証はできないですね。。

ログインしている人のデータは、Cookieやローカルストレージに入っているので、そこから参照して、App proxyに渡す方法もありますが、根本的にアプリサーバー側で、これが本当にログイン(セッション上)のIDかどうかなのかの検証にはならないですね。

自分の方で、もう少し適切な方法がないか探してみます。

Technical Partner Manager, Japan
0 件の「いいね!」
junichiokamura
Community Manager
Community Manager
911 203 340

成功

以下のアプローチを見つけたので、共有します。

 

http://gavinballard.com/securing-customer-pages-shopify-app-proxy/

 

詳細はみてないですが、IDだけではなくて、他にLiquidから取れるデータをパラメータで渡して、サーバー側ではIDで取得したCustomerデータと渡ってきたデータを比較して、ログインしているひとか判断する方法です。

原始的ですけど、これだと、たまたま他の人のデータを参照してしまうことは防げるかと思います。

 

Technical Partner Manager, Japan
Tomoyuki_K
遊覧客
20 7 23

返信ありがとうございました!記事を読んでみたところ、costomer id 以外との組み合わせで costomer id の推測を軽減させるアプローチのようですね。
事前に共有させて頂いた、検討したこと② とアプローチは同じようです。

現実的な方法はとりあえずこの辺に落ち着くのですかね。。。 :汗をかいた笑顔:

調査、返信ありがとうございました!

0 件の「いいね!」