启用 CORS 来解决这个问题(ajax跨域请求)

 1 <input type="file" name="btn_Upload" value="上传" id="btn_Upload" />
 2 <img src="" alt="" id="img_Upload" />
 3
 4 @section Scripts
 5 {
 6     <link href="../../js/uploadifive-v1.2.2-standard/uploadifive.css" rel="stylesheet" />
 7     <script src="../../js/uploadifive-v1.2.2-standard/jquery.uploadifive.js"></script>
 8 }
 9
10 <script>
11     $(function () {
12         $(‘#btn_Upload‘).uploadifive({
13             formData: { openId: ‘@ViewBag.OpenId‘ },
14             multi: false,
15             uploadScript: ‘@WXCommon.ConfigHelper.UploadUrl‘,
16             onUploadComplete: function (file, data) {
17                 if (data) {
18                     var json = $.parseJSON(data);
19                     if (json.res) {
20                         alert(json.msg);
21                         $(‘#img_Upload‘).attr({
22                             src: ‘@WXCommon.ConfigHelper.ThumbnailPath‘ + ‘/‘ + ‘@ViewBag.OpenId‘ + ‘/‘ + json.fileName
23                         });
24                     } else {
25                         alert(json.msg);
26                     }
27                 } else {
28                     alert(‘服务器内部错误!‘);
29                 }
30             }
31         });
32     });
33 </script>

Javascript

 1 //独立部署的图片服务器
 2 public ActionResult Index()
 3 {
 4     //if (Request.HttpMethod == "OPTION")
 5     //{
 6     //    Response.AddHeader("Access-Control-Allow-Methods", "GET,POST");
 7     //    Response.AddHeader("Access-Control-Allow-Headers", "Content-Type,Accept");
 8     //    Response.AddHeader("Access-Control-Max-Age", "1728000");
 9     //    Response.AddHeader("Access-Control-Allow-Origin", "*");
10     //}
11     string openId = Request["openId"];
12     HttpPostedFileBase httpPostedFileBase = Request.Files["Filedata"];
13     string fileName = httpPostedFileBase.FileName;
14     string extensionName = System.IO.Path.GetExtension(fileName).ToLower();
15     if (extensionName == ".jpg" || extensionName == ".jpeg")
16     {
17         string virtualPath = "/uploads" + "/" + fileName.Replace(extensionName, "") + DateTime.Now.ToString("yyyyMMddhhmmss") + extensionName;
18         string fullPath = Server.MapPath(virtualPath);
19         httpPostedFileBase.SaveAs(fullPath);
20
21         string savePath = Server.MapPath("/thumbnails" + "/" + openId);
22         string thumbnailFileName = Thumbnail.GetThumbnailImage(160, 120, fullPath, savePath, System.Drawing.Imaging.ImageFormat.Jpeg);
23         //删除原始文件
24         //System.IO.File.Delete(fullPath);
25         NowModel model = new NowModel();
26         model.Id = 0;
27         model.OpenId = openId;
28         model.FileName = thumbnailFileName;
29         nowBLL.Insert(model);
30         return Json(new { res = true, msg = "上传成功!", fileName = thumbnailFileName });
31     }
32     return Json(new { res = false, msg = "上传失败!" });
33 }

ASP.Net

 1   <!--仅试用于IIS7以上版本,IIS6.0请用Response.AddHeader的方式-->
 2   <system.webServer>
 3     <validation validateIntegratedModeConfiguration="false" />
 4     <httpProtocol>
 5       <customHeaders>
 6         <add name="Access-Control-Allow-Origin" value="*"/>
 7         <add name="Access-Control-Allow-Methods" value="GET,POST,OPTION"/>
 8         <add name="Access-Control-Allow-Headers" value="Content-Type,soapaction"/>
 9       </customHeaders>
10     </httpProtocol>
11   </system.webServer>

图片服务器配置文件

时间: 2024-10-18 12:29:44

启用 CORS 来解决这个问题(ajax跨域请求)的相关文章

Access to XMLHttpRequest at &#39;XXX&#39; from origin &#39;XX&#39; has been blocked by CORS policy: No &#39;Access-Control-Allow-Origin&#39; header is present o AJAX跨域请求解决方法

今天出现了一个问题找了好久先看代码: 这可能是个BUG吧插入代码: dataType: 'jsonp', crossDomain: true, 最终: Access to XMLHttpRequest at 'XXX' from origin 'XX' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present o AJAX跨域请求解决方法 原文地址:https://www.cnblogs

