处理跨域的方式

  JavaScript出于安全方面的考虑,不予许跨域调用其他页面的对象,即“JavaScript同源策略的限制”。

一、代理

  在同域名的web服务器端创建一个代理。

  什么是代理?举例:

    a服务器(域名:www.a.com)(非跨域)

    b服务器(域名:www.b.com)(跨域)

  调用跨域的服务 www.b.com/service.php 时,在a服务器上创建一个服务 www.a.com/proxy-bservice.php,由这个服务从后端去访问 www.b.com/service.php 服务,将响应值获取过来,返回给前端。

  在这里,www.a.com 做了一个代理,前端只需要访问 www.a.com/proxy-bservice.php 就相当于访问 www.b.com/service.php

  服务代理属于后端技术,具体实现就厚脸皮的交给后台的大大们了。

二、JSONP

  JSONP一般用于解决主流浏览器的跨域数据访问问题。原理:

  在 www.a.com 页面中:

  <code>

  <script>

    function jsonp (json) {

      console.log(json[‘name‘]);

    }

  </script>

  <script src="http://www.b.com/jsonp.js"></script>

  </code>

  在 www.b.com 页面中:

  <code>jsonp({‘name‘: ‘666‘, ‘age‘: ‘23‘});</code>

时间: 2024-10-09 23:29:41

处理跨域的方式的相关文章

前端跨域的方式

.前端跨域的方式 前端跨域的方案: 1.通过jsonp跨域 2.document.domain+iframe跨域 3.location.hash+iframe 4.window.name+iframe跨域 5.postMessage跨域 6.跨域资源共享(CORS) 7.nginx代理跨域 8.nodejs中间件代理跨域 9.WebSocket协议跨域 详细过程链接:https://segmentfault.com/a/1190000011145364?utm_source=tag-newest

js跨域请求方式 ---- JSONP原理解析

这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下 跨域请求数据解决方案主要有如下解决方法: 1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 Html5的XDomainRequest Flash request 分开说明: 一.JSONP: 直观的理解: 就是在客户端动态注册一个函数 function a(data),然后将函数名传到服务器,服务器返回一个a({/*json*/})到客户端运行,这样就调用客户端的 function a(data),从而

JS跨域解决方式 window.name

window.name 传输技术,原本是 Thomas Frank 用于解决 cookie 的一些劣势(每个域名 4 x 20 Kb 的限制.数据只能是字符串.设置和获取 cookie 语法的复杂等等)而发明的(详细见原文:<Session variables without cookies>),后来Kris Zyp 在此方法的基础上强化了 window.name 传输 ,并引入到了 Dojo(dojox.io.windowName),用来解决跨域数据传输问题. window.name 的美妙

跨域问题解决方式(HttpClient安全跨域 &amp;amp; jsonp跨域)

1 错误场景 今天要把项目部署到外网的时候,出现了这种问题, 我把两个项目放到自己本机的tomcat下, 进行代码调试, 执行 都没有问题的, 一旦把我须要调用接口的项目B放到其它的server上, 就会报错, 无法通过Ajax调用springMVC的接口, 这是什么原因呢? 当我使用json ajax post请求传递数据的时候在web端出错:XMLHttpRequest cannot loadhttp://ip:8082/security/auth/outside.do. Origin ht

关于跨域处理方式

什么是跨域: 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被当作是不同的域. 一.通过jsonp跨域 首先在客户端注册一个callback (如:'jsoncallback'), 然后把callback的名字(如:jsonp1236827957501)传给服务器.注意:服务端得到callback的数值后,要用jsonp1236827957501

跨域解决方式

1. 跨域 废话不多说,就是为了解决同源策略的苛刻,直接说解决方式jsop和cors两种方式 jsop是大家用的比较多也是最常见的一种,简单说下原理: 利用script标签的方式向不同的域下发送请求.首先动态的创建script标签,其src属性是没有跨域限制的,将请求的路径赋给src,type="text/javascript",这样就会一段执行之后就会将结果返回一段js代码,那么就在客户端注册一个callback方法(如:jsonCallback).那么服务器端在返回这段内容的时候就

修改浏览器属性配置的作用---开发机上解决跨域的方式

开发阶段解决跨域问题,可以通过修改浏览器属性配置,来关闭浏览器的同源策略保护机制,从而实现解决跨域问题,有下面三种方式:1. MAC系统,终端输入代码段 "open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/admin/MyChromeDevUserData/" 2.window系统,cmd输入代码段 "C:\Program Files (

实现AJAX跨域访问方式一

1.添加pom依赖 <dependency> <groupId>com.thetransactioncompany</groupId> <artifactId>cors-filter</artifactId> <version>2.6<ersion> <!--<scope>runtime</scope>--> </dependency> 2.在web.xml 中增加配置 &l

WebApi 中开启跨域请求方式

1.配置web.config文件 <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> <add name="Access-Control-Allow-Headers" value="*" /> <add name="Access-Control-Al