1. 開発者向けのウェブ技術
  2. Web API
  3. PaymentRequest
  4. shippingAddress

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

PaymentRequest: shippingAddress プロパティ

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

非推奨;: この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

非標準: この機能は標準化されていません。非標準の機能はブラウザーの対応が限られ、将来的に変更または削除される可能性があるため、本番環境での使用は推奨されません。ただし、標準の選択肢が存在しない特定のケースでは、有効な代替手段となる場合があります。

shippingAddressPaymentRequest インターフェイスの読み取り専用プロパティで、ユーザーから指定された配送先住所を返します。既定値は null です。

一般的に、ユーザーエージェントは shippingAddress プロパティ値を埋めます。 これは、PaymentRequestコンストラクターを呼び出すときに options.requestShippingtrue に設定することで行うことができます。

下記の例では、送料が地域によって異なります。shippingaddresschange が呼び出されると、updateDetails() が呼び出されて PaymentRequest の詳細を更新し、shippingAddress を使用して正しい送料を設定します。

js
// Initialization of PaymentRequest arguments are excerpted for the sake of
// brevity.
const payment = new PaymentRequest(supportedInstruments, details, options);
payment.addEventListener("shippingaddresschange", (evt) => {
 evt.updateWith(
 new Promise((resolve) => {
 updateDetails(details, request.shippingAddress, resolve);
 }),
 );
});
payment
 .show()
 .then((paymentResponse) => {
 // Processing of paymentResponse excerpted for brevity.
 })
 .catch((err) => {
 console.error("Uh oh, something bad happened", err.message);
 });
function updateDetails(details, shippingAddress, resolve) {
 if (shippingAddress.country === "US") {
 const shippingOption = {
 id: "",
 label: "",
 amount: { currency: "USD", value: "0.00" },
 selected: true,
 };
 if (shippingAddress.region === "MO") {
 shippingOption.id = "mo";
 shippingOption.label = "Free shipping in Missouri";
 details.total.amount.value = "55.00";
 } else {
 shippingOption.id = "us";
 shippingOption.label = "Standard shipping in US";
 shippingOption.amount.value = "5.00";
 details.total.amount.value = "60.00";
 }
 details.displayItems.splice(2, 1, shippingOption);
 details.shippingOptions = [shippingOption];
 } else {
 delete details.shippingOptions;
 }
 resolve(details);
}

ブラウザーの互換性

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

AltStyle によって変換されたページ (->オリジナル) /