前段如何把 http request 和 heep response 请求发给后端
时间: 2024-03-11 19:50:07 浏览: 18
前端可以使用 JavaScript 中的 XMLHttpRequest 对象或者 fetch API 发送 HTTP 请求给后端,然后获取后端返回的 HTTP 响应。这些 API 都可以发送 GET、POST、PUT、DELETE 等类型的请求,并且可以设置请求头、请求体、响应类型等参数。
下面是使用 XMLHttpRequest 对象发送 POST 请求的示例代码:
```
var xhr = new XMLHttpRequest();
xhr.open('POST', '/api/endpoint');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onload = function() {
if (xhr.status === 200) {
console.log('Response:', xhr.responseText);
} else {
console.error('Request failed. Status:', xhr.status);
}
};
xhr.send(JSON.stringify({ data: 'example' }));
```
使用 fetch API 发送 POST 请求的示例代码如下:
```
fetch('/api/endpoint', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ data: 'example' })
})
.then(function(response) {
if (response.ok) {
return response.json();
} else {
throw new Error('Request failed. Status:', response.status);
}
})
.then(function(data) {
console.log('Response:', data);
})
.catch(function(error) {
console.error(error);
});
```
在以上示例代码中,`/api/endpoint` 是后端接收请求的 API 地址,`'Content-Type': 'application/json'` 是请求头,`JSON.stringify({ data: 'example' })` 是请求体。后端可以使用相应的框架来解析这个请求,并返回相应的响应。