ajax跨域相关
ajax 技术使用xmlhttprequest组件附送请求时,发送请求的url和本网页的url地址必须在同一个域名下
如果需要跨域,可以使用iframe或者<javascript src="url"></script>的方式
http://www.cnblogs.com/Spring/archive/2008/10/21/1315882.html
http://exceptioneye.iteye.com/blog/1405495
新的W3C策略实现了HTTP跨域访问,还亏我找了很久的资料解决这个问题:
只需要在servlet中返回的头部信息中添加Access-Control-Allow-Origin这个既可。
比如我要开放所有我本地的跨域访问,就设置如下:response.setHeader("Access-Control-Allow-Origin", "http://127.0.0.1/*");
这样我本地的A工程中的AJAX请求就可以跨域请求B工程中的servlet。
1: var scriptBlock = document.createElement("script");
2:
3: function StartGet()
4: {
5: scriptBlock.src = "";
6: scriptBlock.src = "http://Domain2/GetData.aspx";
7: scriptBlock.type = "text/javascript";
8: scriptBlock.language = "javascript";
9: document.getElementsByTagName("head")[0].appendChild(scriptBlock);
10: scriptBlock.onreadystatechange = ReturnData;
11: }
12:
13: function ReturnData()
14: {
15: //alert(scriptBlock.readyState);
16:
17: //uninitialized Object is not initialized with data.
18: //loading Object is loading its data.
19: //loaded Object has finished loading its data.
20: //interactive User can interact with the object even though it is not fully loaded.
21: //complete Object is completely initialized.
22:
23: if("loaded" == scriptBlock.readyState)
24: {
25: var div = document.getElementById("htmldiv");
26: div.innerHTML = a.project[0].name; //a是返回的json里面的变量
27: }
28: }
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
<script src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
$.ajax({
type: "GET",
async: false,
//url: "http://test/jsonp.php",
url:"http://local.ok.com/1.php",
dataType: "jsonp",
jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:"bbb",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
success: function(json){
alert('您查询到航班信息:票价: ' + json.price + ' 元,余票: ' + json.tickets + ' 张。回调函数名为: '+json.func);
},
error: function(){
alert("fail");
}
});
});
</script>
</body>
</html>
跨域问题存在实际上源于浏览器的同源策略(same origin policy),简单讲,同源就是要求域名,协议,端口三者都一致;
- //使用jsonp实现跨全域
- RequestAjax_JSONP = function() {
- var obj = $("#crossSitePage");
- $.getJSON("http://coolkiss.com/CrossSite.jsp?callback=?&t=" + Math.random(), function(data) {
- //alert(data);
- $("#ResponseData").html(data.content);
- });
- }
1、一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面、动态网页、web服务、WCF,只要是跨域请求,一律不准;
2、不过我们又发现,Web页面上调用js文件时则不受是否跨域的影响(不仅如此,我们还发现凡是拥有"src"这个属性的标签都拥有跨域的能力,比如<script>、<img>、<iframe>);
3、于是可以判断,当前阶段如果想通过纯web端(ActiveX控件、服务端代理、属于未来的HTML5之Websocket等方式不算)跨域访问数据就只有一种可能,那就是在远程服务器上设法把数据装进js格式的文件里,供客户端调用和进一步处理;
4、恰巧我们已经知道有一种叫做JSON的纯字符数据格式可以简洁的描述复杂数据,更妙的是JSON还被js原生支持,所以在客户端几乎可以随心所欲的处理这种格式的数据;
5、这样子解决方案就呼之欲出了,web客户端通过与调用脚本一模一样的方式,来调用跨域服务器上动态生成的js格式文件(一般以JSON为后缀),显而易见,服务器之所以要动态生成JSON文件,目的就在于把客户端需要的数据装入进去。
6、客户端在对JSON文件调用成功之后,也就获得了自己所需的数据,剩下的就是按照自己需求进行处理和展现了,这种获取远程数据的方式看起来非常像AJAX,但其实并不一样。
7、为了便于客户端使用数据,逐渐形成了一种非正式传输协议,人们把它称作JSONP,该协议的一个要点就是允许用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。
如果对于callback参数如何使用还有些模糊的话,我们后面会有具体的实例来讲解。
上面都是网络上收集的
简单点说,解决ajax跨域
1、response.setHeader("Access-Control-Allow-Origin", http://127.0.0.1/*);
2、设置domain
3、jsonp(jsonp就是js动态创建iframe后者script标签请求服务器,服务器返回的是一个js的可执行回调方法。)
4、通过带有src属性字样的标签处理,比如,<script><img><iframe>
ajax跨域相关的更多相关文章
- AJAX跨域调用相关知识-CORS和JSONP(引)
AJAX跨域调用相关知识-CORS和JSONP 1.什么是跨域 跨域问题产生的原因,是由于浏览器的安全机制,JS只能访问与所在页面同一个域(相同协议.域名.端口)的内容. 但是我们项目开发过程中,经常 ...
- Laravel中的ajax跨域请求
最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...
- Ajax操作如何实现跨域请求 (JSONP和CORS实现Ajax跨域的原理)
由于浏览器存在同源策略机制,同源策略阻止ajax (XMLHttpRequest) 从一个源加载的文档或脚本获取或设置另一个源加载的文档的属性. 特别的:由于同源策略是浏览器的限制,所以请求的发送和响 ...
- 百度的一个Ajax跨域方法 JavaScript是没有域的限制
baidu的通行证处理都是在二级域名passport.baidu.com中处理的,但是baidu很多地方登录都好像是用ajax处理的,他是怎么做的呢?研究了一下,发现一个小技巧. 在http://zh ...
- 有关Ajax跨域请求的解决方案
前言 最近博主在赶项目进度.所以微信二次开发那边的博文一直没有更新.后续时间会慢慢记录这个学习历程的.来年公司要开发微信小程序.到时也会记录一下历程. 闲话少说,今天在工作中遇到了SpringMVC接 ...
- Ajax 跨域,这应该是最全的解决方案了
https://segmentfault.com/a/1190000012469713 前言 从刚接触前端开发起,跨域这个词就一直以很高的频率在身边重复出现,一直到现在,已经调试过N个跨域相关的问题了 ...
- AJAX跨域完全讲解
AJAX跨域完全讲解 今天在慕课网上学习了AJAX跨域完全讲解:https://www.imooc.com/learn/947 我在收集AJAX面试题的时候其实就已经有过AJAX跨域的问题的了,当时候 ...
- 细说Ajax跨域
一.什么是跨域 跨域问题来自于浏览器同源策略的限制,包括DOM同源限制和Ajax同源限制,本文探讨的是Ajax跨域.Ajax跨域指的是一个页面的Ajax只能请求和当前页面同源的数据,如果发现请求到的数 ...
- ajax跨域,这应该是最全的解决方案了
前言 从刚接触前端开发起,跨域这个词就一直以很高的频率在身边重复出现,一直到现在,已经调试过N个跨域相关的问题了,16年时也整理过一篇相关文章,但是感觉还是差了点什么,于是现在重新梳理了一下. 个人见 ...
随机推荐
- as的Enter_Frame与Timer
As3中的Timer和Event.EnterFrame是有明显的区别的. Evnet.EnterFrame是定时间隔多少时间出发.如果执行时间比间隔时间长,则会间隔执行时间这么久. 举个例子: Fla ...
- html+asp.net上传文件
type="file" 的name以及id一定要写,并且名字相同 http://niunan.iteye.com/blog/479605 <form id="for ...
- HTTP Content-Type的作用
在用java的 AsyncHttpClient与服务器通信时,忘记设置了 Content-Type的值,开始以为没有问题,使用默认的值就行 后面出现了问题.查资料发现,Content-Type是用在M ...
- 将自定义的 service provider 绑定到 IOC 容器
首先要有一些类,可以自己自定义一些类放在app/目录下的自己新建的文件夹,在类里面实现代码逻辑 然后通过命令生成serviceprovider (php artisan make:provider ...
- js中style.display=""无效的解决方法
本文实例讲述了js中style.display=""无效的解决方法.分享给大家供大家参考.具体解决方法如下: 一.问题描述: 在js中我们有时想动态的控制一个div显示或隐藏或更多 ...
- ubuntu12.04 安装配置jdk1.7
第一步:下载jdk-7-linux-i586.tar.gz wget -c http://download.oracle.com/otn-pub/java/jdk/7/jdk-7-linux-i586 ...
- HTML5自学笔记[ 9 ]HTML5实现元素的拖放
要想在html5中实现元素的拖放,被拖放元素就必须设置属性draggable="true";被拖放元素被放置的地方是另外一个元素,该元素是目标元素:这两个元素在拖放过程中都会触发不 ...
- 为什么要使用SLF4J而不是Log4J
每一个Java程序员都知道日志对于任何一个Java应用程序,尤其是服务端程序是至关重要的,而很多程序员也已经熟悉各种不同的日志库如java.util.logging.Apache log4j.lo ...
- memset,memcpy,memcmp用法
void* memset(void *s, int ch, size_t n); 将s所指向的某一块内存中的前n个字节的内容全部设置为ch指定的ASCII值. 例如:memset(lpMyStruct ...
- Objective-C:Foundation框架-常用类-NSMutableString
NSString是不可变的,不能删除字符或修改字符,它有一个子类NSMutableString,为可变字符串. NSMutableString的两种创建方法: - (id) initWithCapac ...