“Access-Control-Allow-Origin”-Twitch API 出现错误

Question

我尝试在一个小型 JavaScript 项目上使用 twitch.tv API 获取一些数据。

这是获取请求：

fetch("https://api.twitch.tv/helix/chat/emotes/global", {
                headers: {
                    Authorization: "Bearer XXX",
                    ClientId: "MY_ID"
}}) 

我尝试在 vercel 网站上获取数据并收到此错误

从源“MY-WEBSITE”获取“https://api.twitch.tv/helix/chat/emotes/global”的访问已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头，如果不透明响应满足您的需求，请将请求的模式设置为“no-cors”以在禁用 CORS 的情况下获取资源。

我尝试过的解决方案都不起作用，我认为这只是 vercel 错误，因此它在我自己的网站上上传了代码，但仍然是相同的错误

我不知道出了什么问题

我找到了本指南，但没有帮助

还发现这个网站也不起作用

Answer 1

fetch("https://api.twitch.tv/helix/chat/emotes/global", {
    method: 'GET',
    headers: {
        'Authorization': 'Bearer XXX',
        'Client-Id': 'MY_ID',
        'Content-Type': 'application/json'
    },
    mode: 'cors'  // Include this to handle CORS
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));

试试这个