埋め込みアプリの読み込みが遅いと，ユ，ザ，はストレスをかかえます。アプリユーザーは仕事を進められなくなり、あたのアプリにネガティブな印象をもちます。さらに悪いことに、読み込みがまったくおこなわれない場合には、あなたはレポートの確認にかかりきりになって原因の特定を進めなければなりません。
アプリの読み込みの遅延や失敗は，おもにShopifyのアプリ認証に起因します。今回の記事では,埋め込みアプリの認証の仕組みと,この苛立たしい問題に対する新しい解決方法について解説します。
埋め込みアプリはどう読み込まれているのか
マ，チャントがアプリ読み込みのリンクをクリックすると，数秒後にスクリ，ンに表示されます。このとき，水面下では何が起こっているのでしょうか?
まず，Shopifyは管理画面にiframeを作成し，アプリのURLを設定します。ブラウザがアプリへのリクエストをおこなうと,アプリが以前セットした何らかのクッキーがそこに含まれることになります。このクッキ，に含まれるセッション情報により，アプリはだれがアクセスをしているのかを認識しています。
ときどき，クッキ，がなかったり，セッションがユ，ザ，情報を含まなかったりします。この場合，アプリはShopifyのOAuthサ，ビスにユ，ザ，をリダ，OAuthはユーザーがアプリをインストールしていることを確認して,ユーザーをアプリにリダイレクトバックします。このとき，ユ，ザ，認識情報をアプリに渡しています。アプリはユーザー情報を保存して、セッションクッキーにリンクします。それにより、以降のインタラクションはOAuthサ，ビスの関与なしで発生することになります。
アプリはユーザーがだれなのか判別できるようになったので,ユーザー固有の情報をもとに読み込みできます。
こらも参考にしてください:ShopifyのAPI廃止バ，ジョン:2020 - 10
アプリの読み込みが遅くなる原因とは
OAuthサバへのリダレクトのプロセスは遅いです。セッションクッキをセットするため，リダレクトはiframe内でおこなうことができません。代わりに，ブラウザ全体がリダ。OAuthに必要なすべてのリダレクトでは，最後にユザをShopify管理と埋め込みアプリのペジにリダレクトするだけです。。しかし，必要なリダiframeとブラウザのトップフレームを行き来するジャンプによって,アプリの読み込みは方向が定まらず遅いとユーザーには感じられます。
全体のフロ，は次のようになっています。
1埋め込みiframe：アプリの読み込み
2トップフレ，ム:アプリがShopify OAuthへリダ@ @レクト
3.トップフレ，ム:Shopify OAuthがアプリへリダ@ @レクト
4トップフレ，ム:アプリを読み込み，iframe外であることを認識し，管理へリダ@ @レクト
5トップフレ，ム管理の読み込み
6埋め込みiframe：アプリの読み込み
それぞれの段階でパフォ，マンスが低下し，それがまとまって残念な用户体验に帰結します。全体の読み込み時間は10秒ほどに増え，忍耐強くないユ，ザ，にとっては非常に長く感じられます。
まったくアプリが読み込まれないときの原因
過去数年にわたり，ブラウザのベンダはユザプラバシの保護に注力してきました。デ，タの扱われ方を自分でコントロ，ルできるため，これはユ，ザ，にとって良いことです。とくにブラウザのベンダは，サトを越えたトラッキングを止めようと努力してきました。
Shopifyも関連アプリも，ブラウザのベンダ，がブロックしようとしている“トラッカ，”ではありません。しかし、わたした和が埋め込みアプリ(iframe)を強化するために使用しているテクノロジーは,多くのサイト越えトラッキングに使われているのと同じ技術です。その結果，たとえばSafariの国际旅游业伙伴关系（▪ンテリジェンス·トラッキング·プリベンション)のような，ブラウザに実装されたサShopifyアプリの機能を妨げることになっています。
もっとも関係の深い規制はiframeのクッキ(サドパティクッキ)使用の制限です。Shopifyアプリは，ユ，ザ，セッションを保存するためにクッキ，を使用していて，そのためOAuthのフロ，が必要になることは多くありません。サードパーティのクッキーが制限されると,この情報の取得や保存ができなくなり,読み込みエラーになってしまいがちです。2020年8月，アプリの読み込みエラ，は平均して1日あたり5150年回発生しました。
Safariの国际旅游业伙伴关系のような規制を回避する方法はありますが，実装がむずかしく，望ましくない用户体验を強いられ，すべてのケ，スをカバ，できるわけではありません。
読み込みの遅延とサ，ドパ，ティクッキ，のエラ，を直す方法
Shopifyはアプリを読み込む新しい方法を導入しています。ユ，ザ，情報を取得して保存するためにセッションクッキ，を利用する代わりに，セッショント，クンを使用できます。このセッショント，クンは，アプリへアクセスするユ，ザ，の情報を含んだ安全なパケットです。セッションクッキ，と同じように，このト，クンはアプリにユ，ザ，の情報を伝えます。
アプリが読み込まれると，フロントエンドは应用的桥梁を介してセッショント，クンを取得します。このトークンはアプリのバックエンドへのリクエストに含まれることになり,アプリが必要とするすべてのユーザー特定情報を提供します。つまり,大半のケースにおいて,アプリは初回インストール時にのみOAuthのリダレクトを実行し，クッキにユザ情報を保存する必要がありません。その代わり，初回ンストル後は，アプリはセッショントクンを利用することができます。
埋め込みアプリ読み込みフロ，の新旧比較
この仕組みは，クッキ，ベ，スのアプロ，チよりも著しく信頼でき，高速です。应用的桥梁認証を採用しているアプリは，最大で4倍速く読み込みが可能で，クッキ，関連の読み込みエラ，が起こりません。应用的桥梁認証による埋め込みアプリがどれだけ速く読み込まれるか，以下の動画で比較しています。
セッショントクンの実装にいてより詳しく知りたい方は，詳細なチュ，トリアルにアクセスしてください。
注：アプリのバックエンドへのリクエストにセッショントークンを実装するためには,リクエストがフロントエンドのJavaScriptから来ている必要があります。そのため，水疗中心の場合，より簡単に変換できます。なぜなら，水疗中心はすでにバックエンドの@ @ンタラクションのほとんどでJavaScriptベ，スのリクエストを使用しているからです。あなたのアプリがフロントエンドのレンダリングをサバサドでおこなっている場合(従来のRuby on Railsアプリ，Djangoアプリ，PHPアプリなど)，追加の作業をおこない，Turbolinksなどのルでカプセル化する必要が生じるかもしれません。この方法を解説した個別のチュ，トリアルがあります。
ユ，ザ，エクスペリエンスの向上にむけて
読み込み速度や安定性の問題は，ユ，ザ，にフラストレ，ションを与えてアプリの活用を減退させます。ブラウザのサ，ドパ，ティクッキ，に対する規制の促進は，問題を悪化させるばかりです。
埋め込みアプリのソリュ，ションとなるShopifyの新しい認証方法によって,両方の問題を一度に解決できると同時に,アプリのユーザーエクスペリエンスを向上させることができます。チュ，トリアルを今すぐ始めてみましょう。ユ、ザ、もきっとあなたに感謝するはずです!
Shopifyパ，トナ，プログラムでビジネスを成長させる
マーケティング,カスタマイズ,またはWebデザインや開発など提供するサービスに関係なく,Shopifyパートナープログラムはあなたを成功へと導きます。プログラムの参加は無料で,収益分配の機会が得られ,ビジネスを成長させる豊富なツールにアクセスできます。情熱的なコマスコミュニティに今すぐ参加しましょう!
