什么是JS跨域访问如何实现跨域访问

逃离我推掉我的手 2024-04-01 14:30 80阅读 0赞

**>什么是跨域？**

A网站想要获取B网站服务器上的资源，网站通过[AJAX][]发送请求的时候，本地服务器地址与请求地址、协议类型（http）、IP地址（域名）、端口，三者有其一不同都称之为跨域请求资源。

**>为什么要有跨域限制？**

通过上面的解释不难发现，跨域限制主要是出于对用户安全的考虑。

因为每一次的HTTP请求，都会附带该请求地址对应的cookie信息，那么就可以做以下攻击：

1、用户登录某银行网站A，该网站在用户电脑上设置cookie信息。

2、用户打开恶意网站B，该网站也向网站A发送AJAX请求，该请求会验证网站A对应的cookie信息，因为已经登录过一次。

3、银行验证到用户cookie无误，response响应用户数据，此时用户数据就泄露给网站B的服务器了。

有了跨域限制，上面的情况就可以得到控制，上网也就更加安全。

**>如何实现跨域？**

一般有下面两种最常用的方式。

**CORS**

cors是一个W3C制定的跨域标准，全称是：Cross-origin resource sharing，这句话的含义就是跨域资源共享，这种方式主要应用在服务端。

他是通过设置服务端设置一个HTTP头：setHeader("Access-Control-Allow-Origin", "\*")

如果Access-Control-Allow-Origin中有A，或者是通配符\*，浏览器就会允许A跨域，通配符代表任何地址都能跨域。

客户端不需要作任何设置，还是按照AJAX请求一样，这样就能获取跨域资源。

**JSONP**

jsonp是通过script标签的src属性，我们都知道src属性能获取同一个ip服务器上，不同文件夹的文件，它其实就是一个HTTP请求，而且它支持跨域，不需要服务端设置直接就能跨域获取资源。

实际操作：

1、先定义一个函数，通过参数来接收数据，后端用参数来设置回调。

<script type="text/javascript">

function toData(data)\{

console.log(data);

\}

</script>

2、然后利用script标签发送一个请求，需要把回调函数的名字传到后端。

<script src="http://127.0.0.1:8080/user?callback=toData&name=Bill"></script>

3、服务器通过该接口，拿到回调函数的名字，把它拼接成一个回调函数，再通过字符串的方式传到前端。

if(url=="/user")\{

response.end(\`$\{GET.callback\}($\{json\})\`);

\}

明白到上面的原理，你就知道为什么jsonp不能发送post请求了~，这也是跨域请求最常用的方式。

**服务端代理**

直接通过服务端发送HTTP请求，服务端没有跨域限制，因为跨域不同源限制只是针对浏览器，服务端请求到数据后再发送到客户端。

来源：[微点阅读][Link 1] [https://www.weidianyuedu.com][Link 1]

[AJAX]: https://so.csdn.net/so/search?q=AJAX&spm=1001.2101.3001.7020
[Link 1]: https://www.weidianyuedu.com

发表评论取消回复

表情：

评论列表（有 0 条评论，80人围观）

还没有评论，来说两句吧...

相关阅读

相关什么是JS跨域访问如何实现跨域访问

>什么是跨域？ A网站想要获取B网站服务器上的资源，网站通过[AJAX][]发送请求的时候，本地服务器地址与请求地址、协议类型（http）、IP地址（域名）、端口，三者有其一

逃离我推掉我的手/ 2024年04月01日 14:30/ 0 赞/ 81 阅读

相关 SpringBoot - 什么是跨域？如何解决跨域？

什么是跨域？在浏览器上当前访问的网站，向另一个网站发送请求，用于获取数据的过程就是跨域请求。跨域，是浏览器的同源策略决定的，是一个重要的浏览器安全策略，用于限制一

分手后的思念是犯贱/ 2023年10月08日 15:47/ 0 赞/ 53 阅读

相关什么是浏览器跨域访问，js如何实现？

一、跨域访问定义：跨域是指不同域名之间相互访问。 1、什么是跨域跨域的产生来源于现代浏览器所通用的‘同源策略’，所谓同源策略，是指只有在地址的： 1. 协

╰半橙微兮°/ 2023年10月05日 13:19/ 0 赞/ 29 阅读

相关 js 设置header，实现跨域访问

[js 设置header，实现跨域访问 ][js _header_] 标签： [ js跨越自定义header][js_header] 2016-04-21 09:49

叁歲伎倆/ 2022年07月14日 22:40/ 0 赞/ 764 阅读

相关跨域与跨域访问

转自：http://blog.csdn.net/notechsolution/article/details/50394391 什么是跨域跨域是指从一个域名的网页

淡淡的烟草味﹌/ 2022年06月14日 09:26/ 0 赞/ 396 阅读

相关其他：js实现跨域访问

转自：[点自这里][Link 1] javascript跨域访问是web开发者经常遇到的问题，什么是跨域，一个域上加载的脚本获取或操作另一个域上的文档属性，下面将列出三种实

电玩女神/ 2022年05月21日 13:45/ 0 赞/ 219 阅读

相关跨域访问

首先跨域是什么,顾名思义,就是浏览器的js从一个网站到另一个网站的访问(大概意思). 那么跨域问题就是指浏览器阻止了这样的一个跨域的访问(包括对后端数据的任何操作),这里浏

古城微笑少年丶/ 2022年04月22日 00:10/ 0 赞/ 351 阅读

相关什么是跨域？跨域如何解决

什么是跨域？ A页面访问B页面的资源，如果A，B页面的域名、端口、协议、IP其中一个不同，这种行为都叫跨域；它是由于浏览器的同源策略形成的，也是对javascript的安

朴灿烈づ我的快乐病毒、/ 2022年02月01日 05:36/ 0 赞/ 373 阅读

相关什么是跨域，如何解决跨域问题？

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。同源：域名，协议，端口均相同不同源：协议不同（ht

短命女/ 2022年01月30日 05:27/ 0 赞/ 423 阅读

相关 ajax实现跨域访问

ajax跨域访问是一个老生畅谈的问题啦，网上解决方法很多，discuz用的p3p协议，有兴趣的朋友可以了解下，比较常用的是JSONP方法，貌似目前这种方法只支持GET方式，不如

古城微笑少年丶/ 2021年12月16日 11:11/ 0 赞/ 378 阅读