精华内容
下载资源
问答
  • 1、为什么会产生跨域 答:因为浏览器的同源政策,就会产生跨域。比如说发送的异步请求是不同的两个源,就比如是不同的的两个端口或者不同的两个协议或者不同的域名。由于浏览器为了安全考虑,就会产生一个同源政策,...

    一、跨域

    1、为什么会产生跨域

    答:因为浏览器的同源政策,就会产生跨域。比如说发送的异步请求是不同的两个源,就比如是不同的的两个端口或者不同的两个协议或者不同的域名。由于浏览器为了安全考虑,就会产生一个同源政策,不是同一个地方出来的是不允许进行交互的。

    2、怎么解决跨域

    解决跨域的方法:第一种jsonp的方法。第二种使用CORS解决跨域问题,即跨域资源共享,在后端设置响应头部,加一句代码:access-control-allow-origin:"*"或者允许交互的域名。第三种使用vue,找到config文件下->index.js文件,修改propyTable中的target的值,就可实现用前端解决跨域。第四种,使用代理;第五种,使用postmessage

    1、jsonp方法:

    jsonp是一种借助于 script 标签发送跨域请求的技巧方案。script的src属性可以访问网络上的资源,并script标签可以拿到响应体。

    <script>
        function test(json){
            console.log('我被调用了');
            console.log(json);
       }
    </srcipt>
    <script src="http://api.douban.com/v2/movie/top250?callback=test"></script>
    

    我们可以看到,我们预先定义了一个函数叫test,再然后在src里加了一个参数callback=test,可以发现,当请求完成,会自动调用test这个函数,并且把响应体(JSON数据)当做参数传递过来.实际上是浏览器用script的src去发起请求,并且传递一个参数叫callback=函数名,服务器接收到这个函数名,在返回的响应体里面调用这个函数,并且把json当做参数传递.
    注意:(1).Jsonp不是一套新技术,只是聪明的程序员想出的一套方案
    (2)能不能用这套方案,要看服务器端代码怎么写,服务器端如果写了调用函数的代码,那么就能支持JSONP方案.

    如果是在JQuery中使用Ajax,则只需要在dataType属性中把json改为jsonp即可;
    img

    2、后端处理跨域方法:使用cors解决跨域问题,即跨域资源共享,设置响应头。
    <?php 
        $json = array("name"=>"jack","age"=>16);
        //代表告诉浏览器,我允许任意域名访问我这个接口
        //如果写一个*,代表所有域名都可以来访问我
        // header('Access-Control-Allow-Origin: *');
        //如果写的是指定域名,代表只有这个域名可以访问
        header('Access-Control-Allow-Origin: *');
        echo json_encode($json);
    ?>
    
    3、前端跨域方法:使用vue

    找到config文件下->index.js文件,修改propyTable中的target的值。

    proxyTable: {/api”: {
    target: “http://localhost:8080,
    changeOrigin: true,
    pathRewrite: {^/api’: ‘’
    }
    }
    }
    
    4、iframe嵌套通讯,postmessage

    HTML5引入了一个全新的API:跨文档通信 API(Cross-document messaging)。这个API为window对象新增了一个window.postMessage方法,允许跨窗口通信,不论这两个窗口是否同源。

    本文部分参考:https://blog.csdn.net/sinat_28296757/article/details/80771082

    展开全文
  • 说说脚本在请求Web CoreApi的时候,为什么会发生跨域问题? 跨域问题:本质是浏览器的行为,浏览器有一个同源策略,同源策略:协议、IP地址相同就认为是同源;否则就非同源;同源策略限定脚本请求只能请求同源的...

    说说脚本在请求Web CoreApi的时候,为什么会发生跨域问题?

    跨域问题:本质是浏览器的行为,浏览器有一个同源策略,同源策略:协议、IP地址相同就认为是同源;否则就非同源;同源策略限定脚本请求只能请求同源的服务器返回的内容才给正常的使用;否则就会报跨域问题;其实我们在请求Core WebApi的时候,浏览器直接访问Api没有问题,如果是脚本请求,就会出现跨域问题;

    展开全文
  • 如何解决跨域以及为什么会产生跨域

    千次阅读 多人点赞 2021-04-08 11:26:50
    出现浏览器跨域的原因 浏览器的同源策略指的就是协议,域名,端口,三者都相同,如果其中有一个不同就属于跨域 跨域可能造成的报错 ajax在不同域名下的请求无法实现 常用的解决跨域的方法 1. JSONP跨域 JSONP(JSON ...

    出现浏览器跨域的原因

    浏览器的同源策略指的就是协议,域名,端口,三者都相同,如果其中有一个不同就属于跨域

    跨域可能造成的报错

    ajax在不同域名下的请求无法实现

    在这里插入图片描述

    常用的解决跨域的方法

    1. JSONP跨域

    JSONP(JSON with Padding: 填充式JSON)
    JSONP应用的技巧:
    在HTML标签里,一些标签比如link、href、img这样的标签是没有跨域限制的。

    • jsonp如何使用
    <body>
    	<script type="text/javascript">
    		function func1(ret){
    			console.log(ret)
    		}
    	</script>
    	<script src="https://www.baidu.com/s?ie=UTF-8&wd=" type="text/javascript" charset="utf-8"></script>
    </body>
    

    2. CORS跨域

    后端修改请求头
    header(‘Access-Control-Allow-Origin:*’);允许访问的网址
    header(‘Access-Control-Allow-Method:POST,GET’);允许访问的方式

    3. nginx反向代理

    www.baidu.com/index.html需要调用www.sina.com/server.php,可以写一个接口www.baidu.com/server.php,由这个接口在后端去调用www.sina.com/server.php并拿到返回值,然后再返回给index.html

    4. postMessage

    关键点:
    postMessage是h5引入的一个新概念,现在也在进一步的推广和发展中,他进行了一系列的封装,我们可以通过window.postMessage的方式进行使用,并可以监听其发送的消息;
    兼容性:
    移动端可以放心用,但是pc端需要做降级处理
    优点:
    不需要后端介入就可以做到跨域,一个函数外加俩个参数(请求url,发送数据)就可以搞定;
    移动端兼容性好;

    5.通过window.name跨域

    window对象有个name属性,该属性有个特征:即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的,每个页面对window.name都有读写的权限,window.name是持久存在一个窗口载入过的所有页面中的,并不会因新页面的载入而进行重置。
    比如:有一个页面a.html,它里面有这样的代码:

    在这里插入图片描述

    再看看b.html页面的代码:
    在这里插入图片描述

    展开全文
  • 为什么会产生跨域问题?

    万次阅读 2018-02-27 14:35:56
    1、浏览器限制2、跨域(域名,...2,从XHR(XMLHttpRequest)出发 (1)避免发生跨域。使用jsonp,由于jsonp请求是通过script的方式发送的(只有xhr的请求方式才有可能产生跨域问题),所以不会产生跨域问题。Spr...

    1、浏览器限制

    2、跨域(域名,端口不一样都是跨域)

    3、XHR(XMLHttpRequest请求)

    同时满足三个条件才有可能产生跨域问题。

    解决跨域问题方案。

    1,从浏览器出发,允许浏览器跨域。

    2,从XHR(XMLHttpRequest)出发

        (1)避免发生跨域。使用jsonp,由于jsonp请求是通过script的方式发送的(只有xhr的请求方式才有可能产生跨域问题),所以不会产生跨域问题。Spring MVC实现过程:前台使用ajax的get请求,将dataType设为“jsonp”;服务器创建一个类并继承抽象类AbstractJsonReponseBodyAdvice,最后注解@ControllerAdivece。使用jsonp的弊端,只能使用get方式请求,服务器需要改动代码,发送的不是xhr请求。

        (2)产生跨域后解决。

                从被调用方考虑,有三种情况,分别是服务器实现,nginx配置和apache配置。

                服务器实现需要注意两种情况,简单请求和非简单请求。简单请求是先执行请求再验证,非简单请求是先验证再请求。

              简单请求(比较常见):方法为get,head,post,请求header里面没有自定义头,Content-Type的值为以下几种 text/plain,multipart/form-data,application/x-www-form-urlencoded。

                非简单请求(比较常见):put,delect方法的ajax请求,发送json格式的ajax请求,带自定义头的ajax请求。

                简单请求处理方案:在响应头中添加

                    Access-Control-Allow-Origin=“允许跨域的url”,即跨省域时,请求头Origin的值,所以一般是获取Origin的值。

                    Access-Control-Allow-Method=“*”,允许的方法。

                非简单请求处理方案:在相应头中添加

                    Access-Control-Allow-Origin=“允许跨域的url”,即跨域时,可以获取请求头Origin的值。

                    Access-Control-Allow-Method=“*”,允许的方法

                    Access-Control-Request-Headers=“Content-Type,自定义的header的key”。

                 带cookies的跨域解决:在响应头添加

                    Access-Control-Allow-Credentials,="true",允许使用cookies

                   ngnix配置:


    apache配置:没搞过

    若是使用spring框架:使用@CrossOrigin注解既可以实现服务端跨域

                        

        

    展开全文
  • 为什么会有跨域: 在前后端分离的模式下,前后端的域名是不一致的,此时就会发生跨域访问问题。在请求的过程中我们要想回去数据一般都是post/get请求,所以..跨域问题出现 跨域问题来源于JavaScript的同源策略,即...
  • 首先,先声明一下,此文章是给...跨域如何解决等等,看了网上的一些文章,发现很多都没有写的清楚明白,要么就是过于有深度理解不了,所以我今天整理了一下常用的跨域知识,今天先说一下什么是跨域,跨域为什么出现,至于解决跨
  • 为什么会有跨域: 在前后端分离的模式下,前后端的域名是不一致的,此时就会发生跨域访问问题。在请求的过程中我们要想回去数据一般都是post/get请求,所以..跨域问题出现 跨域问题来源于JavaScript的同源策略,即...
  • 我部署在自己租的服务器上的接口,为什么我在公司的电脑上还是能直接拿到数据,没有发生跨域的问题,不是说同源策略 不同域不能访问么
  • 跨域+springmvc http://blog.csdn.net/wabiaozia/article/details/52778335 ...跨域:ajax跨域,这应该是最全的解决方案了http://web.jobbole.com/93344/ 阮一峰 跨域资源共享 CORS 详解:http://...
  • ajax跨域访问和产生的原因document.domain = "css88.com";var createAjaxIframe={appIframe: function(iframeId, iframeSrc){var iframe = document.createElement("iframe");iframe.src = iframeSrc// ...
  • 之前面试官基本都是问如何解决跨域问题,今天遇到一个公司问什么是跨域为什么会产生跨域问题,虽然之前看过相关的问题,但是突然感觉有点蒙,自我感觉回答的不是很全面和准确,所以啊,看问题还真是得知其然并知其...
  • 一、跨域 ①、广义的跨域跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。 广义的跨域: 1、资源跳转:A链接、重定向、表单提交 2、资源嵌入:<link>、<script>、&...
  • 什么跨域 指的是浏览器不能执行其他网站的脚本,它是由浏览器的同源策略造成的,是浏览器对 javascript 施加的安全限制,防止他人恶意攻击网站 比如一个黑客,他利用 iframe 把真正的银行登录页面嵌到他的页面...
  • 造成跨域的原因就是浏览器的同源策略:只要满足协议、主机、端口一致,则两个页面具有相同的源。同源策略限制了从同一个源加载的文档或脚本如何来自另一个源的资源进行交互,这是一个用于隔离潜在恶意文件的重要安全...
  • 为什么会跨域这个名词的出现呢? 跨域又是什么呢?为何要跨域? 浏览器的同源策略又是什么?怎么解决? jsonp又是什么? 跨域的原理又是什么呢? 名词解释: 1、什么是跨域跨域产生来源于现代浏览器所通用...
  • 什么跨域,有哪些解决方式: 概念:跨域是由浏览器的同源策源产生的,是指页面请求的接口地址,必须与页面的url地址处于同域上(即域名、端口、协议相同)。这是为了防止某域名下面的接口,被其他域名下的网页非法...
  • 什么跨域 什么是同源策略 解决方式 1、jsonp 1.1)去创建一个 script 标签 1.2)script 的 src 属性设置接口地址 1.3)接口参数,必须要带一个自定义函数名 要不然后台无法返回数据。 1.4)通过定义函数名去...
  • 跨域是什么,为什么会跨域跨域的解决方法是什么?常用的是什么?原理是什么? 面对这一连串问题,是不是很懵? 让我们来抽丝剥茧一点一点解决它。 什么是跨域跨域是指从一个域名去请求另一个域名的资源,...
  • 什么会造成跨域

    2020-06-13 14:45:41
    什么会造成跨域,如下图:
  • 为什么浏览器要引入跨域问题? 跨域问题来源于浏览器的同源策略,为什么要有这个策略,想必你已经知道,那就是因为保证用户的信息安全。 假设现在有a.com和b.com两个域,如果没有这一安全策略,那么当用户在访问a...
  • 首先, 在开篇, 我需要声明一点,请善用搜索引擎, 百度即便是对于搜技术解决方案再垃圾, 也不可能你跨域这种基础的问题都找不到答案的, 跨域根本不算是什么大问题...为什么会跨域这个问题 因为前端代码是跑在浏览器...
  • 在EasyNVR、EasyGBS、EasyDSS这一类视频平台中,经常碰到用户问我们跨域相关的问题,在视频流的传输上,某些项目需要将视频流嵌入第三方平台或者app进行直播,这时极大可能会产生跨域相关的问题,这并不是传输上的...
  • 浏览器的跨域问题以及解决方案 浅谈CSRF攻击方式 参考了上面的大神们的文章,以下是自己的总结。 1、什么是跨域 跨域产生来源于现代浏览器所通用的‘同源策略’,所谓同源策略,是指只有在地址...2、为什么浏...
  • 跨域

    2018-12-18 20:42:11
    前端跨域的各种知识点 ...1.为什么会发生跨域这种情况呢? 我们通常都是用ajax进行网络请求的。ajax的技术核心是XMLHttpRequest对象(简称XHR对象)。(既然都提到ajax了,不如复习下吧) 1.1 XHR的用法 1.1.1 ...
  • 跨域,指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器施加的安全限制。 同源策略:所谓同源是指:协议,域名,端口均相同。即便两个不同的域名指向同一个ip地址,也非同源。 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 55,882
精华内容 22,352
关键字:

为什么会产生跨域