如何在PayPal弹窗显示期间获取完整收货地址？

你可以通过PayPal JS SDK的onShippingAddressChange回调结合actions.order.get()方法实现需求，具体步骤如下：

• 初始化PayPal按钮时，配置允许用户修改收货地址的shipping_preference（比如'GET_FROM_FILE'，调用用户PayPal账户地址并允许修改），确保onShippingAddressChange回调能触发。
• 在onShippingAddressChange回调内，调用actions.order.get()获取完整订单详情，其中包含收货人姓名、街道等完整收货地址字段。
• 用获取到的地址计算更新后的运费，再通过actions.order.patch()修改订单金额，PayPal弹窗会自动同步新的总额。

代码示例 #

paypal.Buttons({
  createOrder: (data, actions) => {
    return actions.order.create({
      purchase_units: [{
        amount: {
          value: "10.00", // 初始商品金额
          breakdown: {
            item_total: { currency_code: "USD", value: "10.00" }
          }
        }
      }],
      shipping_preference: "GET_FROM_FILE" // 允许用户选择/修改收货地址
    });
  },
  onShippingAddressChange: (data, actions) => {
    // 获取包含完整收货地址的订单数据
    return actions.order.get().then(order => {
      const shippingInfo = order.purchase_units[0].shipping;
      const fullName = shippingInfo.name.full_name;
      const address = shippingInfo.address;
      
      // 调用你的服务端接口计算运费
      return fetch("/api/calculate-shipping", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({
          name: fullName,
          street: address.street_address,
          city: address.city,
          state: address.state,
          postalCode: address.postal_code,
          countryCode: address.country_code
        })
      })
      .then(res => res.json())
      .then(shippingCost => {
        // 计算新的订单总额并更新
        const itemTotal = parseFloat(order.purchase_units[0].amount.breakdown.item_total.value);
        const newTotal = (itemTotal + shippingCost).toFixed(2);
        
        return actions.order.patch([{
          op: "replace",
          path: "/purchase_units/0/amount",
          value: {
            currency_code: "USD",
            value: newTotal,
            breakdown: {
              item_total: { currency_code: "USD", value: "10.00" },
              shipping: { currency_code: "USD", value: shippingCost.toFixed(2) }
            }
          }
        }]);
      });
    });
  },
  onApprove: (data, actions) => {
    return actions.order.capture().then(details => {
      // 处理付款成功后的逻辑，比如同步订单到数据库
    });
  }
}).render("#paypal-button-container");

核心细节说明 #

• actions.order.get()是关键：在onShippingAddressChange回调中调用此方法，能拿到完整的shipping对象，包含full_name、street_address、extended_address等你需要的所有地址字段，解决了默认回调返回字段不全的问题。
• shipping_preference配置：必须设置为允许用户修改地址的选项，否则onShippingAddressChange不会触发。常用选项包括：
  • GET_FROM_FILE：读取用户PayPal账户中的地址，允许用户修改
  • SET_PROVIDED_ADDRESS：预先设置一个地址，用户可以修改
• actions.order.patch()：更新订单金额后，PayPal弹窗会实时刷新显示新总额，用户确认付款时就会使用更新后的金额完成交易，满足你提前计算运费并更新订单的需求。

内容的提问来源于stack exchange，提问作者eikuh