用iframe设置代理解决ajax跨域请求问题

面对ajax跨域请求的问题,想用代理的方式来解决这个跨域问题.在服务器端创建一个静态的代理页面,在客户端用iframe调用这个代理 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题.于是想用代理的方式来解决这个跨域问题. 什么是跨域?简单的来说,出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,即"同源策略".而跨域就是通过某些手段来绕过同源策略限制,实现不同服务器之间通信的效果. 方案:在服务器端创建一个静态的代理页面,在

第114天:Ajax跨域请求解决方法(二)

一.什么是跨域 我们先回顾一下域名地址的组成: http:// www . google : 8080 / script/jquery.js   http:// (协议号) www  (子域名) google (主域名) 8080 (端口号) script/jquery.js (请求的地址) * 当协议.子域名.主域名.端口号中任意一各不相同时,都算不同的"域". * 不同的域之间相互请求资源,就叫"跨域". 比如:http://www.abc.com/index.

CORS ajax跨域请求php简单完整案例一则

一.CORS: Cross-Origin Resource Sharing CORS是Cross-Origin Resource Sharing的缩写,表示跨域的资源分享,不仅可以跨子域,就算域名长得完全不一样,也可以进行资源获取. 比较常见的应用之一就是Ajax跨域请求数据. 这个特性IE11开始支持: 和股市一样,大好河山一片绿,青青草原漫无边. 二.ajax跨域请求的header设置和案例 和传统ajax请求相比,ajax跨域请求的偶尔工作量主要在数据接收方那一端,也就是在服务器端设置.

Ajax跨域请求以及乱码解决

Ajax跨域请求2种解决方法 1 ) 什么叫跨域请求,协议,域名,端口号,其中一样不同都称跨域; 第一种:使用script标签发送请求; //创建一个script标签; var v_element=document.createElement("script"); //设置script的type 属性; v_element.type="text/javascript"; //设置src属性; v_element.src="http://127.0.0.1:

如何解决ajax跨域请求?

1.什么是跨域? a.域名不同 b.域名相同,端口不同 注:只有域名相同,端口相同时,才可以访问数据 可以使用jsonp解决ajax跨域请求的问题. 2.什么是jsonp? Jsonp其实就是一个跨域解决方案.Js跨域请求是不可以的,但是js跨域请求js脚本是可以的.可以把数据封装成一个js语句,做一个方法的调用.跨域请求js脚本可以得到此脚本.得到js脚本之后会立即执行.可以把数据作为参数传递到方法中.就可以获得数据.从而解决跨域请求的问题. 原文地址:https://www.cnblogs.

JQuery的Ajax跨域请求的解决方式

今天在项目中须要做远程数据载入并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发现JQuery对于Ajax的跨域请求有两类解决方式,只是都是仅仅支持get方式. 各自是JQuery的 jquery.ajax jsonp格式和jquery.getScript方式. 什么是jsonp格式呢?API原文:假设获取的数据文件存放在远程server上(域名不同,也就是跨域获取数据).则须要使用jso

本地主机作服务器解决AJAX跨域请求访问数据的方法

近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www.apachefriends.org ,只需要解压傻瓜式地安装就可以. 找到安装软件的目录,点击xampp-control.exe然后启动Apache服务, 打开浏览器,在地址栏输入localhost,出现如下图片,说明安装启动都没问题 现在编写两个简单的文本,一个txt文件,一个html代码: 截图

Nginx服务器中处理AJAX跨域请求的配置方法讲解

Nginx 实现AJAX跨域请求AJAX从一个域请求另一个域会有跨域的问题.那么如何在nginx上实现ajax跨域请求呢?要在nginx上启用跨域请求,需要添加add_header Access-Control*指令.如下所示: ? 1 2 3 4 5 6 7 8 9 10 11 12 location /{ add_header 'Access-Control-Allow-Origin' 'http://other.subdomain.com'; add_header 'Access-Cont

Ajax 跨域请求 jsonp获取json数据

遇到Ajax的跨域请求出问题 找了中解决办法如下: 参考内容:http://justcoding.iteye.com/blog/1366102 由于受到浏览器的限制,该方法不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数 据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器上,Web 应用程序还有什么用处呢?如果需要从多个第三方服务器收集数据时,又该怎么办? 理解同源策略 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的