vue2前端报错Redirect is not allowed for a preflight request.

原创 已于 2023-03-06 11:28:38 修改 · 1.6k 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#django #python #后端

于 2023-03-04 11:11:59 首次发布
在使用axios进行API调用时遇到Redirectisnotallowedforapreflightrequest错误，通常由于URL末尾缺少斜杠引起。修正后，可能出现NoAccess-Control-Allow-Originheader错误，这涉及跨域策略，可以通过配置Django允许跨域或者在前端设置代理服务器解决。

在这里插入图片描述
问题：Redirect is not allowed for a preflight request.
预检请求不允许重定向

为什么是重定向出错呢，这个问题一般出在前端的网址设置。
网上一般是http和https弄混的问题
我用的是django，问题出在

axios.get('http://' + backendUrl + ':8000/requesttest/t1').then(...)

这里t1后面加一个/就可以了，变成

axios.get('http://' + backendUrl + ':8000/requesttest/t1/').then(...)

改完后问题变成：No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
在这里插入图片描述

这个貌似是因为跨域问题，可以设置跨域代理服务器（在vue前端的vue.config.js里）

double_yellow
关注
vue2.0前端解决跨域问题
weixin_42389270的博客
10-09 860
vue2.0前端解决跨域问题 浏览器报错内容如下： Access to XMLHttpRequest at http://xxx.xxx from origin 'http://localhost:8000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.
【VUE】案例：商场会员管理系统
qq_36462472的博客
09-27 1006
创建项目项目目录结构。
【接口】接口调用报错，Redirect is not allowed for a preflight request
黄旺鑫
05-15 5989
场景： 前端Vue项目请求后端接口，有的接口能够调通，有的接口调不通，并且报错。 问题描述 前端报跨域问题的错误，调不通。 request doesn’t pass access control check: Redirect is not allowed for a preflight request. 原因分析： 首先，排查后端接口是否收到请求，通过本地调试，接口有收到请求。 但在Shiro拦截器中被拦截掉，通过断点排查。发现请求一般会有2次，第一次是OPTIONS，第二次才是GET或POST。
关于跨域 Response to preflight request doesn‘t pass access control check
qq_39286701的博客
07-23 6万+
做项目的时候由于访问了不同的服务器，然后导致了跨域问题，报错情况为： has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: Redirect is not allowed for a preflight request。 从网上找了解决办法，也就是采用CORS方案，在要访问的跨域服务器上的返回页面加上标头： response.setHeader(“Access-Con
也许你想不到跨域还会因为这个原因引起？
weixin_42967392的博客
12-06 335
公司的项目本来跑的好好的,突然某天就有运营人员给我反馈说某个后台系统不能登录了,于是我一排查发现跨域相关的配置都处理好了呀？怎么还会出现跨域相关的报错信息。 其中报错的是这一句。 Redirect is not allowed for a preflight request. 那么引起这个报错的原因是什么呢？ 我看了网上某位同仁的文章后悟了,发现我们的http协议前段时间改成了https。而前端这边还是用的http,出现这个错误大多数原因很可能就是你链接后台业务的域名跟服务器端的域名不一致，如果前端这边
Redirect is not allowed for a preflight request
wei_bo_cai的博客
01-03 3万+
Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request. 浏览器CORS预检请求解决上述问题的方案实际生产环境遇到的问题，以及解决方案 ) 浏览器CORS预检请求 在浏览器请求非同源接口时，会向服务器发送预检请求，请求方法为OPT...
Redirect is not allowed for a preflight request 跨域问题的一个解决思路
weixin_44987346的博客
01-25 1万+
由于 http 与 https 配置产生的，表现为不同浏览器访问时出现不同结果的 Redirect is not allowed for a preflight request 跨域问题的分析解决。
Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request. nginx
最新发布
01-18
这会触发错误 `Redirect is not allowed for a preflight request` [^2]。为了有效解决这一问题并确保API调用能够正常工作，可以采取以下措施： #### 修改Nginx配置文件来支持CORS 在Nginx中适当设置响应头以允许...
vue-cli3使用axios请求后端（Python+Django）的数据和跨域proxy设置踩坑指南
明日复明日的博客
05-18 2946
注意：我是负责前端部分的，后端是同学在负责，所以我只负责一个前后端的对接。背景是一个在线商城。 首先清楚前端是作为客户端，请求后端服务端的消息。所以前端后端都run起来。 后端的同学给了我这样的接口文档： 因此后端请求这个url就能够返回数据： 接下来是前端的问题，前端就是要向这个URL发出get的请求。 这里我使用了axios的包，首先npm install axios，然后在/src/api/index.js下对axios做配置： import axios from 'axios'; import
个人技能点(郎)
木木木森林
08-24 2543
个人技能点1. 熟悉 h5 和 c3 新特性：语义化标签，flex 布局，动画等H5 新特性：2. 熟悉js作用域、原型、事件轮询机制、闭包等原理；js 作用域闭包事件轮询机制原型3. 熟悉 ES6 语法标准 promise，async/await 异步方案，箭头函数等`Promise`思路：generatorasync/awaitpromise 和 async/await 的区别箭头函数4. 了解 ajax 前后台数据交互原理，熟练使用原生 ajax 及 ajax 类库，如: axios；并掌握 json
电气工程软件与技能实训（南航）
03-15
南航 电气工程 软件与技能 实训 报告 98分 欢迎下载 所有问题正确回答
记录一次网关方面的问题排查 - Redirect is not allowed for a preflight request
huiaixing的博客
08-04 1086
跨域？预检请求返回302？Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request？
Response to preflight request do‘nt access control check: Redirect is not allow for a preflight re.
jmszl1991的博客
03-22 2789
要注意到最后一句报错：Redirect is not allowed for a preflight request.大致意思就是在预请求的时候不允许重定向。简单的说，就是这个接口需要事先登录，拿到token。当没有登录时，这个接口自然被重定向到login界面。因为这个报错，是出现在发出请求之前的，所以改后台应该没什么用。请求一个接口怎么还重定向了呢？所以，就出现了上边的“Redirect”。这个报错通常情况下会出现在请求跨域。，想到，这个接口是有登录认证的。但是，很遗憾，没有用。
shiro SpringBoot 整合前后端分离开发遇到的跨域问题 Redirect is not allowed for a preflight request
c_h_e_n_g的博客
11-26 8753
shiro SpringBoot 整合前后端分离开发遇到的跨域问题 Redirect is not allowed for a preflight request 。 这是实现简单跨域后报的跨域问题。 我的解决方法 使用过滤器 public class crosFilter implements Filter { @Override public void doFilter(ServletRequest req, ServletResponse resp, Filt
java redirect 跨域_碰到了跨域问题， Redirect is not allowed for a preflight request
weixin_42360846的博客
03-06 3231
liubx：后端配置：@Configurationpublic class CorsConfigure implements WebMvcConfigurer {@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedOrigins("*").allowedMeth...
Response to preflight request doesn‘t pass access control check: Redirect is not allowed for a pref
weixin_46371752的博客
03-02 6835
Access to XMLHttpRequest at 'xxx' from origin 'http://localhost:8082' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request. 1、后端已经解决了跨域问题 2、有些请求不会出现问题，单独一两个请求 解
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' he
热门推荐
小道仙的后宫
09-29 6万+
所有文章优先发布在个人博客上面，后面修改可能忘记同步到优快云。 给你带来麻烦抱歉。 本篇文章个人博客位置 : https://www.xdx97.com/article?bamId=654731133719674880 全部异常如下： 说明：这个异常是由于跨域而引起的 （你没有解决跨域的问题） 如果你是 php 可以去网上找一个 php 后台解决 跨域问题。 我的后台是 ...
【转载】跨域请求出现preflight request失败的问题的解决
非同凡响的博客
05-14 4166
本文转载自：https://developer.aliyun.com/article/753657 简介：# 问题出现 这两天在项目联调过程中突然前端同学报告出现CORS跨域问题无法访问。刚听到很奇怪，因为已经在项目里面设置了CORS规则，理论上不会出现这个问题。 ```java protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, 问题出现 这两天在项目联调过程中突然前端同.
前端导出Excel功能工具包：Vue+element+Export2Excel.js实现
资源摘要信息: "Vue+element 前端导出Excel功能工具包" 是一个专门用于前端开发中，基于Vue.js框架结合element UI组件库的工具包，该工具包的主要功能是提供一种简便的方法，使得开发者能够在前端界面中实现数据导出...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值