- 浏览: 1061282 次
- 性别:
- 来自: 南京
文章分类
- 全部博客 (501)
- dwr (6)
- javascript (84)
- oracle (66)
- jsp/servlet (18)
- ant (3)
- 基础知识 (12)
- EXT (10)
- My SQL (10)
- java (71)
- spring (37)
- 学习的对象 (2)
- Linux (24)
- 面试 (1)
- HTML/CSS (11)
- tomcat (11)
- 收藏夹 (2)
- Power Designer (2)
- struts.xml配置文件 (1)
- sturts2 (3)
- myeclipse (8)
- eclipse (7)
- Maven (34)
- SVN (3)
- SAP JCO (2)
- JBOSS (11)
- webservice (8)
- word (1)
- 敏捷开发 (1)
- sybase (4)
- Nexus (3)
- EhCache (3)
- log4j (3)
- Cookie (4)
- Session (4)
- CXF (7)
- AXIS (2)
- SSO (1)
- LDAP (1)
- velocity (2)
- Jquery (5)
- redis (2)
- http (4)
- dojo (1)
- Linux资源监控软件mnon的安装与运用 (1)
- notepad++ (1)
- EA (1)
- UML (1)
- JasperReports (1)
- 权限 (0)
- freemarker (4)
- Spring MVC (1)
- JMS (1)
- activeMQ (1)
- hession (3)
- 安全 (1)
- ibatis (2)
- log (1)
- nginx (1)
最新评论
-
winhbb:
我刚好遇到了一个问题(在可以依赖注入的场合有效):有两个模块A ...
解决Maven项目相互依赖/循环依赖/双向依赖的问题 -
nanjiwubing123:
long3ok 写道你好 XmlOutputFormatter ...
用XStream转换复杂XML -
zhoujianboy:
另外一个方法实现eclipse tomcat 热部署:http ...
eclipse下实现maven项目在tomcat容器热部署方法 -
long3ok:
你好 XmlOutputFormatter 请问这个类是在什么 ...
用XStream转换复杂XML -
ganbo:
总结的好,文章给力。
解决Maven项目相互依赖/循环依赖/双向依赖的问题
1.什么是跨域
我们经常会在页面上使用ajax请求访问其他服务器的数据,此时,客户端会出现跨域问题.
跨域问题是由于javascript语言安全限制中的同源策略造成的.
简单来说,同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名、协议和端口号的组合.
例如:
2.实现原理
在HTML DOM中,Script标签是可以跨域访问服务器上的数据的.因此,可以指定script的src属性为跨域的url,从而实现跨域访问.
例如:
这种访问方式是不行的.但是如下方式,却是可以的.
这里对返回的数据有个要求,即:服务器返回的数据不能是单纯的如{"Name":"zhangsan"}
如果返回的是这个json字符串,我们是没有办法引用这个字符串的.所以,要求返回的值,务必是var json={"Name":"zhangsan"},或json({"Name":"zhangsan"})
为了使程序不报错,我们务必还要建立个json函数.
3.解决方案
方案一
服务器端:
客户端:
方案二,通过jquery来完成
通过jquery的jsonp的方式.使用此方式,对服务器端有要求.
服务器端如下:
客户端:
实际上,在我们执行这段js时,js向服务器发出了这样一个请求:
而服务器也相应的返回了如下对象:
jsonp1354506338864({"name":"zhangsan","date":"2012-12-03"})此时就实现了跨域范文数据的要求.
解决js跨域问题 .
http://blog.csdn.net/macky0668/article/details/6247803
我们经常会在页面上使用ajax请求访问其他服务器的数据,此时,客户端会出现跨域问题.
跨域问题是由于javascript语言安全限制中的同源策略造成的.
简单来说,同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名、协议和端口号的组合.
例如:
2.实现原理
在HTML DOM中,Script标签是可以跨域访问服务器上的数据的.因此,可以指定script的src属性为跨域的url,从而实现跨域访问.
例如:
这种访问方式是不行的.但是如下方式,却是可以的.
<script src=”http://192.168.0.5/Web/web1.aspx” type="text/javascript"></script>
这里对返回的数据有个要求,即:服务器返回的数据不能是单纯的如{"Name":"zhangsan"}
如果返回的是这个json字符串,我们是没有办法引用这个字符串的.所以,要求返回的值,务必是var json={"Name":"zhangsan"},或json({"Name":"zhangsan"})
为了使程序不报错,我们务必还要建立个json函数.
3.解决方案
方案一
服务器端:
protected void Page_Load(object sender, EventArgs e) { string result = "callback({\"name\":\"zhangsan\",\"date\":\"2012-12-03\"})"; Response.Clear(); Response.Write(result); Response.End(); }
客户端:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var result = null; window.onload = function () { var script = document.createElement("script"); script.type = "text/javascript"; script.src = "http://192.168.0.101/ExampleBusinessApplication.Web/web2.aspx"; var head = document.getElementsByTagName("head")[0]; head.insertBefore(script, head.firstChild); }; function callback(data) { result = data; } function b_click() { alert(result.name); } </script> </head> <body> <input type="button" value="click me!" onclick="b_click();" /> </body></html>
方案二,通过jquery来完成
通过jquery的jsonp的方式.使用此方式,对服务器端有要求.
服务器端如下:
protected void Page_Load(object sender, EventArgs e) { string callback = Request.QueryString["jsoncallback"]; string result = callback + "({\"name\":\"zhangsan\",\"date\":\"2012-12-03\"})"; Response.Clear(); Response.Write(result); Response.End(); }
客户端:
$.ajax({ async: false, url: "http://192.168.0.5/Web/web1.aspx", type: "GET", dataType: 'jsonp', //jsonp的值自定义,如果使用jsoncallback,那么服务器端,要返回一个jsoncallback的值对应的对象. jsonp: 'jsoncallback', //要传递的参数,没有传参时,也一定要写上 data: null, timeout: 5000, //返回Json类型 contentType: "application/json;utf-8", //服务器段返回的对象包含name,data属性. success: function (result) { alert(result.date); }, error: function (jqXHR, textStatus, errorThrown) { alert(textStatus); } });
实际上,在我们执行这段js时,js向服务器发出了这样一个请求:
http://192.168.0.5/Web/web1.aspx?jsoncallback=jsonp1354505244726&_=1354505244742
而服务器也相应的返回了如下对象:
jsonp1354506338864({"name":"zhangsan","date":"2012-12-03"})此时就实现了跨域范文数据的要求.
解决js跨域问题 .
http://blog.csdn.net/macky0668/article/details/6247803
发表评论
-
JSONEditor
2015-07-08 20:11 559JSONEditor: https://github.com/ ... -
Javascript开发调试
2014-07-08 10:08 741小谈chrome调试命令:console.log的使用 h ... -
jQuery JSONP 跨域实践
2013-12-12 18:24 682jQuery JSONP 跨域实践 一客户端(url:htt ... -
利用CSS、JavaScript及Ajax实现图片预加载的三大方法
2013-10-17 09:35 712预加载图片是提高用户体验的一个很好方法。图片预先加载到浏览器中 ... -
Js中escape(),encodeURI()和encodeURIComponent()使用和比较:
2013-09-12 09:42 1030Js中escape(),encodeURI()和encodeU ... -
If-Modified-Since & If-None-Match
2013-04-27 13:24 860If-Modified-Since & If-None ... -
为什么JS文件带参数 JS后带参数什么意思
2013-04-27 11:20 1348我们经常在页面里会看到在加载的js或css文件带时文件后面常常 ... -
js实现网页图片延时加载的原理和代码
2013-04-23 11:52 996有时我们看到一些大型网站,页面如果有很多图片的时候,当你滚动到 ... -
关于document.compatMode的一些介绍
2013-04-22 17:35 971对于document.compatMode,很多朋友可能都根我 ... -
js之事件冒泡和事件捕获
2013-04-20 10:03 1731事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差 ... -
js中addEventListener中第3个参数 .
2013-04-19 16:33 1623捕获阶段、目标阶段、冒泡阶段 addEventListener ... -
超链接在web开发中使用总结
2013-04-02 14:33 1122在工作中在前端页面的 ... -
JavaScript Module Pattern: In-Depth
2013-03-27 11:47 976Module difinition: http://www.a ... -
JQuery移除事件
2013-01-30 13:00 932移除事件 unbind(type [,data]) ... -
Js 冒泡事件阻止
2013-01-29 09:27 9941. 事件目标 现在,事 ... -
查找所有嵌套iframe .
2013-01-28 10:19 114701.//查找所有嵌套iframevar allIfrs = ... -
什么是同源策略
2012-12-12 11:15 1137一.什么是同源策略 ... -
js 编码,使用java解码方式
2012-10-30 11:02 1629使用两个方法:decodeURIComponent和escap ... -
Cookies
2012-05-04 10:10 1037ookies Cookies 集合设置 coo ... -
XMLHttpRequest 对象(AJAX)的状态码(readyState)及HTTP 状态代码(status)的对照表
2012-04-19 19:43 1470XMLHttpRequest 对象(AJAX)的状态码(rea ...
相关推荐
**AJAX和JSONP跨域请求的实现过程** 1. **AJAX跨域**: 通常,AJAX请求受到同源策略限制。为实现跨域,我们可以使用CORS(Cross-Origin Resource Sharing)机制。服务器需要在响应头中添加`Access-Control-Allow-...
在本项目"JSONP跨域实现百度搜索功能(v1.0.0)"中,我们将深入探讨如何利用JSONP技术来实现在网页上嵌入一个能够进行百度搜索的功能。 首先,我们需要理解为什么需要JSONP。浏览器的同源策略是出于安全考虑,不允许...
JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了HTML的`<script>`标签可以不受同源策略限制的特性,实现JavaScript从不同源获取数据。在本例中,我们将探讨如何通过JSONP来解决JavaScript的跨域问题,...
本篇文章将深入探讨JSONP的工作原理以及在jQuery下如何利用它来实现异步跨域提交表单。 ### JSONP简介 JSONP是一种解决跨域问题的技术,其核心思想是利用`<script>`标签不受同源策略限制的特性。当浏览器解析到`...
接下来,我们来看如何编写一个简单的原生JavaScript AJAX库,支持JSONP跨域。以下是一个基本的实现框架: ```javascript function Ajax(options) { var script = document.createElement('script'); var ...
本篇文章将详细讲解如何利用jQuery的jsonp方法实现Ajax跨域请求,以及如何在服务器端使用.Net的*.handler和WebService来返回JSON数据。 首先,理解JSONP的基本原理。JSONP是一种非官方的协议,通过动态创建`<script...
Ajax JSONP跨域处理是Web开发中的重要技术,通过JSONP,开发者可以在不违反同源策略的前提下实现跨域数据交互。虽然JSONP存在一些限制和安全隐患,但在许多场景下,它仍然是一个实用且有效的解决方案。随着技术的...
但JSONP巧妙地利用了HTML中`<script>`标签可以跨域加载资源的特性,实现了跨域数据交换。 jQuery提供了`.ajax()`和`.getJSON()`两个方法来实现JSONP。下面将详细解释这两个方法以及JSONP的工作原理。 1. **jQuery...
JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了`<script>`标签可以跨域请求资源的特性来实现JavaScript与服务器之间的通信。在JavaScript中,由于同源策略的限制,通常不能直接访问不同源的资源。但是...
标题提到的"利用jsonp跨域调用百度js实现搜索框智能提示",即利用JSONP技术调用百度提供的API,实现在搜索框中输入关键字时,显示智能提示的功能,类似于百度搜索引擎的自动补全。 **JSONP原理**: JSONP的工作机制...
本示例“ASPNET_JSONP_demo(jq跨域)”正是展示了如何在 ASP.NET 平台上构建一个 JSONP 服务,并利用 jQuery 进行跨域调用。 首先,我们需要理解 JSONP 的工作原理。JSONP 是通过动态创建 `<script>` 标签来请求数据...
由于浏览器允许不同源的`<script>`标签加载和执行,开发者可以利用这一点来实现跨域请求。 ### JSONP工作原理 1. **客户端(浏览器)**:在JavaScript中,我们创建一个`<script>`元素,并设置其`src`属性为服务器...
JSONP 是一种跨域数据交互的方案,它利用了`<script>`标签不受同源策略限制的特点来实现跨域数据请求。其工作流程大致如下: 1. **客户端**发起一个HTTP请求,该请求包含一个回调函数名。 2. **服务器**接收到请求后...
"jsonp跨域请求"可能是服务器返回的示例数据,模拟了JSONP的跨域请求过程。 总结,JSONP和CORS是解决JavaScript跨域问题的两种主要方法,它们各有优缺点,适用于不同的场景。JSONP简单易用,但安全性较低;CORS则更...
它的原理是利用HTML的`<script>`标签不受同源策略限制的特性,通过动态创建`<script>`标签来加载服务器返回的JavaScript代码,这个代码通常是一个函数调用,参数是请求的数据。 1. **JSONP的工作流程**: - 客户端...
JSONP的核心思想是利用`<script>`标签不受同源策略限制的特点,通过动态插入`<script>`标签的方式获取跨域数据。具体步骤如下: 1. **本地定义回调函数**:首先,在本地页面中定义一个回调函数,该函数用于处理从...
JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了HTML中`<script>`标签没有同源策略限制的特点,允许网页从不同的域获取数据。在JavaScript中,由于同源策略的限制,通常不能从一个域下获取另一个域的...
### JSONP跨域调用详解 #### 一、JSONP定义及原理 **JSONP**(JSON with Padding)是一种被广泛采用的技术,用于绕过浏览器的同源策略限制,实现跨域数据请求。虽然JSONP并不是一种正式的标准或协议,但它在实际应用...
AJAX与JSONP跨域访问问题小结 AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个页面的情况下,能够更新部分网页的技术。它通过使用XMLHttpRequest对象来与服务器进行异步通信。XMLHttpRequest对象...
它利用script标签的不受同源策略限制的特性,通过动态创建script标签的方式来实现跨域请求。jQuery作为一个流行的JavaScript库,提供了简单易用的Ajax接口,其中包括了对JSONP的支持。本文将详细介绍使用jQuery实现...