问题:在现代浏览器中默认是不允许跨域。

办法:通过jsonp实现跨域
 
在js中,我们直接用XMLHttpRequest请求不同域上的数据时,是不可以的。但是,在页面上引入不同域上的js脚本文件却是可以的,jsonp正是利用这个特性来实现的。
 
有两个站点:
  1.要获取数据的站点:http://localhost:1326/Default.aspx
     1.1页获取页面的json数据
 
2.要显示获取结果的站点
 

数据源页面的源码


protectedvoid Page_Load(object sender, EventArgs e)

{

// 摘要:获取或设置输出流的 HTTP 字符集。

// 返回结果: System.Text.Encoding 对象,包含与当前响应的字符集有关的信息。

Response.ContentEncoding = Encoding.UTF8;

// 摘要:  获取或设置输出流的 HTTP MIME 类型。            //

// 返回结果: 输出流的 HTTP MIME 类型。默认值为“text/html”。

Response.ContentType = "application/javascript";

String  jsonContent = "{'InnerDevId':12,'InnerOrgId':13}";

//将字符串写入响应输出流

/*

* 这里定义的方法必须加上window.onload。因为如果不加,这段代码将会在页面没有加载的时候就执行了。

*/

Response.Write("window.onload = function () { dosomething(" + jsonContent + ")}");

}

使用页面的源码


<%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="Default.aspx.cs"Inherits="testgetjson._Default"%>

<!DOCTYPEhtml>

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headrunat="server">

<title>测试页面</title>

<scripttype="text/javascript"src="Scripts/jquery-1.7.1.js"></script>

<scripttype="text/javascript">

function dosomething(jsondata) {

var odiv = document.getElementById('div1');

var strJson =  JSON.stringify(jsondata);

//$("#div1").text(strJson);

odiv.innerHTML=strJson;

returnfalse;

}

</script>

<scripttype="text/javascript"src="http://localhost:1326/Default.aspx"></script>

</head>

<body>

<formid="form1"runat="server">

<p>这里展现出来的,是跨域的问题,是从别的网页加载数据,还是从服务器加载数据</p>

<divid="div1"></div>

<pid="pmsg"></p>

</form>

</body>

</html>

利用jQuery实现跨域

利用jQuery实现跨域实际很简单。只要把服务区还回的json数据,加上加上回调函数名,就可以实现。

服务端修改后,和jQuery结合实现跨域----修改后的实现代码


using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

namespace testjsopGbk

{

publicpartialclass_Default : System.Web.UI.Page

{

protectedvoid Page_Load(object sender, EventArgs e)

{

// 摘要:获取或设置输出流的 HTTP 字符集。

// 返回结果: System.Text.Encoding 对象,包含与当前响应的字符集有关的信息。

// 异常:   System.ArgumentNullException:试图将 System.Web.HttpResponse.ContentEncoding 设置为 null。

Response.ContentEncoding = Encoding.UTF8;

// 摘要:获取或设置输出流的 HTTP MIME 类型。

// 返回结果:输出流的 HTTP MIME 类型。默认值为“text/html”。

Response.ContentType = "application/javascript";

String  jsonContent = "{'InnerDevId':12,'InnerOrgId':13}";

// 摘要: 获取 HTTP 查询字符串变量集合。

// 返回结果:System.Collections.Specialized.NameValueCollection,包含由客户端发送的查询字符串变量的集合。例如,如果请求: URL 为 http://www.contoso.com/default.aspx?id=44,则 System.Web.HttpRequest.QueryString的值为“id=44”。

string dosomething = Request.QueryString["Callback"] == null ? "jsoncallback" : Request.QueryString["Callback"].ToString();

//将字符串写入响应输出流

/*

* 这里将从url动态获取的方法名写到还回数据的前面。

*/

Response.Write(dosomething + "(" + jsonContent + ")");

}

}

}

}

在JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式。分别是JQuery的jquery.ajaxjsonp格式和jquery.getScript方式。

ajax要在各种浏览器下都实现完美的跨域需要借助于jsonp技术,jsonp实质是请求一个js脚本文件,在js文件载入完毕时执行某个函数,这样就可以完美的规则跨域问题了。

什么是jsonp格式呢?API原文:如果获取的数据文件存放在远程服务器上(域名不同,也就是跨域获取数据),则需要使用jsonp类型。使用这种类型的话,会创建一个查询字符串参数 callback=? ,这个参数会加在请求的URL后面。服务器端应当在JSON数据前加上回调函数名,以便完成一个有效的JSONP请求。意思就是远程服务端需要对返回的数据做下处理,根据客户端提交的callback的参数,返回一个callback(json)的数据,而客户端将会用script的方式处理返回数据,来对json数据做处理。JQuery.getJSON也同样支持jsonp的数据方式调用。

