文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么fetch返回302状态码，而XHR不返回？

fetch返回302状态码是因为它遵循了HTTP协议的重定向规则。当服务器返回302状态码时，意味着请求的资源已经被临时移动到了另一个URL。fetch会自动跟随重定向，并返回重定向后的响应，包括重定向后的URL、状态码和响应头信息。

相比之下，XHR（XMLHttpRequest）对象在默认情况下不会自动跟随重定向。当XHR请求返回302状态码时，XHR对象会停留在原始请求的URL，并返回重定向的响应头信息，而不会自动跳转到重定向后的URL。

这种行为差异主要是因为fetch和XHR是两种不同的网络请求API，设计目标和用法有所不同。fetch提供了更灵活的API，可以更好地控制请求和响应的处理过程，包括跟随重定向。而XHR则是早期的网络请求API，相对较为简单，不具备自动跟随重定向的功能。

在实际应用中，根据具体需求选择使用fetch还是XHR。如果需要自动跟随重定向并获取重定向后的响应，可以使用fetch。如果需要更精细地控制请求过程或处理特定的重定向逻辑，可以使用XHR，并手动处理重定向。

腾讯云相关产品中，与网络请求相关的产品包括云服务器（CVM）、负载均衡（CLB）、内容分发网络（CDN）等。这些产品可以提供稳定可靠的网络环境，加速数据传输，提高请求的响应速度和质量。具体产品介绍和链接地址如下：

  1. 云服务器（CVM）：提供可扩展的计算能力，支持快速部署和管理应用程序。了解更多：https://cloud.tencent.com/product/cvm
  2. 负载均衡（CLB）：将流量分发到多个云服务器实例，提高应用的可用性和负载均衡能力。了解更多：https://cloud.tencent.com/product/clb
  3. 内容分发网络（CDN）：通过在全球部署节点，加速静态资源的传输，提高用户访问速度和体验。了解更多：https://cloud.tencent.com/product/cdn
相关搜索:404状态，而不是返回令牌！为什么？C# webrequests->getresponse转换异常，而不是返回状态码http返回状态码302 dedecmsnode api路由不返回任何状态码UrlFetchApp.Fetch返回状态200，但谷歌脚本web应用程序不工作为什么Angularjs responseError拦截器返回状态码-1为什么ceres covariance.Compute()似乎永远运行而不返回？为什么controllerbase.challenge返回200而不是302重定向为什么faster_than_requests返回null而不设置错误？为什么fetch_assoc()不返回值？
相关搜索:
页面内容是否对你有帮助？
有帮助
没帮助

相关·内容

科普系列——如何解释什么是 AJAX？

事实上，这已经不是在AJAX的讨论范围了，但是作为一个拓展知识点，我还是想介绍下状态码这个东西。状态码的作用是服务器返回给客户端的用来描述HTTP请求的状态的。...用来描述HTTP请求的状态码太多了，这里介绍一些常见的状态码。 200 表示从请求成功 301 表示永久性重定向。该状态码表示请求的资源已被分配了新的URI，以后应使用资源现在所指的URI。...随后我们选择XHR，就会出现请求这个网页过程中的所有的XHR请求了。包括name、status、size等信息。 ? 之前提到过了，我们通过XHR携带的数据返回给浏览器渲染页面，到底是怎么实现的呢？...Fetch API 既然XHR这么方便，是不是就没有不足之处呢？当然不是。...XHR 很实用，但并不是一个设计优良的 API，在设计上并不符合职责分离原则，输入、输出以及状态都杂糅在同一对象中，并用事件机制来跟踪状态变化。

