JavaScript 跨域问题

js 跨域
JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象。
 
什么是跨域呢?
 
简单的理解就是因为Javascript同源策略的限制,a.com域名下的js无法操作b.com或者c.a.com域名下的对象。
如:www.aseoe.com/index.html 调用www.aseoe.com/service.php (非跨域)
www.aseoe.com/index.html 调用www.ancto.net/service.php (跨域)
www.aseoe.com/index.html 调用bbs.aseoe.com/service.php (跨域)
www.aseoe.com/index.html 调用www.aseoe.com:81/service.php (跨域)
www.aseoe.com/index.html 调用https://www.aseoe.com/service.php (跨域)

处理跨域方法一 — 代理

通过在同名的web服务器创建一个代理:
aseoe服务器(域名:www.aseoe.com)
ancto服务器(域名:www.ancto.net)
比如在aseoe的web服务器的后台
(www.aseoe.com/proxy-anctoservice.php)来调用ancto服务器
(www.ancto.net/service.php)的服务,然后再把响应结果返回给前端,
这样前端调用aseoe同域名的服务就和ancto的服务效果相同了
 
处理跨域方法二 — JSONP
 
JSONP可用于解决主流浏览器的跨域数据访问的问题。
在www.aseoe.com页面中:
<script>
function jsonp(json) {
alert(json["name"]);
}
</script>
<script src="http://www.ancto.net/jsonp.js"></script>
在www.ancto.net页面中:
jsonp({'name':Aseoe,'job':'前端'});

 
JSONP不支持POST请求
 
处理跨域方法三 — XHR2
 
HTML5提供的XMLHttpRequest Level2 已经实现了跨域访问以及其他的一些新功能
IE10以下的版本都不支持
在服务器做一些小小的改造即可:
header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:POST,GET');
 

时间: 2024-09-20 16:49:46

JavaScript 跨域问题的相关文章

JavaScript跨域请求RESTful Web Service

当我们用js请求RESTful Web Service的时候,通常会出现跨域无法访问的问题,也就是无法正常得到我们要的值.jsonp是个解决问题的方法.但是,我们希望访问RESTful Web Service就像一般的ajax方法一样,不用每个都去搞一个jsonp和callback.这就需要我们在服务端进行一些设置,下面我用一个简单的 Filter来进行说明,其他比较复杂的情况根据自己的需求进行改动. import java.io.IOException; import javax.servle

ASP.NET开发web应用过程中遇到的javascript跨域请求问题

解决方案 不提倡跨域的post请求. 0.jquery中ajax的跨域方案jsonp .ashx代码 using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace KB.DSN.Web.API.Tokens { /// <summary> /// Summary description for Get /// </summary> public class

JavaScript跨域调用基于JSON的RESTful API_javascript技巧

1. 基本术语 AJAX(Asynchronous JavaScript And XML,异步JavaScript和XML):AJAX是一种用于创建快速动态网页的技术,通过在后台与服务器进行少量数据交换,AJAX可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. JSON(JavaScript Object Notation):JSON是一种轻量级的数据交换格式,可以看成是由大括号包裹起来的多个"key/value"对,格式如下:{"f

javascript跨域方法、原理以及出现问题解决方法(详解)_javascript技巧

javascript跨域访问是web开发者经常遇到的问题,什么是跨域,一个域上加载的脚本获取或操作另一个域上的文档属性,下面将列出三种实现javascript跨域方法: 1.基于iframe实现跨域      基于iframe实现的跨域要求两个域具有aa.xx.com,bb.xx.com这种特点,也就是两个页面必须属于一个基础域(例如都是xxx.com,或是xxx.com.cn),使用同一协议(例如都是 http)和同一端口(例如都是80),这样在两个页面中同时添加document.domain

javascript跨域原因以及解决方案分享_javascript技巧

产生跨域问题的原因 跨域问题是浏览器同源策略限制,当前域名的js只能读取同域下的窗口属性. 跨域问题产生的场景 当要在在页面中使用js获取其他网站的数据时,就会产生跨域问题,比如在网站中使用ajax请求其他网站的天气.快递或者其他数据接口时以及hybrid app中请求数据,浏览器就会提示以下错误.这种场景下就要解决js的跨域问题. XMLHttpRequest cannot load http://你请求的域名. No 'Access-Control-Allow-Origin' header

常见的javascript跨域通信方法_javascript技巧

本文主要介绍几种常见的javascript跨域通信方法.首先讲解一下JSONP.1.JSONP JSONP(JSON with Padding)是JSON的一种"使用模式",可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的<script> 元素是一个例外.利用 <script> 元素的这个开放策略,网页可以得到从其他

javascript跨域的方法汇总_javascript技巧

此文章学习借鉴了一些其他前端同学的文章,自己做了个实践总结 以下的例子包含的文件均为为 http://www.a.com/a.html .http://www.a.com/c.html 与 http://www.b.com/b.html,要做的都是从a.html获取b.html里的数据 1.JSONP jsonp是利用script标签没有跨域限制的特性,通过在src的url的参数上附加回调函数名字,然后服务器接收回调函数名字并返回一个包含数据的回调函数 function doSomething(

深入分析Javascript跨域问题_javascript技巧

跨域是什么? 假设a.com/get.html需要获取b.com/data.html中的数据,而这里a.com和b.com并不是同一台服务器,这就是跨域跨域会涉及到Javascript的同源策略,简单来说就是为了保护网站的安全,不被外域(非同源)服务器的js修改本网站内容. 引用一个表格,看一下引起跨因的条件有哪些: 但是有时候我们确实需要这么做,那么我们有哪些方法呢? 1.JsonP 提到跨域不能不先提及jsonp.jsonp其实是JavacScript Object Notation wit

javascript跨域请求包装函数与用法示例_javascript技巧

本文实例讲述了javascript跨域请求包装函数与用法.分享给大家供大家参考,具体如下: 一.源码 // 定义AJAX跨域请求的JSON (function(){ if(typeof window.$JSON== 'undefined'){ window.$JSON= {}; }; $JSON._ajax = function(config){ config = config[0] || {}; this.url = config.url || ''; this.type = config.t

Javascript跨域

这几天整理了Javascript跨域的东西,终于比较完整了 附上CORS代码: 1 function createCORSRequest(method, url) { 2 var xhr = new XMLHttpRequest(); 3 if ("withCredentials" in xhr) { 4 xhr.open(method, url, true); 5 } else if (typeof XDomainRequest!= "undefined") {