跨域 - 自定义 jsonp实现跨域的更多相关文章

  1. JS跨域:jsonp、跨域资源共享、iframe+window.name

    JS跨域:jsonp.跨域资源共享.iframe+window.name :https://www.cnblogs.com/doudoublog/p/8652213.html JS中的跨域 请求跨域有 ...

  2. JSONP实现跨域

    首先提出:什么是跨域?如何解决跨域? 跨域可以简单的理解为从一个域名访问另一个域名,由于javascript的同源政策的限制,出于安全的考虑,不允许浏览器这么做.比如a.com 域名下的js无法操作b ...

  3. 转(JSONP处理跨域事件)

     前言: 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Soc ...

  4. 跨域利器JSONP(转)

    何为跨域?何为JSONP?JSONP技术能实现什么?是否有必要使用JSONP技术? 跨域 就是由于JavaScript同源策略的限制,使得a.com域名下的js无法操作b.com或c.a.com域名下 ...

  5. jsonp实现跨域访问

    要实现JSONP跨域访问,首先就要了解什么是跨域?然后JSONP与JSON的关系? 1.什么是跨域? 跨域简单的说就是一个域名下的程序和另一个域名下的程序做数据交互.比如说:现有一个http://ww ...

  6. 解决跨域问题-jsonp&cors

    跨域的原因 浏览器的同源策略 同源策略是浏览器上为安全性考虑实施的非常重要的安全策略. 指的是从一个域上加载的脚本不允许访问另外一个域的文档属性. 举个例子:比如一个恶意网站的页面通过iframe嵌入 ...

  7. JSONP解决跨域问题,什么是JSONP(转)

    原文链接:https://www.cnblogs.com/xinxingyu/p/6075881.html 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的 ...

  8. jsonp解决跨域问题

    日常开发网页中,时常遇到跨域问题,通常解决办法:后端提供的接口支持jsonp格式,前端采用dataType:jsonp. 一:Jquery封装的AJAX,dataType:jsonp格式的方法: $. ...

  9. 跨域及JSONP原理

    什么是跨域:a.com 域名下的js无法操作b.com或是c.a.com域名下的对象 为什么浏览器要引入跨域问题? 跨域问题来源于浏览器的同源策略,为啥要有这个策略呢? 为了安全.假设现在有a.com ...

随机推荐

  1. 采坑:python base64

    需求:  读取文本内容,对字符串进行base64加密 >>> str = 'aaaaaaaaaaaaaaaaaaa\nbbbbbbbbbbbbbbbbbbbbbbbbbbb\nccc ...

  2. 服务器Windows 2008R2 C盘清理

    今天因为连服务器的时间慢了很多,然后看了一下C盘的空间,OMG剩下222K.然后一直上网找解决方案. 按照惯例,应该开一个360看看,C盘清理啊,搬家什么的.360告知的竟然是没有可以搬移的,所以,这 ...

  3. dotnet core 开发无缝兼容Http和Websocket协议的接口服务

    在应用接口开发中往往要针对不同协义开发相应的代理服务,但对于Websocket和http这两种协议来说就有些不同,从实现上来看Websocket可以说是Http的升级子协议, 两者在协议处理上基本一致 ...

  4. RAID磁盘阵列是什么(一看就懂)

    在单机时代,采用单块磁盘进行数据存储和读写的方式,由于寻址和读写的时间消耗,导致I/O性能非常低,且存储容量还会受到限制.另外,单块磁盘极其容易出现物理故障,经常导致数据的丢失.因此大家就在想,有没有 ...

  5. 【c#】RabbitMQ学习文档(一)Hello World

    一.简介 RabbitMQ是一个消息的代理器,用于接收和发送消息,你可以这样想,他就是一个邮局,当您把需要寄送的邮件投递到邮筒之时,你可以确定的是邮递员先生肯定会把邮件发送到需要接收邮件的人的手里,不 ...

  6. leetcode — remove-duplicates-from-sorted-list

    /** * Source : https://oj.leetcode.com/problems/remove-duplicates-from-sorted-list/ * * * Given a so ...

  7. Google SwipeRefreshLayout(Goolge官方下拉刷新控件)尝鲜

    前天Google官方终于出了Android刷新控件——SwipeRefreshLayout. 使用前先需要将android.support.v4.jar升级到19.1.升级后,可能会出现SDK版本与A ...

  8. RDIFramework.NET ━ .NET快速信息化系统开发框架 V3.2->新增记录SQL执行过程

    有时我们需要记录整个系统运行的SQL以作分析,特别是在上线前这对我们做内部测试也非常有帮助,当然记录SQL的方法有很多,也可以使用三方的组件.3.2版本我们在框架底层新增了记录框架运行的所有SQl过程 ...

  9. c#中的Unity容器

    DIP是依赖倒置原则:一种软件架构设计的原则(抽象概念).依赖于抽象不依赖于细节 IOC即为控制反转(Inversion of Control):传统开发,上端依赖(调用/指定)下端对象,会有依赖,把 ...

  10. 跨站点请求伪造(CSRF)学习

    一.CSRF介绍 伪造一个站点,在站点中伪造一个向其他站点的请求,在用户访问该站点时让用户执行 假设有如下URL能删除一篇文章: 攻击者在自己的域中构造一个页面: 内容为: 使用一个img标签,其地址 ...