PayPalの支払いリンクおよびボタンに関するトラブルシューティングのヒント
エラーが発生し、ウェブサイトにボタンが表示されません。
- インターネット接続が機能していることを確認します。
- ウェブサイトの他のページにアクセスして、問題なくロードされていることを確認します。
- PayPalボタンのページに移動して以下を確認します。
*ボタンは[保存済みのボタン]に表示されていますか?
*[編集]を選択し、ボタンコードがウェブサイトのものと一致していることを確認します。 - 商品ページ(ボタンコードをペーストした場所)を右クリックして、[開発者ツール]をクリックします。上部に表示されている[コンソール]タブに移動します。コンテンツセキュリティポリシーを導入している場合は、次のようなCSPエラーが表示されることがあります(CSPエラーの例)。
- スクリプト'https://www.paypal.com/sdk/js**'は、コンテンツセキュリティポリシーのディレクティブ"default-src 'self'"に違反しているため、読み込みが拒否されました。'script-src-elem'は明示的に設定されていないため、'default-src'がフォールバックとして使用されることをご留意ください。
- コンテンツセキュリティポリシーのディレクティブ"default-src 'self'"に違反しているため、'https://www.paypal.com/**'への接続が拒否されました。'connect-src'は明示的に設定されていないため、'default-src'がフォールバックとして使用されることをご留意ください。
- コンテンツセキュリティポリシーディレクティブ "script-src https://*.paypal.com"に違反しているため、インラインスクリプトの実行が拒否されました。インラインの実行を有効にするには、'unsafe-inline'のキーワード、ハッシュ('sha256-WYDWDPwB8j2VePYrqy38aHPcJLsasO//lnXymmxscUk=')、またはノンス('nonce-...') のいずれかが必要です。
- コンテンツセキュリティポリシーのディレクティブ"default-src 'self'"に違反しているため、画像'https://tracking.qa.paypal.com/webapps/tracking/ts?**'の読み込みが拒否されました。'img-src'は明示的に設定されていないため、'default-src'がフォールバックとして使用されることをご留意ください。
- コンテンツセキュリティポリシーのディレクティブ"default-src 'self'"に違反しているため、'https://www.paypal.com/'のフレーム化が拒否されました。'frame-src'は明示的に設定されていないため、'default-src'がフォールバックとして使用されることをご留意ください。
上記のエラーを解決するには、以下の追加をお試しください。
オプション-1 (HTML): CSPがHTMLファイルで構成されている場合は、以下のコードを使用してCSPコードを置き換えます
<meta http-equiv="Content-Security-Policy" content="default-src 'self';
script-src 'unsafe-inline' https://*.paypal.com https://*.paypalobjects.com;
style-src 'unsafe-inline' https://*.paypal.com; connect-src
https://*.paypal.com; frame-src https://*.paypal.com; img-src
https://*.paypal.com https://*.paypalobjects.com">
オプション-2 (サーバーサイド): CSPがサーバー側で構成されている場合は、以下のコードを使用してCSPコードを置き換えます。
Content-Security-Policy: script-src 'unsafe-inline' https://*.paypal.com https://*.paypalobjects.com
Content-Security-Policy: style-src 'unsafe-inline' https://*.paypal.com
Content-Security-Policy: connect-src https://*.paypal.com
Content-Security-Policy: frame-src https://*.paypal.com
Content-Security-Policy: img-src https://*.paypal.com https://*.paypalobjects.com
商品名/価格/数量のレイアウト/サイズ/色を変更する方法を教えてください。
PayPalのウェブサイトで商品名/価格/数量のレイアウト/サイズ/色を変更する方法は次のとおりです。
- PayPalボタンのページに移動します。
- 保存したボタンの横にある[開く]をクリックし、[編集]を選択します。
- [ボタンをカスタマイズ]をクリックし、必要な変更を行います。
商品情報(商品名、金額など)を編集しました。
もう一度ボタンコードをコピーして貼り付ける必要はありますか?
いいえ。弊社はすべての情報をペイパルサーバーから取得します。アカウントの変更を保存した後に、ウェブサイトにコピー&ペーストしたボタンコードを更新する必要はありません。
注: 商品の通貨コードを変更した場合は、決済ボタンを更新する必要があります。
コードにクライアントIDが表示されています。これは何を意味するのですか?
クライアントIDとは、お客さまのアカウントに含まれる売り手のクライアントIDです。編集は行わずに、ボタンコードに記載されているとおりに使用してください。
複数のボタンを追加しましたが、ウェブページに表示されません。
同じウェブページ上に複数のボタンを追加したとき、以下の場合は機能しません。
- 同じウェブページに同じボタンIDを複数回コピー&ペーストした場合は、最初のボタンのみが表示されます。同じボタンIDを複数回繰り返して使用することはできません。
- 同じウェブページで、異なるボタンIDをコピー&ペーストしていても、他の通貨を指定している場合は、最初のボタンのみが表示されます。同じウェブページ上のボタンに外貨を追加することはできません。
- 異なるボタンIDをコピー&ペーストして動作が遅くなった場合は、クライアントIDのスクリプトタグが一度だけ追加されていることを確認します。スクリプト行の例を以下に示します。
<script src="https://www.paypal.com/sdk/js?client-id=XYZ&components=hosted-buttons&enable-funding=venmo¤cy=USD"></script>
PayPalプレミアアカウントを持っていますが、支払いリンクとボタンが
オプションとして表示されません。
この機能はPayPalビジネスアカウントでのみご利用いただけます。この機能をご利用になるには、アカウントをアップグレードするかビジネスアカウントを作成してください。
このエクスペリエンスをPayPal Sandboxでテストするにはどうすればよいですか?
支払いリンクとボタンは、Sandboxでテストできます。
お客さまから、一部の支払方法を表示できないと伝えられました。
ペイパル、Pay Later、Venmoなどの支払方法が表示されるかどうかは、買い手が在住している国でどの方法が適用されているかによって異なります。
自分のウェブサイトで、クレジット・デビットのインライン展開が
表示されません。
親コンテナの幅と高さが、インライン展開に対応するように設定されていることをご確認ください。詳細については、ホスティングプラットフォームのドキュメントまたはサポートをご参照ください。
支払いリンクとボタンは即時支払い通知(IPN)をサポートしていますか?
はい。次の手順に従って、即時支払い通知(IPN)をセットアップして有効にします。
ペイパルでIPN設定を確認する方法は次のとおりです。
- [アカウント設定]に移動します。
- [通知]から[即時支払い通知]を選択します。
- [リンクを更新]をクリックします。
IPN設定を有効にする方法は次のとおりです。
- IPNハンドラーURLを追加し[IPNメッセージを受信する(有効)]を選択します。
- [保存]をクリックします。
サーバーコードでIPNを処理します。
- 支払いリンクとボタンのトランザクションが完了すると、PayPal IPNは手順2で設定した通知URLを呼び出します。
IPN履歴へのアクセス:
- https://www.sandbox.paypal.com/merchantnotification/ipn/history
- https://www.paypal.com/merchantnotification/ipn/history
参考情報
はじめに: https://developer.paypal.com/api/nvp-soap/ipn/IPNIntro/
サーバーコードで正しいIPN URLを使用します。
さまざまな言語サンプル GitHub - paypal/ipn-code-samples
購入者がリダイレクトページに誘導された場合、ペイパルでは
購入に関するどのような情報を送信していますか? 支払いリンクとボタンは支払いデータ転送をサポートしていますか?
また、どの変数をサポートしていますか?
はい。こちらに記載されているように、ペイパルでは支払いデータ転送の変数をサポートしています。支払いリンクおよびボタンを設定する際に自動復帰設定をオンにしておくことで、支払いデータ転送を受信することができます。
売り手がボタンコードまたは支払いリンクに手動でロケール(地域)を追加した場合、
支払いリンクとボタンはそのロケールをサポートしますか?
デフォルトでは、支払いリンクとボタンは、購入者のブラウザ設定を使用して、ボタンコードと支払いリンクを表示するようになっています。
売り手は、クエリパラメータとして「locale.x=fr_FR and country.x=」を追加することで、同じ支払いリンクとボタンコードのみを上書きできます。地域でサポートされているコードの一覧については、こちらをご覧ください。設定中に売り手が入力したテキストは翻訳されません。
例: https://www.paypal.com/ncp/payment/F3YMU2ZGT49XX?locale.x=ja_JP&country.x=JP
例:
<script src="……..¤cy=USD&locale.x=ja_JP&country.x=JP"></script>
支払いリンクやボタンコードで表示されるラベルの一部を非表示にすることは
できますか?
お客さまのウェブサイトで異なるビジュアル設定が行われている場合でも、弊社が提供するボタンコードを非表示にすることはお勧めしません。
ウェブサイトでボタンコードを非表示にしても、取引の処理方法は変わりません。取引では、お客さまがホストされているボタンIDの設定が引き続き使用されます。
購入者による入力を必要としないタイプのボタンを使用している場合、ボタンの周囲の特定のテキストまたはすべてのテキストを非表示にすることができます。たとえば、購入者が数量または複数の商品をリストから選択する必要がある場合、それらの入力要素を非表示にしていると、その取引は失敗します。
商品の価格を非表示にする方法の例は以下のとおりです。
このスクリプトをボタンコードの下に追加し、
<style>
#paypal-form-fields-container-{<HostedButton_ID>}
#price-label {
display: none !important;
}
}
</style>
- desc-label (製品名)
- price-label (価格)
複数の要素を非表示にする場合は、IDを区切って使用します。
style> #paypal-container-
<style>
#paypal-container-<HostedButton_ID>
{
#paypal-form-fields-container-<HostedButton_ID>
{
display: none !important;
}
}
</style>
支払いリンクとボタンを上書きして、
[設定]の配送料を適用することはできますか?
支払いリンクおよび支払いボタンには、アカウント設定(配送設定では以下の設定とも呼ばれます)で一括上書きされた配送料は適用されません。
ボタンの通貨を変更しましたが、
ウェブサイトに更新が反映されていません。
ボタンをウェブサイトに貼り付けた後で、ボタンの通貨を変更した場合は、ボタンコードを再度コピーし、ウェブサイトに貼り付ける必要があります。
[配送先住所を収集しない]を選択すると、[設定内の配送料を使用する]および
[設定内の税金を使用する]を選択できません。
[設定]の配送料と税金は、購入者の配送先の郵便番号や国によって異なります。[配送先住所を収集しない]を選択した場合、[設定]で配送料と税金を計算するための購入者の配送先住所は提供されません。[配送料]および[税率]のドロップダウンで、他のオプションを選択することをお勧めします。
支払いリンクとボタンはWebhookに対応していますか?
はい。Webhookを有効にする方法は次のとおりです。
- マーチャントアカウント認証情報を使用して[デベロッパーダッシュボード]にログインします。
- [ライブ]に切り替えます。
- [アプリと資格情報]をクリックします。
- 下にスクロールして、[Webhookの管理]を選択します。
- ライブ用のWebhook URLを追加できます。SandboxにWebhookを追加する場合は、この同じページで右上隅にある[ライブ]を[Sandbox]に切り替えます。
- WebhookコールバックURLを追加し、NVPまたはSOAP APIの実装に応じて選択したイベント時にPayPalによって呼び出されるすべてのイベントまたはチェックアウト、支払いイベントを選択して、Webhook情報に関するPayPal NVP/SOAP APIを呼び出します。
Webhook応答の例:
"id": "WH-12D11567VE3425924-2G120938U32719946",
"event_version": "1.0",
"create_time": "2024-09-14T15:55:58.043Z",
"resource_type": "capture",
"resource_version": "2.0",
"event_type": "PAYMENT.CAPTURE.COMPLETED",
"summary": "128.88米ドルの支払いが完了しました",
"resource": {
"supplementary_data": {
"related_ids": {
"order_id": "8LM68409BR5528307"
}
],
"id": "7KK30254642170736",
"status": "完了"