登録時にウェブベースの決済アプリを構成する方法について説明します。
ウェブベースの決済アプリはプログレッシブ ウェブアプリ（PWA）であり、Service Worker 上で実行されます。支払いアプリの Service Worker は、販売者からの支払いリクエストの取得、支払いアプリの起動、販売者との通信の仲介において重要な役割を果たします。
ウェブベースの支払いアプリを構成するには、利用可能なお支払い方法と Service Worker を登録する必要があります。ウェブベースの支払いアプリは、ウェブアプリ マニフェストを使用して宣言的に構成できます。
ブラウザ サポート
ウェブ決済はいくつかの異なるテクノロジーで構成され、サポート状況はブラウザによって異なります。
ウェブアプリ マニフェストを使用して支払いアプリを構成する
ウェブベースの決済アプリを宣言的に構成するには、ウェブアプリ マニフェストを提供します。
ウェブアプリ マニフェストの次のプロパティは、ウェブベースの決済アプリに関連しています。
nameiconsserviceworkersrcscopeuse_cache
お支払い方法の設定を確認し、お支払い方法のマニフェストでウェブアプリ マニフェストが正しく参照されていることを確認してください。
Service Worker ジャストインタイム（JIT）の登録
JIT の登録に必要なのはウェブアプリ マニフェストの提供のみで、追加のコーディングは必要ありません。ウェブアプリ マニフェストの設定が完了し、適切に提供されている場合は、準備は完了です。残りはブラウザが処理します。
ウェブベースの支払いアプリのデバッグ
ウェブベースの決済アプリのフロントエンドを開発する場合、販売者のコンテキストと決済アプリのコンテキストを行き来することになるでしょう。Chrome での開発に役立つデバッグのヒントを紹介します。
ローカル サーバーでの開発
開発にはどのサーバーを使用しますか？多くのデベロッパーは localhost または社内サーバー環境を使用する傾向がありますが、これはブラウザの強力な機能には安全な環境（HTTPS）と有効な証明書が必要になる傾向があるため、困難な場合があります。Payment Request API と Payment Handler API も例外ではなく、通常、localhost または社内サーバーには有効な証明書が提供されません。
ただし、Chrome などの一部のブラウザでは、デフォルトで http://localhost の証明書が除外されます。Chrome では、Chrome インスタンスを起動して証明書の要件を免除することもできます。たとえば、http://*.corp.company.com から要件を除外するには、次のフラグを使用します。
macOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --ignore-certificate-errors --unsafely-treat-insecure-origin-as-secure=http://*.corp.company.com
Windows
chrome.exe --ignore-certificate-errors --unsafely-treat-insecure-origin-as-secure=http://*.corp.company.com
ランタイム フラグを指定して Chrome を実行する方法について詳しくは、フラグを指定して Chromium を実行するをご覧ください。
ローカル サーバーのポート転送
Chrome の DevTools を使用してローカル ウェブサーバーを Android デバイスにポート転送し、モバイル ブラウザからその動作をテストできます。方法については、ローカル サーバーへのアクセスをご覧ください。
パソコンの DevTools から Android Chrome でウェブサイトのリモート デバッグを行う
パソコンの DevTools で Android Chrome をデバッグすることもできます。方法については、Android デバイスのリモート デバッグを使ってみるをご覧ください。
支払いハンドラのイベント ロギング
DevTools で Payment Handler API のイベントを表示できるため、ローカルでの開発が容易になります。販売者のコンテキストで DevTools を開き、[Application] ペインの [Payment Handler] セクションに移動します。[他のドメインからのイベントを表示する] チェックボックスをオンにして [記録] ボタンをクリックして、支払いを処理する Service Worker に送信されるイベントの取得を開始します。
次のステップ
次のステップでは、Service Worker が実行時に支払いトランザクションをオーケストレートする方法について説明します。