RESTful API 是一种使用 HTTP 协议进行交互的 Web 服务，它使用标准的 HTTP 请求方法 (GET、POST、PUT、DELETE) 来实现对资源的操作。在前端开发中，使用 RESTful API 可以方便地与服务器进行数据交互。本文将详细介绍 RESTful API 中的四种请求方法，包括其使用方式、参数传递、返回值等内容，并提供相关示例代码。
GET 请求
GET 请求用于获取资源，通常用于查询数据。使用 GET 请求时，请求参数一般以查询字符串的形式附加在 URL 后面，例如：
http://example.com/api/users?name=john&age=30
以上 URL 表示查询名为 john，年龄为 30 的用户信息。在实际开发中，可以使用 jQuery 的 $.get() 方法或者原生的 XMLHttpRequest 对象来发送 GET 请求，例如：
// javascriptcn.com 代码示例
// 使用 jQuery 发送 GET 请求
$.get('http://example.com/api/users', { name: 'john', age: 30 })
.done(function(data) {
// 处理返回的数据
});
// 使用 XMLHttpRequest 发送 GET 请求
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/users?name=john&age=30');
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 处理返回的数据
}
};
xhr.send();POST 请求
POST 请求用于创建资源，通常用于提交表单数据或上传文件。使用 POST 请求时，请求参数一般以请求体的形式发送，例如：
// javascriptcn.com 代码示例
// 使用 jQuery 发送 POST 请求
$.post('http://example.com/api/users', { name: 'john', age: 30 })
.done(function(data) {
// 处理返回的数据
});
// 使用 XMLHttpRequest 发送 POST 请求
var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://example.com/api/users');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 处理返回的数据
}
};
xhr.send(JSON.stringify({ name: 'john', age: 30 }));需要注意的是，POST 请求要设置请求头的 Content-Type 为 application/json，同时需要将请求参数转换为 JSON 字符串。
PUT 请求
PUT 请求用于更新资源，通常用于修改数据。使用 PUT 请求时，请求参数一般以请求体的形式发送，与 POST 请求类似，例如：
// javascriptcn.com 代码示例
// 使用 jQuery 发送 PUT 请求
$.ajax({
url: 'http://example.com/api/users/1',
type: 'PUT',
data: { name: 'john', age: 30 },
success: function(data) {
// 处理返回的数据
}
});
// 使用 XMLHttpRequest 发送 PUT 请求
var xhr = new XMLHttpRequest();
xhr.open('PUT', 'http://example.com/api/users/1');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 处理返回的数据
}
};
xhr.send(JSON.stringify({ name: 'john', age: 30 }));需要注意的是，PUT 请求要指定更新的资源地址，例如上面示例中的 /api/users/1，同时也需要设置请求头的 Content-Type。
DELETE 请求
DELETE 请求用于删除资源，通常用于删除数据。使用 DELETE 请求时，请求参数一般以查询字符串的形式附加在 URL 后面，例如：
// javascriptcn.com 代码示例
// 使用 jQuery 发送 DELETE 请求
$.ajax({
url: 'http://example.com/api/users/1',
type: 'DELETE',
success: function(data) {
// 处理返回的数据
}
});
// 使用 XMLHttpRequest 发送 DELETE 请求
var xhr = new XMLHttpRequest();
xhr.open('DELETE', 'http://example.com/api/users/1');
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 处理返回的数据
}
};
xhr.send();需要注意的是，DELETE 请求同样要指定删除的资源地址，例如上面示例中的 /api/users/1。
总结
使用 RESTful API 进行数据交互可以方便地与服务器进行通信，同时也可以提高代码的可读性和可维护性。本文介绍了 RESTful API 中的四种请求方法，包括其使用方式、参数传递、返回值等内容，并提供了相关示例代码。在实际开发中，可以根据具体需求选择相应的请求方法，以便更好地完成数据交互操作。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65878660eb4cecbf2dcc16c2