Question

如果不使用vanilla js，我总是使用jQuery来发出AJAX个请求。现在，由于React已经接管，要发出AJAX个请求，因此无需使用整个jQuery库来提出这些请求，因此我们鼓励使用js＆＃39;内置fetch方法，axios或许多其他方法。

我一直在尝试使用POST发出fetch请求。我可以使用axis但不能获取它。

axios.post('https://reqres.in/api/login', {
    "email": "peter@klaven",
    "password": "cityslicka"
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

axios代码看起来像这样，但是当我尝试使用fetch我认为是相同的东西时，它不起作用。谁能看到我失踪的东西？这些值正在发布，但API返回错误，所以我一定做错了。

var data = {
    "email": "peter@klaven",
    "password": "cityslicka"
}

fetch("https://reqres.in/api/login", {
    method: "POST",
    body:  JSON.stringify(data)
})
.then(function(response){ 
    return response.json(); 
})
.then(function(data){ 
    console.log(data)
});

Answer 1

 var headers = {
   "Content-Type": "application/json",                                                                                                
   "Access-Control-Origin": "*"
}

尝试将上述行添加到标题中。

var data = {
    "email": "peter@klaven",
    "password": "cityslicka"
}

fetch("https://reqres.in/api/login", {
    method: "POST",
    headers: headers,
    body:  JSON.stringify(data)
})
.then(function(response){ 
    return response.json(); 
})
.then(function(data){ 
    console.log(data)
});

Answer 2

使用箭头功能：

fetch(`http://myapi.com/user/login`, {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-type': 'application/json',
        },
        body: JSON.stringify({
            login: login,
            senha: password
        })
    }).then(response => response.json())
      .then((responseJson) => console.log(responseJson))
    }).catch(error => console.log(error));

使用fetch

2 个答案: