layui跨域上传文件报错Response to preflight request doesn‘t pass access control check: It does not have...

最新推荐文章于 2024-04-22 14:07:29 发布
最新推荐文章于 2024-04-22 14:07:29 发布
阅读量820 收藏 2
点赞数
分类专栏： php js ajax 文章标签： php 接口 layui ajax跨域问题 upload
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39869677/article/details/111623960
版权
php 同时被 3 个专栏收录
2 篇文章 0 订阅
订阅专栏
js
1 篇文章 0 订阅
订阅专栏
ajax
1 篇文章 0 订阅
订阅专栏

最近后台系统要使用layui的文件上传跨域功能, 后端接口配置好了允许跨域,图片也可以正常上传了,心里想着就完事了

结果稍微测了一下,发现视频居然不能正常上传,控制台一直在报一个错:

Access to XMLHttpRequest at 'xxxxxx' from origin 'xxxxxx' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

切换到network,发现上传视频的时候居然请求了两个接口,其中一个还是OPTION类型的请求,纳尼???

 

经过不断试验得知, 当layui在上传时使用监听进度条的方法时就会这样:

上传视频属于大文件上传了,总不可能吧进度条干掉吧,于是经过一番查询得知:

当监听上传进度并且需要跨域时,会先使用OPTION类型测试一下接口是否正常(状态200)

所以就好办了,当请求类型是option时直接返回空就行了

PHP接口(THINKPHP)

 

再测试一下上传,舒服了

马斯克_
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
10-16
今天小编就为大家分享一篇在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
已解决：No 'Access-Control-Allow-Origin'跨域问题
08-19
主要介绍了已解决：No 'Access-Control-Allow-Origin' 跨域，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Reason: CORS request did not succeed 浏览器
你好_晴天
12-25 1178
axios vue3跨域问题解决，谷歌浏览器strict-origin-when-cross-origin 解决
【原创】OPTIONS请求之跨域请求被阻止（原因：CORS预检通道未成功）解决方案 超神！牛逼！
RubyXun's-Blog
06-02 4281
前后端交互：OPTIONS请求跨域失败问题
jQuery.form插件的使用及跨域异步上传文件
10-22
个跨域异步上传功能我们借助了Jquery.form插件。接下来通过本文给大家介绍jQuery跨域异步上传文件的相关知识，感兴趣的朋友一起学习吧
ajax请求接口报错 Response to preflight requestdoesn‘t pass access control check: It does not have HTTP ok
amoureux555的博客
04-26 2869
ajax请求接口报错 Response to preflight requestdoesn't pass access control check: It does not have HTTP ok status
【前端】跨域问题：“ It does not have HTTP ok status.”
qq_39369673的博客
03-06 4868
跨域请求报错：It does not have HTTP ok status.
nginx配置Https访问并且解决CORS请求未能成功
qq_33567987的博客
07-17 6040
作为一名新手小白，分享自己解决nginx配置免费https的方法,解决cors请求失败 1、安装Nginx(ubuntu) sudo apt-get install nginx 2、生成SSL证书 1.使用let’s encrypt颁发的免费SSL证书，安装软件 sudo apt-get update ...
跨域报错：Response to preflight request doesn‘t pass access control check: No ‘Access-Control-Allow-Origi
仰望星空
12-21 1万+
在编写一个简单POST跨域请求时碰到了这个问题，我看了下网上的答案，感觉我好像也都做到了，但是就是不行，我将核心问题进行了抽象，抽象为下面的代码： 前端是这样的： $.ajax({ type: "post", url: "http://localhost:8081/test/testUploadPhoto", dataType: "json", data:{ canvasPhotoBase64Data:"dataUrl", }, beforeSend:
Spring Security配置类导致跨域问题：doesn‘t pass access control check: It does not have HTTP ok status.
ELSA001的博客
03-04 785
Spring Security配置类导致跨域Access to XMLHttpRequest at 'http://localhost:8081/restaurant/list' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
完美解决axios跨域请求出错的问题
01-19
错误信息： Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:9000’ is therefore not allowed access. The response had HTTP status code 403 随着前端框架的发展，如今前后端数据分离已经成了趋势，也就是说，前端只需要用ajax请求后端的数据合
flash跨域策略文件crossdomain.xml配置详解以及防范措施.docx
04-27
flash跨域访问策略。渗透测试时检查crossdomain.xml配置信息，应当重点检查allow-access-from=*、allow-http-request-headers-from=*、site-control=allow将会导致漏洞。特别注意参数为*和all，当站内没有crossdomain.xml时将不允许flash跨域访问。不会导致漏洞
Layui使用中遇到的问题
deemo_hui的博客
11-04 2302
Layui使用中遇到的问题 1、使用数据表格遇到的问题： 我这边是后台需要三个参数： 这里的 Bill是个对象，原本这里我加有 @RequestBody 注解的，如下： 但是这会需要前端传回的是JSON字符串格式，即在layui的数据表格中需要声明contentType为 application/json 如果没添加contentType为 application/json会报错： org.springframework.http.converter.HttpMessageNotReadableExc
Installation did not succeed. The application could not be installed: INSTALL_FAILED_CONFLICTING_...
qq_34453595的博客
05-09 1万+
话不多说，先上图!!! 原因:一般程序员会封装自己的一个库，然后每次开发时直接引入,这个问题就是我在项目中引入我自己封装的库时发生的。 解决方法:因为两个项目中的provider的android:authorities都一致，所以，很简单,修改其中一个项目的provider的android:authorities属性即可，这样就不会因为冲突无法安装了 有问题可以在下方评论，我看到会第一时间回复你。 徐某人不谈原理，只助你CV，完结撒花。 ...
跨域Response to preflight request doesn‘t pass access control check: It does not have HTTP ok status.
热门推荐
vevin的博客
09-23 3万+
最近后端添加自定义请求头拦截器后，前端也增加请求头后，解决过程中先后出现两种跨域错误。 一、请求后台出现如下跨域问题： has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: It does not have HTTP ok status. 此问题是前端请求后台时先发送options预检请求（浏览器机制自动发送不带传参），由于设置自定义请求头拦截器，所以当option
axios options请求 产生跨域问题 （check: It does not have HTTP ok status.）
cc_King的博客
12-10 8782
文章目录报错错误原因解决办法 报错 错误原因 看着一个 CORS 就直接以为是跨域问题，回头一看服务器的跨域是全部配了的呀，所以觉得问题应该不是在后端上； 然后一看前端，一个axios的试探请求，什么数据都么有撒，也正确的呀； 开始怀疑浏览器缓存问题，清理浏览器数据(我次奥。。我收藏的小网址。。。。)，然后直接打开无痕模式（调试前端的时候最好打开无痕模式调试）然后还不行。(烦躁) 关机重启，还是不行(鬼火搓) 然后直接百度了三个多小时，全部叫我去配置跨域。。。我tm。。。可能是我蠢，一个都没有成功。 最后
Response to preflight request doesn‘t pass access control check: It does not have HTTP ok status.
weixin_45890564的博客
07-23 3万+
这个问题整整耗了我将近一天的时间,原以为是跨域问题,前后端都对跨域做了处理但是没用,没想到调后端接口时会发送两次请求,一次是options ,options通过后再发送get或者post请求,在一开始后端只对请求做了一次拦截,导致前端发送请求时后端只能接收到options请求,并且无token存在,最终解决方法是后端对options做了处理,检测到是option请求时直接放行,然后就ok啦 ...
spdlog 日志库部分源码说明——让你可以自定义的指定自动切换日志时间
最新发布
ALex_zry的博客
04-22 482
针对 网络上spdlog日志库目前存在的使用方式固定，不能发挥这个库本身应有价值的情况，这里对一些支持场景进行说明，以供初学者省去阅读源码的时间，直接上手使用。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值