javascript 不用ajax 用 iframe 子域名下做到ajax post数据
最近在一个项目中遇到了ajax跨域的问题,情况如下。有三个域名分别是 a.xx.com b.xx.com c.xx.com 这三个域名都会用用ajax post方式相互读取数据。文笔不好, 不写了妈蛋。自己去看
//a.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body> <script type="text/javascript" charset="utf-8">
var Ajax = {
idf : "STONE",
frm:null,
ifm:null,
attribute:{
url:null,
type:"post",
data:null,
success:'Ajax.defaultFunction',
beforeSend:null,
jsonp: "callbackparam"
},
//跨域
init:function(){
//创建iframe元素
this.ifm = this.createDOM("iframe",{
name:"iframe"+this.idf,
id:"iframe"+this.idf,
style:"display:none",
width:1,
height:1
});
//创建form元素
this.frm = this.createDOM("form",{
action:this.attribute.url,
method:this.attribute.type,
id:"FORM"+this.idf,
name:"FORM"+this.idf,
target:"iframe"+this.idf
});
document.body.appendChild(this.frm);
document.body.appendChild(this.ifm);
//回调 callbackparam
this.frm.appendChild( this.createDOM("input",{
type:'hidden',
name:this.attribute.jsonp,
value:this.attribute.success
}) );
//参数 input
this.initInput(); this.frm.submit();
//alert(1);
},
//参数
initInput:function(data , inputname){ //判断initIuput是否是第一次
if(typeof data != "object"){
data = this.attribute.data;
}
for(i in data){
var iname = inputname ? inputname + "["+i+"]" : i; if(typeof data[i] == "object"){
this.initInput(data[i], iname);
}else{
this.frm.appendChild( this.createDOM("input",{
type:'hidden',
name:iname,
value:data[i]
}) );
}
} }, //创建DOM
createDOM:function(Element , data){
var e = document.createElement(Element);
for(i in data){
e.setAttribute(i,data[i]);
}
return e;
},
//默认返回处理函数
defaultFunction:function(){
console.log("不错!\n可以去搞基!");
},
//清除残留
del:function(){
//document.body.removeAttribute(Ajax.frm);
//console.log(this);
//提交后的回调
},
//合并对象
extend:function(o,n,override){
for(var p in n){
if(n.hasOwnProperty(p) && (!o.hasOwnProperty(p) || override)){
o[p]=n[p];
}
}
},
call:function(option){
//赋值
this.extend(this.attribute , option , true);
//提交 this.init(); this.ifm.onload = this.del;
} }
//使用
//如果是跨域请记得把 document.domain 设成一样
document.domain = "xx.com";
Ajax.call({
url:'iframe.html',
type:'post',
data:{ddd:"a",a:{b:2,c:{l:0}}}
});
</script>
</body>
</html>
iframe.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript" charset="utf-8">
document.domain = "xx.com";
parent.Ajax.defaultFunction()
</script>
</body>
</html>
现在只可以在子域名下跳跳,哪位大神有兴趣可以改成无限制跨域
javascript 不用ajax 用 iframe 子域名下做到ajax post数据的更多相关文章
- 《JavaScript》高级程序设计第21章:Ajax和Comet,jsonp
一.创建XMLHttpRequest对象 二.XHR的用法 五.跨域资源共享 六.其他跨域技术七.安全七.安全 1. 图像Ping 2. JSONP(JSON with padding,填充式JSON ...
- div中加入iframe,可以实现Ajax的功能
div中加入iframe,可以实现Ajax的功能,如果查询的时候,比如说城市的选择,用Ajax去实现, 在.net 可以考虑用UpdatePanel,但是点击了查询刷新表格(表格需要重新刷新加载,非纯 ...
- JavaScript学习总结【12】、JS AJAX应用
1.AJAX 简介 AJAX(音译为:阿贾克斯) = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技 ...
- 第二百七十二节,Tornado框架-iframe标签框架伪造ajax
Tornado框架-iframe标签框架伪造ajax html <!DOCTYPE html> <html> <head lang="en"> ...
- javascript AJAX简单原理及什么是ajax
AJAX简单原理供初学者理解 AJAX的原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其 ...
- 使用document.domain和iframe实现站内AJAX跨域
站内AJAX跨域可以通过document.domain和iframe实现,比如www.css88.com.js.css88.com.css88.com这3个域名其实是3个不同的域,很多时候www.cs ...
- 使用ajax与iframe嵌套实现页面局部刷新
使用ajax与iframe嵌套实现页面局部刷新.该javascript代码仅供参考,需按自己需要修改.1. [代码]javascript代码 function cj_start(depname,gr ...
- Ajax加载子域跨站cookie丢失的问题.
我们有两个网站一个是main.xxx.cn 一个是 preveiw.xxx.cn main.xxx.cn 页面需要加载preview.xxx.cn的内容. 项目里面出现了两种的加载preview.xx ...
- 使用ajax代替iframe
相信大多数程序员都跟iframe打过交道,iframe简单,好用.在我用的过程中比较苦逼的是关于iframe高度的设置. 由于子页面内容不确定,页面高度也不确定.于是开始网上的各种搜索,一般有两种:一 ...
随机推荐
- 新版的DEV RichEdit很强悍,兼容docx,排版更强
RV至少rtf格式不用自己搞了 Rv没Dev出的强悍 RV最蛋疼的就是表格 DEV目前看来,表格比RV强其他方面来说,觉得到差不多,无所谓dev的excel我整过一次,BUG不少dxRichEdit换 ...
- 【HDOJ】1438 钥匙计数之一
状态压缩.分最后一个槽的值以及当前的配置方案是否可以进行DP. /* 1438 */ #include <cstdio> #include <cstring> #include ...
- 【HDOJ】1063 Exponentiation
这道题目莫名其妙的wa,又莫名其妙的过了. import java.util.Scanner; import java.math.BigDecimal; public class Main { pub ...
- oracle连接总结(内连接、外连接、自然连接,交叉连接,自连接)
1.简述 1) 两个表的连接,是通过将一个表中的一列或者多列同另一个表中的列链接而建立起来的.用来连接两张表的表达式组成了连接条件.当连接成功后,第二张表中的数据就同第一张表连接起来了,并形成了复合 ...
- 通过xslt把xml转换成html
将内容与内容的表现分离,软件界自从成为一个行业以来一直在追求的目标. xml+xslt是典型的数据与表现分离的设计方式.当然,你可以直接转换成HTML,但是如果你要进行整体变化的时候,XML+XSLT ...
- iOS内存管理(一)
最近有时间,正好把iOS相关的基础知识好好的梳理了一下,记录一下内存相关方面的知识. 在理解内存管理之前我觉得先对堆区和栈区有一定的了解是非常有必要的. 栈区:就是由编译器自动管理内存分配,释放过程的 ...
- iOS NSInvocation的学习
用途: NSInvocation的作用和performSelector:withObject:的作用是一样的:用于iOS编程中调用某个对象的消息. performSelector:withObject ...
- 一个Nodejs的简单计算測试程序
測试目的: 1 測试二维数组的使用 2 输出函数的使用 代码: var util = require('util'); a = 3; b = 4; c = a + b; a = []; for(i = ...
- C++ TinyXml操作(含源码下载)
前言 TinyXML是一个开源的解析XML的解析库,能够用于C++,能够在Windows或Linux中编译,使用TinyXML进行C++ XML解析,使用简单,容易上手.这个解析库的模型通过解析X ...
- Android(java)学习笔记249:ContentProvider使用之获得系统联系人信息01
1.系统联系人的数据库(3张最重要的表) (1)raw_contacts 联系人表 保存联系人的id contact_id (2)data 数据表 保存联系人的数据 ( ...