先解释清楚。
我们将Jquery.form插件用于这个跨域异步上传功能,这在异步表单中非常有效,我们将跨域向HTTP响应头添加access-control-allow-方法。当然,这个头标只有IE10、火狐和谷歌支持。对于IE10以下的浏览器,我们不能用这个方法。我们需要改变我们的思维来做到这一点,并让服务器将其重写到我们的客户端。
再次工作。
1 jquery的使用。形式。
form method=' post ' action=' http://127 . 0 . 0 . 1:801/Home/UploadResult ' enctype=' multipart/form-data ' id=' form 1 '输入名称=' qdctvfile ' id=' qdctvfile11 '类型=' file ' onchange=' eventStart()'/form script类型='text/javascript'$('#form1 ')。Ajax FORm({ BeforeSerialize : function(){ var file path=$(' # qdtvfile 11 ')。val()var ext start=file path . LastIndex of(' . ');var ext=file path . substring(ext start,filepath.length)。toUpperCase();if (ext!='.巴布亚新几内亚文字母!='.jpg》){ alert('图片仅支持png png,JPG格式');$('#qdctvfile11 ')。val(“”);返回false}},success:函数(数据){alert(数据);}});函数eventStart(obj) {$('#form1 ')。submit();}注意代码中的eventStart方法指的是选择文件后自动提交表单,而ajaxForm则表示提交表单是异常方式,成功回调方法指的是异步返回表单地址的返回值。
2跨域初步实现。
为了解决域访问,我们可以在服务器的响应头中添加两个特性,访问控制允许源和访问控制允许方法。IE10以下的浏览器不支持这些功能,很郁闷。
///summary////MVC模式下的跨域访问////summarypublic类MvcCorsAttribute : ActionFilterAttribute { public override void on actionexecuting(actionexecuting context filterContext){ dictionary string,字符串头=new Dictionarystring,string();标题。添加('访问控制-允许-来源',' *);标题。添加('访问控制允许方法',' *);foreach(标题中的var项。键){filterContext。request context . httpcontext . response . headers . add(item,headers[item]);}基地。操作执行(过滤器上下文);}}注意,在生产环境中,我们的访问控制-允许-起源应该指定一个合法的域名,而*表示所有网站都开放访问,这是很危险的。
3.解决下面IE10不能跨域的问题。
关于IE浏览器我真的不能说什么。虽然我很喜欢微软的东西,但是对于IE我只能是NO。我真的不想说太多。先来看看IE中实现跨域上传的解决思路:客户端不直接返回数据,而是将回调地址重写给客户端,回调像ajaxForm方法一样返回最终数据。这个。
样例将解决直接跨域问题。
///summary////第三方的服务器/////summary//param name=' name '/param////returns/returns[http post]public action result upload result()。{字符串数据='{ '代码' :'OK ',' thumpImgUrl ' : ' http://127 . 0 . 0 . 1/images/1 . jpg ' } ';返回重定向(' http://localhost :9497/Home/UploadCallback?data=' data);}///summary////可能被服务器调用////summary////returns/returns公共动作结果上传回调(字符串数据){return content(数据);}有时候,当我们在思考一个问题的解决方案时,如果我们不能一路走下去,我们可以改变思维,我们可能会有意想不到的收获!
有人问是否可以使用POST在服务器和客户端之间传输数据。大叔说:不是,因为POST提交给客户端后,客户端处理,然后把结果返回给服务器,最后服务器把结果返回给ajaxform,一开始还是跨域的问题,哈哈!
以上就是边肖介绍的基于jQuery.form插件的jQuery跨域异步文件上传的相关内容,希望对大家有所帮助!