如何更新Adyen Checkout Session的商品与金额？

Adyen的/sessions API不支持直接更新已创建的会话，所以你想修改现有会话商品和金额的思路无法实现，以下是两种可行的优化方案：

方案一：提前预加载支付方式配置（推荐） #

不用提前创建0元会话，而是在首页调用/paymentMethods API获取支付方式基础配置（该API无需指定具体金额和商品），当用户选定商品后，再创建真实会话并结合预加载的配置初始化Drop-in，以此减少支付页的加载耗时：

• 首页预加载逻辑（Angular示例）：

  // 组件初始化时预加载支付方式
  ngOnInit(): void {
    this.backendService.callAdyenPaymentMethods({
      merchantAccount: '你的商户账号'
    }).subscribe(res => {
      // 缓存支付方式配置，可通过Service或RxJS BehaviorSubject存储
      this.adyenCacheService.setPaymentMethods(res);
    });
  }
  

• 支付页创建会话并初始化Drop-in：

  // 用户选品完成后执行
  initPayment(): void {
    const realSessionReq = {
      merchantAccount: '你的商户账号',
      amount: { value: 选定商品金额, currency: 'USD' },
      reference: `ORDER-${Date.now()}`,
      returnUrl: `${window.location.origin}/payment-result`
    };
  
    this.backendService.createAdyenSession(realSessionReq).subscribe(session => {
      const dropinConfig = {
        session: session,
        paymentMethodsResponse: this.adyenCacheService.getPaymentMethods(),
        onSubmit: (state, component) => { /* 提交逻辑 */ },
        onAdditionalDetails: (state, component) => { /* 额外信息处理逻辑 */ }
      };
  
      // 挂载Drop-in到指定DOM容器
      const dropin = new Adyen.Dropin(dropinConfig);
      dropin.mount('#adyen-dropin-container');
    });
  }
  

方案二：临时会话+重新创建真实会话 #

如果坚持要提前加载会话，可在首页创建0元临时会话，用户选定商品后直接废弃该临时会话，重新调用/sessions API创建带真实金额和商品的新会话，再用新会话初始化Drop-in：

• 注意：未使用的临时会话会自动过期，无需手动清理，但需确保后端调用Adyen API时使用正确的商户账号和参数。

关键注意事项 #

• 所有Adyen API调用必须通过你的后端代理，禁止在前端直接调用，避免敏感数据泄露；
• Angular中初始化Drop-in时，需确保目标DOM容器已渲染完成，可通过AfterViewInit钩子或ViewChild获取容器元素后再执行挂载逻辑。

内容的提问来源于stack exchange，提问作者vince-ux