Social PLUS Tech BlogPublicationへの投稿
🔥

ShopifyアプリのインストールフローをManaged Installに移行した話

masaki
に公開
Rails
Ruby
Shopify
shopifyアプリ
tech

はじめに

こんにちは、masaki です。
現在ソーシャルPLUS では CRM PLUS on LINE という Shopify アプリを開発し、公開しています。
CRM PLUS on LINE は一言でいうと、「SNS連携機能やLINE配信機能をShopifyストアに組み込めるアプリ」 です。
詳しくは以下をご覧ください。
https://crmplus.socialplus.jp

最近、このアプリの Shopify ストアへのインストールフローを、従来の認可コードフローから 2024年1月に Shopify が発表した Managed Install へ移行しました。

https://shopify.dev/changelog/new-oauth2-token-exchange-api-shopify-managed-install-authorization-flows-available
https://shopify.dev/docs/apps/build/authentication-authorization/app-installation

この移行によって、これまでのシステムで抱えていた課題が解消され、多くのメリットが得られました。
本記事では、

  • 既存システムの何がつらかったのか
  • Managed Install によって何が改善されたのか

を中心に紹介します。

この記事は以下のような方を対象としています：

  • Shopify アプリを開発している方
  • Shopify アプリをフロント/バックエンドで分離して開発している方
  • Managed Install への移行を検討している方
  • shopify_app gem を使用している Ruby on Rails 開発者

Shopify アプリのインストールフローの種類

Shopify アプリのインストールフローには以下の 2 種類があります。

  • 認可コードフロー（OAuth 2.0）
  • Managed Install

認可コードフロー

従来のインストール方法は、OAuth 2.0 の認可コードフローに基づいています。

この方式では、アプリ側で以下の実装が必要でした。

  • 認可エンドポイントの実装
  • コールバックエンドポイントの実装
  • トークン交換処理の実装

詳しくは以下をご覧ください。
https://shopify.dev/docs/apps/build/authentication-authorization/access-tokens/authorization-code-grant

Managed Install

Managed Install は、ユーザー体験の向上とアプリ開発コストの削減を目的として導入された仕組みです。

この方式では、認可処理はすべてShopify側で完結します。

アプリ側で必要なのは、Session Token を使って Token Exchange を行い、アクセストークンを取得するという処理のみです。

その結果、以下のようなメリットがあります。

  • リダイレクトが減り、UXが向上する
  • 認可フローの実装が不要になる
  • 実装ミスのリスクが減る

ユーザー・開発者の双方にとってメリットの大きい仕組みといえます。

既存システムの課題

Managed Install 移行前の最大の課題は、フロントエンドとバックエンドが分離された構成における、複雑な認可コードフローでした。

CRM PLUS on LINE は、フロントエンドとバックエンドが別ドメインで分離された構成です。

この構成におけるインストールフローは以下の通りです。

この構成にはいくつかの問題がありました。

  1. リダイレクトが多くフローが複雑

フロントエンド → バックエンド → Shopify → バックエンド → Shopify管理画面…
と、複数のリダイレクトが発生していました。

  1. shopify_app gemとのミスマッチ

CRM PLUS on LINE のバックエンドでは、shopify_app という Shopify アプリを作成するための Shopify 公式の Ruby gem を利用しています。
shopify_app はこのような分離構成を前提としていないため、「既存機能のオーバーライド」が必要でした。

  1. 将来的な不安

shopify_app gem のアップデートによって、

  • 挙動が壊れる可能性
  • メンテナンスコストの増大

といったリスクがあり、根本的なシステム構成の見直しが必要になるかもしれない、といった不安を抱いていました。

正直なところ、そもそもこの構成にしないほうがよかったのでは…という後悔もあります。

Managed Install 移行後のフロー

Managed Install に移行した後は、フローが大幅にシンプルになりました。

変化した点は以下です。

  • 認可処理はすべてShopify側で完結
  • アプリ側は Token Exchange のみ実装
  • リダイレクトがほぼ不要

特に大きかったのは、フロントエンドとバックエンドが分離されていても破綻しない構成になったことです。

また、shopify_app gem の標準機能で完結するようになり、

  • カスタム実装の削減
  • 保守性の向上

につながりました。

まとめ

本記事では、Shopify アプリのインストールフローを Managed Install へ移行した経緯と、その過程で得られた知見を紹介しました。
Managed Install はすでに多くのプロダクトで採用されていると思いますが、まだ移行を検討中の方の参考になれば幸いです。

移行のポイント

  1. shopify_app gem のアップデートが前提
  2. フロントエンド/バックエンド分離構成での考慮点
    • カナリアリリースの難しさ
    • 認可フローの互換性問題
  3. 移行後のメリット
    • 認可フローの実装が不要に
    • コードの削減・保守性向上
    • セキュリティの向上
    • ユーザー体験向上

参考リンク

Social PLUS Tech Blog
Social PLUS Tech BlogPublication

株式会社ソーシャルPLUS 開発チームの技術ブログです。

Discussion