AJAX 跨域图像发布到 WCF 服务
Posted
技术标签:
【中文标题】AJAX 跨域图像发布到 WCF 服务【英文标题】:AJAX Cross Domain Image Post to WCF Service 【发布时间】:2012-06-11 17:40:27 【问题描述】:我在这个问题上被困了 2 天。
谁能提供一个如何将跨域 AJAX 发布到 WCF 服务的示例?
我正在尝试将图像上传到 WCF 服务器。
编辑
WCF 服务:
[WebInvoke(UriTemplate = "/upload", Method = "POST", ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped), CorsEnabled]
void UploadImage(Stream image);
Ajax 调用:
function UploadImage()
image = document.getElementById("myimage").src;
var data = '"image": "' + image + '"'
//alert(data);
$.ajax(
url: "http://localhost:44665/api/upload",
type: "POST",
contentType: "application/json",
data: data,
success: function (result)
alert("success");
,
error: function (jqXHR, textStatus, errorThrown)
console.log(jqXHR.responseText);
);
如果我将 WCF 参数从 Stream 更改为字符串,我可以让它工作。但我需要上传图片而不是字符串。
我现在收到一个 WCF 错误,上面写着:
The server encountered an error processing the request. See server logs for more details.
** 编辑 2 ** 我添加了以下答案中提到的 global.asax 代码并将其添加到我的 web.config 中:
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
</system.web>
<system.serviceModel>
<behaviors>
<serviceBehaviors>
<behavior name="myServiceBehavior">
<servicedebug includeexceptiondetailinfaults="true" />
</behavior>
<behavior name="">
<serviceMetadata httpGetEnabled="true" />
<serviceDebug includeExceptionDetailInFaults="false" />
</behavior>
</serviceBehaviors>
</behaviors>
<serviceHostingEnvironment multipleSiteBindingsEnabled="true"
aspNetCompatibilityEnabled="true"/>
</system.serviceModel>
</configuration>
我现在在 Google Chrome 控制台中收到一条错误消息:
POST http://localhost:44665/api/upload 500 (Internal Server Error)
【问题讨论】:
***.com/questions/10763618/… 我的问题与上传图片有关。我能够让 ajax 帖子与字符串一起正常工作。但是,一旦我将 Stream 类型的参数添加到我的服务中,客户端将无法连接,并且客户端上出现以下错误:Access-Control-Allow-Origin 不允许 Origin localhost:44810。 我不知道您是如何通过 ajax 上传图像的,但我已经发布了解决 CORS 问题的答案。 【参考方案1】:因此,您正在尝试从 javascript 到托管在另一个域中的 WCF 服务进行 POST 操作。通常,如果不在 WCF 服务端进行一些特殊设置,您将无法做到这一点。
您必须在服务端将以下标头添加到来自Global.asax.cs
的响应中(如果服务项目不包含Global.asax.cs
,则创建一个)。
protected void Application_BeginRequest(object sender, EventArgs e)
//..
EnableCrossDomainCall();
private void EnableCrossDomainCall()
// this header tells that from any domain you can access me.
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
// this one tells about the supported methods to client.
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods",
"GET, POST, OPTIONS");
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers",
"Content-Type, Accept");
HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
HttpContext.Current.Response.End();
更新:
您不能只通过 AJAX 发布任何文件,通过 AJAX 您只能传输数据。你可以使用this插件,使用隐藏iframe来上传模仿AJAX的文件。
您可以像link 那样在 WCF 端处理流对象。尝试先上传小尺寸图片,您可以通过在 web.config 中设置maxRequestLength 来控制最大尺寸。
【讨论】:
如何处理 WCF 服务中的 Stream 对象?我已经更新了我的代码。以上【参考方案2】:我遇到了这个问题,试了下代码还是不行。
我更改了代码并开始工作。
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST,OPTIONS");
if ((HttpContext.Current.Request.HttpMethod == "OPTIONS"))
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept");
HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
HttpContext.Current.Response.End();
【讨论】:
以上是关于AJAX 跨域图像发布到 WCF 服务的主要内容,如果未能解决你的问题,请参考以下文章
跨域 jQuery Ajax 请求和 WCF REST 服务
经过身份验证的服务不支持跨域 javascript 回调。通过 SSL 代理对 WCF 服务的 AJAX 查询
我们可以在跨域中使用 Jquery $.ajax() 调用通过 https 访问 WCF 服务吗?
使用 transportCredentialOnly 安全性对 RESTful WCF 服务的跨域 Ajax JSON POST 支持