向测试API发出获取请求时出错

Question

我得到一个错误，而获取请求curl命令工作正常，这是:

curl https://quizapi.io/api/v1/questions -G 
-d apiKey=my_key

但是当我做一个JavaScript请求时

fetch("https://quizapi.io/api/v1/questions", {
body: "apiKey=my_key",
headers: {
"Content-Type": "application/x-www-form-urlencoded"
},
method: "POST"
})
.then((res) => res.json())
.then((data) => {
console.log(data);
});

我得到一个错误:

Uncaught (in promise) SyntaxError: Unexpected token <</p>

编辑

fetch('https://quizapi.io/api/v1/questions', {
headers: {
'X-Api-Key': `${apiKey}`,
},
})
.then((res) => res.json())
.then((data) => {
console.log(data);
});

Answer 1

您将得到一个HTML响应(可能是401错误)。根据API文档，您需要将认证令牌作为apiKey查询参数或X-Api-Key头传递。

curl中的-G标志使其成为GET请求，并将任何数据参数(-d)传递到查询字符串中。这就是你错的地方。

您正在通过fetch()发出POST请求，并试图在请求体中发送凭据。这是行不通的。

试试这个，发出一个GET请求，并在报头

中传递凭据

fetch("https://quizapi.io/api/v1/questions", {
headers: {
"X-Api-Key": apiKey
},
// the default method is "GET"
}).then(res => {
if (!res.ok) {
throw new Error(res) 
}
return res.json()
}).then(console.log).catch(console.error)

---

另一种选择是在查询字符串

中包含apiKey

const params = new URLSearchParams({ apiKey })
fetch(`https://quizapi.io/api/v1/questions?${params}`)