很多朋友对于什么是JS跨域访问和js跨域解决办法不太懂，今天就由小编来为大家分享，希望可以帮助到大家，下面一起来看看吧！
本文目录
上传接口存在跨域怎么解决
上传接口存在跨域解决办法如下
首先，使用JSONP技术，即通过在页面中添加一个script标签，以src属性引入另一个域名下的js文件，从而实现跨域数据传输。其次，设置响应头Access-Control-Allow-Origin，允许指定的域名对当前域名的跨域请求进行访问。还可以使用代理服务器进行跨域请求处理，即在同一域名下访问代理服务器，由代理服务器向其他域名发起请求，从而绕开跨域限制。
什么是JS跨域访问
跨域只要满足以下条件之一就是跨域：
1、协议不同，如一个http，一个https；
2、域名不同，包括主域和子域如www.a.com和ppp.a.com
3、端口不同，如w.a.com:3000和w.a.com:3001
只要出现以上情况之一就是跨域。
解决跨域的方法很多：
1、ng代理（常用）
2、node代理（前端开发时用）
3、服务端设置允许跨域访问（常用）
4、jsonp解决（现在比较少用）
5、iframe解决（比较少用）
具体没种方法自行百度，就不一一解释
如何降低浏览器安全级别，允许跨域访问
工具：IE浏览器方法如下：
1、打开IE浏览器，在工具菜单下选择Internet选项，打开Internet选项卡
2、切换到安全选项卡下，点击可信站点，然后单击站点按钮
3、可信站点窗口输入网址到可信站点的区域，点击添加按钮，网址则会添加到网站列表下，最后关闭可信站点窗口
4、还是在安全选项卡下的可信站点，点击自定义级别
5、打开站点区域窗口，找到跨域浏览窗口和框架选择启用
6、在当前窗口中继续往下翻，通过域访问数据源也选择启用，点击确定关闭受信任的站点区域窗口
7、在Internet窗口也点击确定按钮，同时关闭浏览器
8、在请求的js脚本中添加是否允许跨域访问的权限，jQuery.support.cors默认值为true，则代表允许；反之，不允许。设置完成，重新打开浏览器验证即可。
前后端分离项目，如何解决跨域问题
前后端分离项目跨域问题是不可避免的。通常情况下前端由React、Vue等框架编写，通过ajax请求服务端API，传输数据用json格式。
那么为什么有跨域的问题呢？解决跨域问题有哪些方式？搞清楚这两个问题我们需要了解一下什么是同源策略。
浏览器的同源策略同源策略（Sameoriginpolicy）是一种安全约定，是所有主流浏览器最核心也是最基本的安全功能之一。同源策略规定：不同域的客户端脚本在没有明确授权的情况下，不能请求对方的资源。同源指的是：域名、协议、端口均相同。
比如我们访问一个网站
http://www.test.com/index.html,
那么这个页面请求如下地址得情况是这样的：另外，同源策略又分如下两种情况：
DOM同源策略：禁止对不同源的页面DOM进行操作，主要防止iframe的情况。比如iframe标签里放一个支付宝付款的页面，如果没有同源策略，那么钓鱼网站除了域名不同，其他的则可以和支付宝的网站一模一样。
XMLHttpRequest同源策略：禁止使用XHR对象向不同源的服务器发起http请求。比如网站记录了银行的cookie，这个时候你访问了恶意网站，黑客拿到你的cookie，再通过ajax请求之前的银行网站，便可以轻易的拿到你的银行信息。
所以，正是因为有了同源策略，大家的网络环境才相对的安全一些。
跨域问题的解决办法了解了同源策略，就知道为什么会有跨域问题的产生了，都是为了安全。但是实际研发中，大家还是需要跨域去访问资源。典型的应用场景就是前后端分离的项目了。那么我们如何去解决跨域问题呢？
CORS-跨域资源共享CORS是一种W3C标准，定义了当产生跨域问题的时候，客户端与服务端如何通信解决跨域问题。实际上就是前后端约定好定义一些自定义的http请求头，让客户端发起请求的时候能够让服务端识别出来该请求是过还是不过。
浏览器将CORS请求分为简单请求和非简单请求：
简单请求简单请求必须满足以下两个条件：
请求方式必须是HEAD、GET、POST三种方法之一。
Http请求头必须只能是：Accept、Accept-Lanuage、Content-Lanuage、Last-Event-ID、Content-Type，其中Content-Type只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain。
非简单请求不满足简单请求条件的就是非简单请求。针对非简单请求，浏览器会发起预检请求。预检请求的意思是当浏览器检查到你的页面含有跨域请求的时候，会发送一个OPTIONS请求给对应的服务器，以检测服务器是否允许当前域名的跨域请求。如果服务端允许该域名请求，则返回204或200状态码，浏览器接收到允许请求时候再继续发送对应的GET/POST/PUT/DELETE请求。同时服务器端也会告知浏览器预检请求的缓存时长是多少，在这个时间范围内，浏览器不会再次发起预检请求。
原理基本上就是上面说的这些，实际业务中我们如何通过配置来解决跨域问题呢？基本上常见的就是三种方式：
nginx配置通常我们在nginx增加如下配置即可解决跨域问题：
用nginx这种方式是最舒服的，不需要客户端和服务端多做其他工作，对代码无入侵。
jsonp因为script标签是不受浏览器同源策略的影响，允许跨域请求资源（我们的每一个页面都引用了大量第三方js文件）。所以可以利用动态创建script标签，通过src属性发起跨域请求，这就是jsonp的原理。但是jsonp只支持GET请求，所以并不是一种好的方式。
服务端代码控制可以在服务端增加对跨域请求的支持：
这种方式相当于全局过滤器，对所有请求都过滤一遍。
以上三种方式都可以一定程度上解决跨域问题，但是nginx配置和服务端控制不能同时存在，否则会报“Access-Control-Allow-OriginNotAllowMultiplevalue”的错误。个人比较推荐nginx配置的方式，一劳永逸，不需要每个web项目都去编写跨域的代码。
大家在工作中有没有遇到过跨域问题呢？都是怎么解决的？欢迎评论区交流讨论，共同学习~
好了，文章到这里就结束啦，如果本次分享的什么是JS跨域访问和js跨域解决办法问题对您有所帮助，还望关注下本站哦！