83220

    • 2022秋招前端面试题（五）（附答案）

    的实现的超时控制并不能阻止请求过程继续在后台运行，造成了流量的浪费fetch没有办法原生监测请求的进度，而XHR可以（3）Axios Axios 是一种基于Promise封装的HTTP客户端，其特点如下...若用户把 URI 保存成书签，但不会像 301 状态码出现时那样去更新书签，而是仍旧保留返回 302 状态码的页面对应的 URI。同时，搜索引擎会抓取新的内容而保留旧的网址。...303 状态码和 302 Found 状态码有着相似的功能，但是 303 状态码明确表示客户端应当采用 GET 方法获取资源。...注意：当 301、302、303 响应状态码返回时，几乎所有的浏览器都会把 POST 改成GET，并删除请求报文内的主体，之后请求会再次自动发送。...该状态码表示客户端发送附带条件的请求时，服务器端允许请求访问资源，但未满足条件的情况。304 状态码返回时，不包含任何响应的主体部分。304 虽然被划分在 3XX 类别中，但是和重定向没有关系。

    53040

    vue-d2admin-axios异步请求登录，先对比一下Jquery ajax, Axios, Fetch区别

    ，为什么我们还要花费大力气去学习fetch？...的实现的超时控制并不能阻止请求过程继续在后台运行，造成了流量的浪费 4）fetch没有办法原生监测请求的进度，而XHR可以 PS: fetch的具体问题大家可以参考：《fetch没有你想象的那么美》《fetch...默认的设置需要遵循下面的数据返回格式约定： { // 和后台约定的状态码 code: 0, // 后台返回请求状态信息 msg: '返回信息', // data 内才是真正的返回数据...： { // 和后台约定的状态码 code: 'unlogin', // 后台返回请求状态信息 msg: '用户没有登录' } 如果针对某个错误指定处理方法，应该在响应拦截器中加入对应的代码...service.interceptors.response.use( response => {}, error => { // 发生 http 错误，在这里判断状态码 } ) #不返回

    2.6K20

    全面分析前端的网络请求方式

    status 表示 http请求的状态, 初始值为 0。如果服务器没有显式地指定状态码, 那么 status将被设置为默认值, 即 200。...注意：源码里对错误的判定： isSuccess = status >= 200 && status < 300 || status === 304; 返回值除了这几个状态码都会进 error回调。...所以使用fetch当接收到异常状态码都是会进入then而不是catch。这些错误请求往往要手动处理。...和使用原生 fetch携带cookie的情况，发现在不设置 credentials的情况下居然都是默认携带同源 cookie的，这和文档的说明说不一致的，查阅了许多资料后都是说 fetch默认不会携带cookie...，从 fetch()返回的 Promise 不会被标记为 reject， 即使该 HTTP 响应的状态码是 404 或 500。

    1.7K40

    手给 Safari 提了一个Bug，让我意外收获了这些新知识

    中具体请求如下（Safari 自动将原请求和重定向合并为了 1 个请求记录）： 当浏览器收到 3XX 的重定向状态码后，会自动对新的地址发起请求（也就是响应体中 Location 的地址）。...在 Chrome 中，具体请求如下（Chrome 中请求和重定向是 2 条独立的记录）： 猜测可能 我当时的场景，后端返回的状态码是 301，开始以为是各浏览器针对 301 响应码的处理逻辑不一样。...当时脑子里有个印象是：浏览器没有按照规范处理 301和 302，所以后续规范新增了 307 和 308。...XMLHttpRequest 用 XMLHttpRequest 写了一个 Demo，发现浏览器也是会自动对重定向做出处理，打印的是重定向后最终的状态码，值为 200，并不会打印 307，并且会获取到重定向后的返回值...Fetch 的 redirect=manual 配置，并不是手动处理重定向的意思，而是让浏览器不处理重定向。 XMLHttpRequest 可以通过 responseURL 获取到重定向的 URL。

    1.4K20

    【JS】1942- 你知道 XHR 和 Fetch 的区别吗？

    在这个过程中，XHR 和 Fetch API 是两种最常见的方法，用于从 Web 服务器获取数据。XHR 是一种传统的数据请求方式，而 Fetch API 则代表了现代 Web 开发的新兴标准。...XMLHttpRequest XMLHttpRequest，通常简称为 XHR。通过 XMLHttpRequest 可以在不刷新页面的情况下请求特定 URL，获取数据。...("请求失败，状态码：" + xhr.status); } }; // 发起请求 xhr.send(); XHR 的响应处理通常在onreadystatechange事件处理程序中完成。...在上面的例子中，我们等待 XHR 对象的状态变为 4（表示请求完成）并且 HTTP 状态码为 200（表示成功响应）时，解析响应数据。...XHR 在传统项目中仍然有用，而 Fetch API 则在现代 Web 开发中越来越流行。具体选择哪个工具取决于项目的需求和开发团队的偏好，希望本文对你有帮助！

    36510

    你知道 XHR 和 Fetch 的区别吗？

    在这个过程中，XHR 和 Fetch API 是两种最常见的方法，用于从 Web 服务器获取数据。XHR 是一种传统的数据请求方式，而 Fetch API 则代表了现代 Web 开发的新兴标准。...XMLHttpRequest XMLHttpRequest，通常简称为 XHR。通过 XMLHttpRequest 可以在不刷新页面的情况下请求特定 URL，获取数据。...("请求失败，状态码：" + xhr.status); } }; // 发起请求 xhr.send(); XHR 的响应处理通常在onreadystatechange事件处理程序中完成。...在上面的例子中，我们等待 XHR 对象的状态变为 4（表示请求完成）并且 HTTP 状态码为 200（表示成功响应）时，解析响应数据。...XHR 在传统项目中仍然有用，而 Fetch API 则在现代 Web 开发中越来越流行。具体选择哪个工具取决于项目的需求和开发团队的偏好，希望本文对你有帮助！

    71210

    只知道ajax？你已经out了

    text => { console.log(text) }).catch(e => { throw (e) }) 可以在这个代码的基础上，增加一些操作，比如说在对请求数据处理前，先检查下返回结果的状态...对状态非200的结果，增加对应状态码的错误提示；在得到请求数据后，转换成需要的文本格式，或者json格式；另外，还可以对转换后的数据进行进一步的处理，比如请求的数据返回的是下划线类型的数据，可以处理成驼峰形式...2.2 fetch的优点及需要注意的地方 为什么要使用fetch呢？直接使用jQuery和axios也能满足我们的开发需要。...、输出和用事件来跟踪的状态混杂在一个对象里； 更好更方便的写法； 需要注意的是： 兼容性； 当服务器返回400、500等错误码时并不会reject，只有网络错误等导致请求不能完成时，fetch才会被reject...，而XHR可以； fetch跨域请求时，默认不会带cookie，如果需要带cookie，则要指定:credentials:’include’，例如： var result = fetch(url, {

    3.6K571

    尽可能讲清楚ajax

    这意味着用户可以享受到更快、更流畅的网页体验，因为只有需要更新的数据会被请求和交换，而不是重新加载整个页面 ajax的工作流程 1.创建XMLHttpRequest对象 let xhr = new XMLHttpRequest...// console.log(xhr.readyState);//请求的状态 if (xhr.readyState == 4 || xhr.status...== 200) {}//拿到了后端数据 onreadystatechange = ()可以监听请求状态，当xhr.readyState == 4 || xhr.status == 200的时候表示成功了...，不同的状态码代表不同的状态如： 1xx 响应中——临时状态码，表示请求已经接受，告诉客户端应该继续请求或者如果它已经完成则忽略它 2xx 成功——表示请求已经被成功接收，处理已完成 3xx 重定向——...客户端的请求一个不存在的资源，客户端未被授权，禁止访问等 5xx 服务器端错误——处理发生错误，责任在服务端，如：服务端抛出异常，路由出错，HTTP版本不支持等 200 OK 客户端请求成功，即处理成功，这是我们最想看到的状态码

    6210

    【面试题】HTTP知识点整理(附答案)

    ，它允许只请求资源的某个部分，即返回码是206（Partial Content） Host头处理 在HTTP/1.0中认为每台服务器都有唯一的IP地址，但随着虚拟主机技术的发展，多个主机共享一个IP地址愈发普遍...发送请求时，在Max-Forwards首部字段中填入数值，每经过一个服务器端就将该数字减1，当数值刚好减到0时，就停止继续传输，最后接收到请求的服务器端则返回状态码200OK的响应。...(火狐浏览器除外，它的 POST 请求只发一个 TCP 包) HTTP状态码 1xx (信息性状态码) 接受的请求正在处理 2xx 成功 请求正常处理完毕 200 OK 客户端发来的请求在服务器端被正常处理了...webSocket传输的数据包相对于http而言很小，很适合移动端使用 没有同源限制，可以跨域共享资源 WebSocket 教程[7] Ajax, Fetch, Axios ajax const xhr...) { // fetch()请求返回的response是Stream对象，因此我们调用response.json时由于异步读取流对象所以返回的是一个Promise对象

    1.3K30

    PHP+Ajax+Canvas

    协议 状态码 状态文本 (2) 响应头 服务器相关版本信息, 响应体的内容长度(用来进行内容长度校验, 防止内容丢失) .... (3) 响应体 响应给浏览器进行解析的信息 常见状态码...： 200 成功 302 重定向 header("location: 地址") 403 资源不可用, 资源访问受限, 请求是成功了, 但是服务器限制了, 不给返回 404 找不到 500...true/false (2) 查询语句, 成功返回结果集, 失败返回false, $link 和 结果集 都属于资源型(source)对象, 如果要从结果集中取数据, 必须要用对应的方法 mysqli_fetch_assoc...将 sessionId 设置在响应头里面, 返回给浏览器, 浏览器设置 cookie 存在 cookie中 cookie 和 session 配合 实现登录状态保持 的思路 1....浏览器端, 清空浏览器缓存也可以清除登录状态, 清除了 cookie 7-原生Ajax(XMLhttpRequest对象) 发送 get 请求 var xhr = new XMLHttpRequest(

    3.2K30

    HTTP实用指南 - 笔记

    初识 HTTP：网络通讯模型、HTTP 模型 协议分析：发展历史、HTTP/1.1 报文分析 场景分析：静态资源、登录、视频播放、文件上传、跨域 应用：XHR、Fetch、Node 标准库、Axios...# 协议分析 # HTTP 协议发展历史 协议版本 简介 内容 HTTP/0.9 单行协议 请求只有 GET，响应只有 HTML 文档 HTTP/1.0 构建可扩展性 增加了 Header，有了状态码...HTTP/3 草案 未来的协议 # 报文分析（HTTP/1.1） 请求报文： 起始行（格式：请求方法 请求资源路径 HTTP 版本） 请求头 空行 请求正文 响应报文： 起始行（格式：HTTP 版本 状态码...用于对资源的部分修改 方法分类： 安全的：（不会修改服务器数据） GET HEAD OPTIONS 幂等的：（同样的请求多次执行效果相同） GET HEAD OPTIONS PUT DELETE # 状态码...// 在 xhr 的准备状态发生改变的时候，调用该方法 xhr.onreadystatechange = function () { if (xhr.readyState ==

    83020

    【Vue_03】前后端交互

    : 请求已接收 3: 请求处理中 4: 请求已完成，且响应已就绪 - status：响应状态码...Promise的常用API 实例方法 then(方法 1， 方法 2) ：方法 1 处理异步正常的数据，方法 2 处理异步失败(可以不写), 链式编程时需要在上一个 then 中使用 return...，方法执行结束 race(数组) ： 接收一个数组，每个数组元素都是一个 Promise 实例，当这个数组中的 Promise 实例有一个返回时，方法执行结束 二、fetch Fetch 是新的...Ajax 的解决方案，会返回一个 Promise Fetch 不是 Ajax 的进一步封装，而是原生 JS ，没有使用 XMLHttpRequest 1. fetch的基本使用 ...// fetch的参数为请求的路径，默认为 get 请求 fetch("url") .then( function(data) { // 成功返回的 data 是一个 Promise

    98710

    Vue 09.前后端交互

    reject状态的回调函数 // 在then方法中，也可以直接return数据而不是Promise对象，在后面的then中就可以接收到数据了 p.then(function(data){ console.log...console.log(result) // "HELLO TOM" }) fetch Fetch API是新的ajax解决方案 Fetch会返回Promise 更加简单的数据获取方式，功能更强大，更灵活...id=123', { // get 请求可以省略不写 默认的是GET method: 'get' }) .then(function(data) { // 它返回一个Promise实例对象...function(ret){ console.log(ret.data) }) 响应结果 data：实际响应回来的数据，自动将 JSON 数据转化为js对象 headers：响应头 status：响应状态码...async var ret = await axios.post('books', { name: this.name }) # 1.3 根据后台返回的状态码判断是否加载数据

    6K30

    Vue 前后端交互基础

    这种应用模式比较适合纯网页应用，但是当后端对接 App 时，App 可能并不需要后端返回一个 HTML 网页，而仅仅是数据本身，所以后端原本返回网页的接口不再适用于前端 App 应用，为了对接 App...: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成，且响应已就绪 - status：响应状态码...Ajax 的本质是使用 XMLHttpRequest 对象来请求数据，而 XMLHttpRequest 对象是通过事件的模式来实现返回数据的处理。...1.3.2 Fetch 的使用 ☞ 语法 // fetch 参数为请求的路径，默认为 get 请求 fetch("url").then(function(data) { // 成功返回的 data...fetch 方法的 then 会接收一个 Response 实例，值得注意的是 fetch 方法返回的 data 是一个 Promise 实例，不能直接拿到数据。

    2.1K50

    在 JS 中如何使用 Ajax 来进行请求

    Promise对象 fetch() API返回一个promise对象。...如果来自服务器的响应带有任何状态码(如200、404、500)，则promise将被解析。响应对象可以在.then()块中处理。...错误处理 请注意，对于成功的响应，我们期望状态代码为200（正常状态），但是即使响应带有错误状态代码（例如404（未找到资源）和500（内部服务器错误）），fetch() API 的状态也是 resolved...我们可以在response 对象中看到HTTP状态： HTTP状态码，例如200。 ok –布尔值，如果HTTP状态代码为200-299，则为true。...我个人更喜欢使用Axios API而不是fetch() API，原因如下： 为GET 请求提供 axios.get()，为 POST 请求提供 axios.post()等提供不同的方法，这样使我们的代码更简洁

    8.9K20
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券