当前位置:首页  精选百科

精选百科

axios跨域请求(跨域请求)

2023-12-26 09:00:04
导读 大家好,小活来为大家解答以上问题。axios跨域请求,跨域请求很多人还不知道,现在让我们一起来看看吧!1、跨域:浏览器对于javascript的同...

大家好,小活来为大家解答以上问题。axios跨域请求,跨域请求很多人还不知道,现在让我们一起来看看吧!

1、跨域:浏览器对于javascript的同源策略的限制,例如a.cn下面的js不能调用b.cn中的js,对象或数据(因为a.cn和b.cn是不同域),所以跨域就出现了.

2、上面提到的,同域的概念又是什么呢??? 简单的解释就是相同域名,端何扯口相同,协议相同

3、同源策略:请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同.

4、比如:我在本地上的域名是study.cn,请求另外一个域名一段数据。

5、方法一:基于script标签实现跨域。

6、举个例子:我在http://study.cn/json/jsonp/jsonp_2.html下请求一个远程的js文件。

7、远程的message.js文件是

8、这个时候我们得到的相应头是:

9、这样就实现跨域成功了,因为服务端返回数据时会将这个callback参数(message)作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。

10、方法二:基于script标签实现跨域。

11、让远程js知道它应该调用的本地函数叫什爱攀颂么名字,只要服务端提供的js脚本是动态生成的就好了,这样前台只需要传一个callback参数过去告诉服务端,我需要XXX代码,于是服务端就会得到相应了.

12、例如 在http://study.cn/json/jsonp/jsonp_3.html页面请求http://192.168.31.137/train/test/jsonpthree

13、得到的响应头是:

14、方法三:基于jquery跨域。

15、那么如何用jquery来实现我们的跨域呢???jquery已经把跨域封装到ajax上了,而且封装得非常的好,使用起来也特别方便

16、如果是一般的ajax请求:

17、那么在浏览器中会报错:

18、jsonp形式的ajax请求:并且通过get请求的方式蹲诸传入参数,注意:跨域请求是只能是get请求不能使用post请求

19、jsonp 传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)jsonpCallback 自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名

20、看看请求头和相应头吧

21、请求头:jquery会自动带入callback参数,当服务端获取到这个参数后,返回回来.(响应头)

22、以上就是跨域请求的方法。

本文到此结束,希望对大家有所帮助。

免责声明:本文由用户上传,如有侵权请联系删除!