如何修复响应：type: "cors" 尝试通过 paypal api 创建付款时

Posted 2023-02-22

【中文标题】如何修复响应：type: "cors" 尝试通过 paypal api 创建付款时

【英文标题】：How to fix Response: type: "cors" when trying to create payment through paypal api如何修复响应：type: "cors" 尝试通过 paypal api 创建付款时

【发布时间】：2019-10-05 14:54:34

【问题描述】：

我正在测试 fetch API 以使用 PayPal plus 创建付款

我的第一个 fetch 功能正常工作，我做了一个 Oauth 来获取不记名令牌，这样我就可以让我的 access_token 进行付款发布

callPaypal = async () => 
    try 
      const details = 
        grant_type: "client_credentials"
      ;
      var formBody = [];
      for (var property in details) 
        var encodedKey = encodeURIComponent(property);
        var encodedValue = encodeURIComponent(details[property]);
        formBody.push(encodedKey + "=" + encodedValue);
      
      formBody = formBody.join("&");
      var request = 
        method: "POST",
        headers: 
          "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
          Authorization:
            "Basic <secrets>",
          "cache-control": "no-cache"
        ,
        body: formBody
      ;
      const res = await fetch("https://api.sandbox.paypal.com/v1/oauth2/token", request);
      const data = await res.json();
      console.log(data);
      const access_token = data.access_token;
      this.makePaymentPaypal(access_token);
     catch (error) 
  ;

makePaymentPaypal = async (access_token) => 
    try 
      var request = 
        method: "POST",
        headers: 
          "Access-Control-Allow-Origin": "*",
          "Content-Type": "application/json",
          Authorization: `Bearer $access_token`,
          "cache-control": "no-cache"
        ,
        body: JSON.stringify(
          intent: "sale",
          application_context: 
            shipping_preference: "SET_PROVIDED_ADDRESS"
          ,
          payer: 
            payment_method: "paypal",
            payer_info: 
              billing_address: 
                line1: "Mariano Escobedo 476 piso 14",
                line2: "Anzures, Miguel Hidalgo",
                city: "Mexico DF",
                country_code: "MX",
                postal_code: "11590",
                state: "DF"
              
            
          ,
          transactions: [
            
              amount: 
                currency: "MXN",
                total: "522.00",
                details: 
                  subtotal: "522.00"
                
              ,
              description: "Pedido en Envia Flores",
              payment_options: 
                allowed_payment_method: "IMMEDIATE_PAY"
              ,
              invoice_number: "94234212",
              item_list: 
                items: [
                  
                    name: "Arreglo de flores",
                    description: "Amigo secreto",
                    quantity: "1",
                    price: "290.00",
                    sku: "sku01",
                    currency: "MXN"
                  ,
                  
                    name: "Ilumina su dia",
                    description: "Ilumina su dia",
                    quantity: "1",
                    price: "290.00",
                    sku: "sku02",
                    currency: "MXN"
                  ,
                  
                    name: "Descuento",
                    description: "Descuento",
                    quantity: "1",
                    price: "-58.00",
                    sku: "skiu12",
                    currency: "MXN"
                  
                ],
                shipping_address: 
                  recipient_name: "Costumer Costumer",
                  line1: "Mariano Escobedo 476 piso 14",
                  line2: "Anzures, Miguel Hidalgo",
                  city: "Mexico DF",
                  country_code: "MX",
                  postal_code: "11590",
                  state: "DF",
                  phone: "54545454"
                
              
            
          ],
          redirect_urls: 
            cancel_url: "https://www.example.com",
            return_url: "https://www.example.com"
          
        )
      ;
      const res = await fetch("https://api.sandbox.paypal.com/v1/payments/payment", request, 
        mode: "no-cors"
      );
      const data = await res.json();
      console.log(data)
     catch (error) 
  ;

已编辑问题，因为我已经解决了，下面的代码丢失了，我需要将响应转换为 json。

      const data = await res.json();
      console.log(data)

添加此新代码之前的旧错误消息是：

Response type: "cors", url: "https://api.sandbox.paypal.com/v1/payments/payment", redirected: false, status: 201, ok: true, …

【参考方案1】：

我终于找到了解决方案，代码没问题，缺少的是响应需要像这样用json()进行转换：

  const res = await fetch("https://api.sandbox.paypal.com/v1/payments/payment", request);
  var data = await res.json();
  console.log(data);

在我将 res.json 添加到响应中后，我可以正确读取它。

【讨论】：

var data = await res.json(); 如何帮助移除 cors ？我面临同样的问题