GetResponse Api 集成使用 fetch() 不起作用

Posted 2023-03-03

【中文标题】GetResponse Api 集成使用 fetch() 不起作用

【英文标题】：GetResponse Api integration Using fetch() is not working

【发布时间】：2021-11-24 12:22:26

【问题描述】：

GetResponse Api 集成使用 Fetch API 方法不起作用

控制台中显示以下短信：

Cross-Origin Request Blocked: 
The Same Origin Policy disallows reading the remote resource at https://api.getresponse.com/v3/contacts.
(Reason: CORS header 'Access-Control-Allow-Origin' missing).

代码如下：

// main.js

// POST request using fetch()
fetch("https://api.getresponse.com/v3/contacts", 
    
    // Adding method type
    method: "POST",
    
    // Adding body or contents to send
    body: JSON.stringify(
        
            campaign : 
                campaignId: "5D8Qm"
            ,
            name: "xyz",
            email: "[e-mail]"
        
    ),
    
    // Adding headers to the request
    headers: 
        
        
        "X-Auth-Token": "api-key o9q5s264jbp9dws0nsevnagqdst81esh",
        "Content-type": "application/json"
    
)

// Converting to JSON
.then(response => response.json())

// Displaying results to console
.then(json => console.log(json));

【问题讨论】：

检查您的请求和响应标头。这是经典的 CORS 问题（更多：access-control-allow-origin）

感谢您的回答。实际上，当我使用 cURL 时，它可以正常工作，但是当我使用 Fetch API 时，它就无法正常工作。我想知道这是什么原因。

“我想知道原因” -> CORS 是与浏览器相关的东西。这就是为什么当你使用 cURL 时它没有发生。它是一种特定于浏览器的防御机制

如果您使用 cURL，请确保您使用它：curl -s -D - https://api.getresponse.com/v3/contacts，其中-s：避免显示进度条，以及-D：转储标头到文件和-：强制重定向到标准输出。 HTTP 协议的标头很重要。 CORS 标准发生在这些标头中。

【参考方案1】：

正如 azbarcea 所说，这是一个经典的 CORS 问题。

关于为什么 cURL 有效但 Fetch API 无效的评论，您可以参考 Stack Overflow 中的this answer。