JQuery和原生JS跨域加载JSON数据或HTML。
前提:有时候需要在网页上,加载另一个网站上的数据。或者加载另一个网站上的一个页面。Js的Ajax请求不具备跨域功能,可以使用JQuery来实现。
网页端JS代码:
$(function () {
$.ajax({
type: "get",
async: false,
url: "http://localhost:13964/getpage.ashx?callback=?",//服务端URL,该URL返回一段JS数据。如需返回HTML,只需把HTML组织成JSON即可,比如{"html":"<html></html>"}
dataType: "jsonp",//表示该请求为跨域的JSOP请求
jsonp: "htmlcall",//作用未知。随便填,但也能正常执行
jsonpCallback: "htmlcallback",//该值会把URL中的callback参数值替换,比如会把callback=?替换成callback=htmlcallback
success: function (json) {
$(json.selector).append(json.html);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('fail');
alert(textStatus);
alert(errorThrown);
}
});
});
服务端代码:
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string html = string.Empty;
using (FileStream fs = new FileStream(AppDomain.CurrentDomain.BaseDirectory + "/temppage.html", FileMode.OpenOrCreate))
{
using (StreamReader sr = new StreamReader(fs))
{
html = sr.ReadToEnd();
}
} JavaScriptSerializer jss = new JavaScriptSerializer();
Jsonp jsp = new Jsonp();
jsp.html = html;
string json = jss.Serialize(jsp);
//这里需要注意的是,JSONP要返回的并不是标准的JSON格式,而是下面这样的一个格式
//callbackname(json) 其中callbackname是从JS端传来的参数。json是JSON数据,括号也不能少。
string callback = context.Request["callback"];
context.Response.Write(callback + "(" + json + ")"); }
public class Jsonp
{
public string html { get; set; }
public string selector = "body";
} //原生JS跨域方法
var script = document.createElement("script");
script.src = "http://192.168.1.145:8089/AdSource/D?adid=" + advid + "&callback=lian_adv_writer";
script.type = "text/javascript";
document.head.appendChild(script);
function lian_adv_writer(data) {
alert(data);
}
JQuery和原生JS跨域加载JSON数据或HTML。的更多相关文章
- pdf.js跨域加载文件
pdf.js一个基于Html的工具类,熟悉pdf.js的朋友们很清楚,pdf.js帮助我们做了很多事.尤其金融类网站会产生很多的报表.需要在线预览.pdf.js绝对是我们的首选 本地预览 在pdf.j ...
- jsonp原生js跨域拿新浪数据插件封装【可扩展】
//修改了一个bug,增加了手动释放垃圾 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据
jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...
- jquery中ajax跨域加载
今天学习ajax跨域加载,先来一段代码,异步加载的链接是爱奇艺的开源,我直接拿来用作测试 <!DOCTYPE html> <html lang="en"> ...
- jquery mobile 和phonegap开发总结之三跨域加载页面
跨域加载 一要进行一定的配置见下面 $( document ).bind( "mobileinit", function() { // Make your jQuery Mobil ...
- RequireJS跨域加载html模版后被转成JS问题分析及解决
问题描述 RequireJS跨域加载HTML模版失败,例如: 在a.com域名下请求CDN域名下的模版,text.js插件会把html文件转成html.js文件去加载,由于并没有生成html.js文件 ...
- hive加载json数据解决方案
hive官方并不支持json格式的数据加载,默认支持csv格式文件加载,如何在不依赖外部jar包的情况下实现json数据格式解析,本编博客着重介绍此问题解决方案 首先创建元数据表: create EX ...
- 原生JS下拉加载插件分享。
无聊写了一个JS下拉加载插件,有需要的可以下载. // 使用 // new ManDownLoad("#ul","json/load.json",functio ...
- 扩展JQUERY 表单加载JSON数据
$.fn.extend({ //表单加载json对象数据 setForm : function (jsonValue) { var obj = this; $.each(jsonValue, func ...
随机推荐
- ubuntu-14.10下,安装gcc交叉编译器遇到问题及解决方法
一 下载gcc-arm-none-eabi-4_9 安装成功后上报错误: ./gcc-arm-none-linux-gnueabi-gcc: No such file or directory 网上查 ...
- IPv4地址学习总结
一. IPv4地址格式 网络互连的一个重要前提条件是要有一个有效的地址结构,并且所有的互连网络用户都应遵守这个地址结构.因为只有这样所有的互连网络用户才能在统一的规定下相互之间通讯.这个地址结构可以有 ...
- 微信jsSDK公众号开发时网页提示 invalid signature错误的解决方法
微信公众号开发jsSDK,链接地址不能加?参数,可以通过#传递参数. 不然.页面wx.ready()时就会报错,用 wx.error(function (res) { alert("接口验证 ...
- 【.Net Framework 体积大?】不安装.net framework 也能运行!?开篇叙述-1
[声明:请尊重作者micro-chen的原创,抓文章,请添加来源和作者署名.作者保留追责权利.......] 写在前言 看着日渐没落的.net ,心里多少有了点悲凉.国内的越来越多的新兴公司 都是JA ...
- Orcale 之基本术语二
表空间 表空间是 Orcale 数据库最大的逻辑结构.表空间就是一个或者多个数据文件的集合.所有的数据文件都被逻辑的存放在表空间中. 一个数据库包括 SYSTEM.SYSAUX和TMP三个默认表空间, ...
- C语言字节数组转换为基本数据类型
首先,必须明确基本类型在不同环境下字节的大小 这里用到了unsigned char:1 int:4 double:8 自己主要想用的是将字节数组转换为int型,double型 具体来说,将接收到的 ...
- HashSet、LinkedHashSet、TreeSet使用区别
HashSet:哈希表是通过使用称为散列法的机制来存储信息的,元素并没有以某种特定顺序来存放: LinkedHashSet:以元素插入的顺序来维护集合的链接表,允许以插入的顺序在集合中迭代: Tree ...
- CHM文件无法打开的解决方法
转载请注明来自:http://www.yaosansi.com原文地址:http://www.yaosansi.com/post/cannot_open_chm_file.html 目录:一.正确操作 ...
- BZOJ 1875: [SDOI2009]HH去散步(矩阵乘法)
首先,题意就把我们引向了矩阵乘法,注意边长m<=60,那么就按边建图,变成一个120个点的图,然后乱搞就行了。 PS:WA了N久改了3次终于A了QAQ CODE: #include<cst ...
- Eclipse中debug调试java代码一直报Source not found的解决办法
今天使用eclipse的debug调试代码,一直没法正常调试,一按F6就提示Source not found 根据提示发现可能是另一个项目影响了,所以把另一个项目Close Project,这次直接t ...