首先说明一下,我用的是jquery的jquery.form.js插件,$("#form_upload").ajaxForm()异步提交表单上传的。
比如我www.a.com域名下面有个上传图片的页面,点击按钮之后上传到www.b.com域名下的Handler/HandlerUpload.ashx,可以上传成功,但是无法返回值,提示XMLHttpRequest cannot load http://www.b.com/Handler/HandlerUpload.ashx. Origin http://www.a.com is not allowed by Access-Control-Allow-Origin. 。以下是代码:
<!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 runat="server"> <title>上传</title> <script type="text/javascript" src="JS/jquery.min.js"></script> <script type="text/javascript" src="JS/jquery.form.js"></script> <script type="text/javascript"> $(document).ready(function () { $("#ButtonUpload").click(function () { $("#form_upload").submit(); }); $("#form_upload").ajaxForm({ complete: function (xhr) { var json = $.parseJSON(xhr.responseText); alert(json["Tip"]); if (!json["Error"]) { $("#Picture").val(json["Value"]); $("#ImgPicture").attr("src", json["Value"]); } } }); }); </script> </head> <body> <form name="form_upload" id="form_upload" method="post" action="http://www.b.com/Handler/HandlerUpload.ashx" enctype="multipart/form-data"> <div> <input type="file" name="MyFile" id="MyFile" /> <input type="button" name="ButtonUpload" id="ButtonUpload" value="上传" /> <input type="hidden" name="Action" id="Action" value="UploadPicture" /> <br /> <br /> <br /> <br /> <input type="text" name="Picture" id="Picture" value="" /> <br /> <br /> <br /> <br /> <img id="ImgPicture" src="http://www.gqsoso.com/images/sysv3/globle/gq_logo.gif" alt="" /> </div> </form> </body> </html>
我看到很多大型网站上传附件action都指向别的域名(当然是顶级域名),请问他们是如何做的?
刚才在网上找了下资料,别人这么说的:
1.在处理上传图片的页面,加入response.setHeader("Access-Control-Allow-Origin", "*");
2.在请求页面,加入<meta http-equiv="Access-Control-Allow-Origin" content="*">
我也试了下,把“*”都改成了“http://www.a.com”,Chrome是可以的,但IE浏览器不行。
何解?
跨域一般都是通过Iframe来实现的,就是jquery也是这个原理,你可以可以通过这个东西,自己写一个。
注:我只是知道这么会事情啊,别跟我要代码,我没尝试过。
你这个提交不是提交到本域名下的那个页面了吗?
form的action是Handler/HandlerUpload.ashx
这都被你看出来了,我修改了。
这算jquery在做兼容时的一个bug吧。参考如下:
http://bugs.jquery.com/ticket/7282
应该可以自己写js创建XDomainRequest去调用,另外给一个(IE10以上应该可以,未实际验证)参考:
牛