欢迎访问 生活随笔!

凯发k8官方网

当前位置: 凯发k8官方网 > 前端技术 > vue >内容正文

vue

corspost请求失败-凯发k8官方网

发布时间:2024/10/8 vue 0 豆豆
凯发k8官方网 收集整理的这篇文章主要介绍了 corspost请求失败_vue项目cors跨域请求500错误,post请求变options请求 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

vue项目cors跨域请求500,post请求变options请求,到底是什么情况。

提示:以下内容是一个非专业开发的我对跨域的理解,并不10分准确。

一、先介绍为什么明明发送的是post请求,为什么到服务器端就收到了options请求,到底是谁在中间搞鬼。

要说明这个问题,要先搞明白什么是跨域。

跨域,就是不同源的网站之间想要传输内容,要解决的问题,全称叫”跨域资源共享“,也称cors,不同源是指:协议(http,https)、端口、主域不同的站。举例说明下:

1、https://www.linyufan.com/html/和https://www.linyufan.com/ex/index/就是同源。

2、http://www.linyufan.com和https://www.linyufan.com不同源,协议不同,端口也不同,http是80,https是443端口。

3、https://www.zacseo.cn和https://www.linyufan.com不同源,主域不一样,即域名不一样。

同源还是不同源,差不多就是这个意思,只要是不同源,就需要解决”跨域“问题。

二、跨域请求

既然是跨域请求了,就分两类:1、简单请求,2、非简单请求,只要满足下面的几类,就是简单请求,否则就不是简单请求了。

(1) 请求方法是以下三种方法之一:head、get、post

(2)http的头信息不超出以下几种字段:accept、accept-language、content-language、last-event-id

content-type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

三、跨域流程

1、简单请求

浏览器小伙发出跨域请求,方式(method)可能是post,也可能是get,再带上headers信息,问题服务器想要一个资源,服务器一看,哦?小伙子不错,知道行内规矩。

这么着吧,你等下,给浏览器小伙发一条响应头,包含我服务器可以接受哪些请求,以什么方式等等。

然后告诉浏览器小伙,说我看看你请求的资源(包含不限于图片、css、js等静态资源,动态的另说),服务器开上自己的apache或者nginx小跑车,一路小跑,从这个文件夹跑到那个文件夹,收集够了浏览器小伙请求的资源后,挨个将这些资源发给浏览器小伙,浏览器小伙完成前端页面渲染和加载。

当然这个过程是极其快速及复杂的,还有cookies、session,keep-live等,都需要商量,或者设置好。

总结跨域简单请求就是,一切符合服务器请求规范的,都会立马提供服务。

2、非简单请求

除了上面说的简单请求,另一个类型就是非简单请求,只要请求方式不是上面说的几种,content-type也不是上面说的几类,比如像自己加了headers这些,都会触发浏览器进行非简单请求。也就是会出现options请求。

options请求,也叫预检请求,下面简单说说流程。

你在浏览器输入了一个网址,浏览器一看,里面有一些非简单请求的信息,于是乎本着谨慎的态度向服务器先发了一条options的请求,试探性的问问服务器大哥这个请求可行不?

同时携带【'access-control-request-headers',access-control-request-method】等请求信息,告诉服务器想这么来。

服务器老哥一看,哟,小伙子牛啊,自定义了headers里的信息,牛归牛,还是得按规矩来。检查了一下自己的笔记本,老板(我)允许这么请求,这个时候我们就看到了options的响应头信息,里面有可以请求的类型,方式以及域等信息。

接下来浏览器小伙一看,知道了,就按你说的来,于是发送第二波请求,这个时候才是我们要想发送的请求,可能是post或者get等。

知道问题出在哪里,就有对应的解决办法了。

四、cors跨域post请求变options解决办法

1、将非简单请求改为简单请求,但这个办法好像不是太可行,毕竟我们自己加了headers,就要发挥作用。

2、将后端请求到的options忽略,或者做些别的用处。

3、牛b的解决办法(我不是很清楚,肯定有)。

以上是我看一些对于cors介绍的文档,根据自己的理解写的,年纪大了,也静不下心来研究其所以然了,已经错过了埋头深干的劲了,只想着赶紧解决问题,其实还是有很多问题,不是很明白。

比如,为什么浏览器要先发一次options请求?为什么在跨域的情况下,不同的浏览器返回的信息提示不一样?

本文由 林羽凡 创作

本站文章除注明转载/出处外,均为本站原创或翻译,转载前请务必署名

最后编辑时间为:

总结

以上是凯发k8官方网为你收集整理的corspost请求失败_vue项目cors跨域请求500错误,post请求变options请求的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得凯发k8官方网网站内容还不错,欢迎将凯发k8官方网推荐给好友。

  • 上一篇:
  • 下一篇:
网站地图