Fetch发送请求

发布时间:2025-04-15

fetch 是 javascript 中一个新的 api,用于访问和控制 HTTP 的请求和响应等,不再需要使用传统的 XMLHttoRequest

fetch和ajax的不同

fetch 发送请求后,返回一个 promise,只有在网络无法连接或者请求被阻止的时候,会返回 reject,其他情况下,fetch不会对状态码进行判断,统一返回 resolve,需要在响应数据中手动判断状态码来确定响应是否可用。

fetch 默认不会发送跨域cookies,可以在credentials选项中进行配置。

fetch使用

下面的代码展示最简单的 fetch 使用,在 fetch() 中填入一个请求路径,会得到一个响应,解析响应得到最终的数据,这里使用 json() 来解析 json 数据。

fetch("http://example.com/movies.json") // 发起请求
  .then((response) => response.json())  // 解析响应数据
  .then((data) => console.log(data));   // 打印数据

请求参数配置

fetch() 除了请求路径之外,还可以传入第二个参数,该参数类型是一个对象,可以用来控制本次请求的配置

const response = await fetch('https://example.com/answer', {
    method: "POST", 
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(data), 
});

cosnt json = response.json(); 

console.log(json);

上面的代码中,在配置项中设置了本次请求的方法是 POST,还指定了本次传输的数据类型是 json 格式,通过 body 写入需要传输的数据。

其他阅读

Angular使用路由复用实现单页多窗(Tab页形式)

我们在开发后台管理系统时,一个很重要的需求就是多窗口编辑,来回切换使用。一种思路是使用iframe来记录多个多页面展示,本文通过Angular路由复用来实现这一需求。

查看原文

Js文件上传

文件上传是一个前端比较常见的功能,无论是以前的MVC客户端,还是现代化SPA客户端中,但万变不离其宗,其内核基本不变,本文就此讨论简单文件上传(以图片为例子)。

查看原文

WPF使用云母材质

在最新的Windows 11 OS中,微软为流畅设计(Fluent Design)带来了新的云母材质,云母材质一种不透明的动态效果,微软将其作为Windows 11应用窗体的默认材质。

查看原文

C#获取电脑的网卡地址

使用C#开发Windows应用,需要进行特定网卡绑定的时候我们需要获取电脑本机的网卡地址,本文会介绍几种获取电脑网卡地址的方法。

查看原文

个人简介

你好,我是猪头少年,是一名定居在云南的软件工程师,主要的开发语言为 C#JavaScript,后端使用 ASP.NET Core,桌面端使用 WPFUnity ,前端使用 AngularBabylon.js。平时喜欢自驾出游。欢迎大家联系我。

查看原文