简体   繁体   English

带有JSON响应的jQuery Ajax文件上传到ASP.NET Web服务

[英]jQuery Ajax File Upload to ASP.NET web service with JSON response

I am trying to upload a file using jQuery Ajax to ac# Web Service (.asmx). 我正在尝试使用jQuery Ajax将文件上传到ac#Web服务(.asmx)。 The file is then processed by the Web Service and the result of the operation is returned asynchronously to the calling JavaScript. 然后,该文件由Web服务处理,并且操作结果异步返回到调用JavaScript。

The file upload works. 文件上传有效。 However, it requires that I omit the option contentType: 'application/json; charset=utf-8' 但是,它要求我省略选项contentType: 'application/json; charset=utf-8' contentType: 'application/json; charset=utf-8' when calling the $.ajax() function. 调用$.ajax()函数时, contentType: 'application/json; charset=utf-8' And this causes the result not to be serialized as XML rather than the expected JSON. 并且这导致结果不被序列化为XML而不是预期的JSON。 And this, in turn, causes jQuery to call the error handler instead of the success handler. 而这又导致jQuery调用error处理程序而不是success处理程序。

This is my client-side code: 这是我的客户端代码:

$.ajax({
    url: global.ajaxServiceUrl + '/StartStructureSynchronisation',
    type: 'POST',
    dataType: 'json',
    //Ajax events
    success: function (msg) {
      // this handler is never called
    error: function () {
      // this handler is called even when the call returns HTTP 200 OK
    },
    data: data, // this is a valid FormData() object
    //Options to tell jQuery not to process data or worry about content-type.
    cache: false,
    contentType: false,
    processData: false
});

And this is my server-side code: 这是我的服务器端代码:

[WebMethod(EnableSession = true)]
public string StartStructureSynchronisation()
{
    return this.Execute(delegate
    {
        if (HttpContext.Current.Request.Files.Count == 0)
        {
            Global.StructureSyncResult = new SyncResult() { Result = false, Log = new List<string>() { "No file uploaded." } };
        }
        else if (!new List<string>() { ".xls", ".xlsx" }.Contains(Path.GetExtension(HttpContext.Current.Request.Files[0].FileName).ToLower()))
        {
            Global.StructureSyncResult = new SyncResult() { Result = false, Log = new List<string>() { String.Format("({0}) is not a valid Excel file.", HttpContext.Current.Request.Files[0].FileName) } };
        }
        else
        {
            Global.StructureSyncResult = new Synchronization().SyncStructure(HttpContext.Current.Request.Files[0].InputStream, ref Global.DocSyncCurrent, ref Global.DocSyncMax);
        }

        return Global.Serializer.Serialize(Global.StructureSyncResult);
    });
}

So, basically, what I am looking for is one of two things: 因此,基本上,我要寻找的是两件事之一:

  • Either upload the file using contentType: 'application/json; charset=utf-8' 可以使用contentType: 'application/json; charset=utf-8'上传文件contentType: 'application/json; charset=utf-8' contentType: 'application/json; charset=utf-8' . contentType: 'application/json; charset=utf-8' That way, the response will be serialized as JSON. 这样,响应将被序列化为JSON。 I could even access the file as a parameter of my WebMethod instead of using HttpContext.Current.Request.Files . 我什至可以将文件作为WebMethod的参数来访问,而不是使用HttpContext.Current.Request.Files
  • Or find a way to force the WebService to always serialize the returned value as JSON, regardless of what the client says. 或者找到一种强制WebService始终将返回值序列化为JSON的方法,无论客户端说什么。

Any ideas? 有任何想法吗?

Thanks a lot in advance and kind regards, 在此先感谢您,也谢谢您,

Chris. 克里斯。

You can use Ajax Library query.ajax_upload.0.6.js , this is simple to use. 您可以使用Ajax库query.ajax_upload.0.6.js ,这很容易使用。

My code is Just for hint ! 我的代码仅供参考!

Button1 is basically the button to select the file from File Selector dialog . Button1基本上是从“文件选择器”对话框中选择文件的按钮。

$(document).ready(function () {
    function  uploadFile(parameters) {
        /* example 1 */
        var button = $('#button1'), interval;
        $.ajax_upload(button, {
            action: "FileHandler.ashx?test=" + $("#paramter").val(),
            name: Selectedval,
            onSubmit: function (file, ext) {
                StartLoading();
            },
            onComplete: function (file, response) {                 
                StopLoading();                  
            }
        });
        uploadButton();//Register Event
    });
});

<html>
    <a id="button1"  style="width: 70%" class="button orange">Select File</a>
</html>

On Server Side, You can write httpFile handler; 在服务器端,您可以编写httpFile处理程序;

public class FileHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        //For multiple files
        foreach (string f in context.Request.Files.AllKeys)
        {
            HttpPostedFile file = context.Request.Files[f];
            if (!String.IsNullOrEmpty(file.FileName)) {
                string test = file.FileName;
            }  
        }
    }
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM