您的位置:首页 > 其它

利用iframe实现图片跨域上传

2013-03-27 10:04 295 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title> 跨域demo</title >
<script type="text/javascript" language= "javascript" src="../js/jquery-1.8.3.min.js" ></script>
</head>
<body>
<form id= "proxy_form" action ="http://wo.test.com/proxy.php" method="post" target="proxy_hidden_iframe_1">
<input type="file" name="file" value="" />
<input type="text" name="name" value="" />
<input type="button" id="proxy_btn" value="提交" />
</form>
<iframe name="proxy_hidden_iframe_1" src="about:blank" style="display :none"></iframe >

<script type="text/javascript" >
$(document).ready(function (){
$( "#proxy_btn").click(function (){
/**
* 自己编写判断数据的合法性
*/

$( "#proxy_form").submit();
});
});

/**
* 跨域回调函数
*/
function _proxyCallBack(data){
// firefox 输出结果
console.log(data);

// 再处理前台界面问题
}
</script>
</body>
</html>

<?php
/**
* 逻辑层, 域名:wo.test.com
*/
$file = $_FILES['file'];
$name = trim($_POST['name']);

// 开始处理逻辑
//$result = array("status"=>"0", "msg"=>"操作失败")); // 失败状态
$result = array( "status"=>"1" , "msg" =>"操作成功", "data"=>array ("data1" =>"XXX", "data2"=>"YYY" ); // 成功状态

function _proxy($result)
{
$callback = "_proxyCallBack"; //回调函数名
$args = urlencode(json_encode( array($result)));
exit('<iframe name="proxy_hidden_iframe_2" src="http://www.test.com/open/proxy.html?callback='.$callback. '&args='.$args.'" width="0" height="0" style="display:none;" ></iframe>' );
}
?>

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Haodou callback proxy</title >
</head>

<body>
<script type="text/javascript" >
<!--
// JSON.parse
var JSON;if (!JSON){JSON={}}(function(){ 'use strict';function f(n){return n<10?'0'+n:n}if( typeof Date.prototype.toJSON!=='function'){Date.prototype.toJSON= function(key){return isFinite(this.valueOf())? this.getUTCFullYear()+'-' +f(this.getUTCMonth()+1)+ '-'+f(this .getUTCDate())+'T'+f(this.getUTCHours())+ ':'+f(this .getUTCMinutes())+':'+f(this.getUTCSeconds())+ 'Z':null };String.prototype.toJSON=Number.prototype.toJSON=Boolean.prototype.toJSON= function(key){return this.valueOf()}}var cx=/[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g ,escapable=/[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g ,gap,indent,meta={'\b':'\\b','\t':'\\t','\n':'\\n','\f':'\\f','\r':'\\r','"': '\\"','\\' :'\\\\' },rep;function quote(string){escapable.lastIndex=0; return escapable.test(string)?'"'+string.replace(escapable, function(a){var c=meta[a];return typeof c==='string'?c: '\\u'+('0000' +a.charCodeAt(0).toString(16)).slice(-4)})+'"': '"'+string+'"' }function str(key,holder){var i,k,v,length,mind=gap,partial,value=holder[key]; if(value&&typeof value==='object'&& typeof value.toJSON==='function'){value=value.toJSON(key)} if(typeof rep==='function'){value=rep.call(holder,key,value)} switch(typeof value){case'string' :return quote(value);case'number' :return isFinite(value)?String(value):'null';case'boolean' :case'null':return String(value);case'object' :if(!value){return'null' }gap+=indent;partial=[];if(Object.prototype.toString.apply(value)=== '[object Array]'){length=value.length;for(i=0;i<length;i+=1){partial[i]=str(i,value)|| 'null'}v=partial.length===0?'[]' :gap?'[\n'+gap+partial.join( ',\n'+gap)+'\n' +mind+']':'['+partial.join( ',')+']' ;gap=mind;return v}if(rep&& typeof rep==='object'){length=rep.length; for(i=0;i<length;i+=1){if(typeof rep[i]==='string'){k=rep[i];v=str(k,value); if(v){partial.push(quote(k)+(gap?': ' :':' )+v)}}}}else{ for(k in value){if(Object.prototype.hasOwnProperty.call(value,k)){v=str(k,value); if(v){partial.push(quote(k)+(gap?': ':':')+v)}}}}v=partial.length===0? '{}':gap?'{\n' +gap+partial.join(',\n'+gap)+ '\n'+mind+'}' :'{' +partial.join(',')+'}';gap=mind; return v}}if( typeof JSON.stringify!=='function'){JSON.stringify= function(value,replacer,space){var i;gap='';indent= ''; if(typeof space==='number'){ for(i=0;i<space;i+=1){indent+=' ' }}else if(typeof space==='string'){indent=space}rep=replacer; if(replacer&&typeof replacer!=='function'&&( typeof replacer!=='object' ||typeof replacer.length!=='number')){ throw new Error('JSON.stringify' )}return str('',{'':value})}} if(typeof JSON.parse!=='function'){JSON.parse= function(text,reviver){var j;function walk(holder,key){ var k,v,value=holder[key];if(value&&typeof value==='object'){ for(k in value){if(Object.prototype.hasOwnProperty.call(value,k)){v=walk(value,k); if(v!==undefined ){value[k]=v}else{ delete value[k]}}}}return reviver.call(holder,key,value)}text=String(text);cx.lastIndex=0; if(cx.test(text)){text=text.replace(cx,function(a){ return'\\u'+('0000'+a.charCodeAt(0).toString(16)).slice(-4)})} if(/^[\],:{}\s]*$/ .test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g ,']' ).replace(/(?:^|:|,)(?:\s*\[)+/g, ''))){j=eval( '('+text+')' );return typeof reviver==='function'?walk({ '':j}, ''):j} throw new SyntaxError('JSON.parse')}}}());

var params = {};
(function () {
var match,
pl     = /\+/g,  // Regex for replacing addition symbol with a space
search = /([^&=]+)=?([^&]*)/g,
decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
query = window.location.search.substring(1);

while (match = search.exec(query)){
params[decode(match[1])] = decode(match[2]);
}
})();

var args = params.args ? window.JSON.parse(decodeURI(params.args)) : [];

try {
if('_proxyCallBack' == params.callback)
parent.parent.window._proxyCallBack(args[0]);
} catch (e) {
}
//-->
</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: