使用 AJAX 发送文件以及 JSON 信息 [关闭]答案

【问题标题】：Send file along with JSON Information with AJAX [closed]使用 AJAX 发送文件以及 JSON 信息 [关闭]
【发布时间】：2015-11-13 14:01:33
【问题描述】：

我有一个ASP.NET c# 页面，该页面将以 JSON 格式发布带有 AJAX 的表单信息。该信息包括Texboxes的文本和Dropdownlists的值等。

我也需要发送文件。

我已经尝试了以下代码，它工作正常：

                $(".popup-content input:text,.popup-content textarea").each(function () { // Fill object by inputs
                    objInputs[$(this).attr("name")] = $(this).val();
                });
                $.ajax({ //Post information
                    type: "POST",
                    url: "myAjax.aspx",
                    data: { func: "Create", information: JSON.stringify(objInputs) /* Convert object to JSON string */ },
                    success: function (data) { // if sending was successful try to send file
                                var files = $("#fileImage").get(0).files; //get files form uploadfile
                                if (files.length > 0) {
                                    var data = new FormData();
                                    data.append(files[0].filename, files[0]);
                                    $.ajax({ //Send file
                                        type: "POST",
                                        url: "Handler1.ashx",
                                        contentType: false,
                                        processData: false,
                                        data: data,
                                        success: function (data) {

                                        },
                                        error: function (xhr, ajaxOptions, thrownError) {
                                            alert(xhr.status + " " + thrownError);
                                        },
                                    });
                             }
                    },
                    error: function (xhr, ajaxOptions, thrownError) {
                        alert(xhr.status + " " + thrownError);
                    },
                });

但现在我想知道是否有办法将我的文件与我的 JSON 一起发送？

【问题讨论】：

到目前为止你尝试过什么？您正在使用 ASP.NET 创建什么样的应用程序？网络表格？ MVC？
@Guanxi 我什么都没试过。并使用 ASP.NET WebForms
然后用谷歌搜索如何上传文件，如果您遇到任何问题，请在此处提出相关问题。我相信你可以很容易地在谷歌上找到很多关于文件上传的东西。
ASP.NET Ajax 使用 XMLHttpRequest 对象，所以它是 javascript。查看此帖子：stackoverflow.com/questions/2320069/jquery-ajax-file-upload.
我完全不清楚您要做什么？我认为您想要的内容与您的问题所要求的内容之间存在脱节。如果 Danny 提供的链接没有帮助，那么您可以考虑在您的问题中添加更多信息。

标签： c# asp.net json ajax

【解决方案1】：

我找到了解决方案。 Jquery 代码应更改为如下所示：

<script>
        $(document).ready(function () {
            $(document).on("click", "#submit", function () {
                var objInputs = {};
                objInputs["id"] = "12";
                $("#form1 input:text").each(function () { // Fill object by inputs
                    objInputs[$(this).attr("name")] = $(this).val();
                });
                var formData = new FormData();
                formData.append("information", JSON.stringify(objInputs));
                var files = $("#fileupload").get(0).files; //get files form uploadfile
                if (files.length > 0) {
                    for (var i = 0; i < files.length; i++) {
                        //add each file to the form data and iteratively name them
                        formData.append("file-" + i, files[i]);
                    }
                    $.ajax({ //Send file
                        type: "POST",
                        url: "Handler1.ashx",
                        contentType: false,
                        processData: false,
                        data: formData,
                        success: function (data) {
                            alert(data)
                        },
                        error: function (xhr, ajaxOptions, thrownError) {
                            alert(xhr.status + " " + thrownError);
                        },
                    });
                }
            });
        });
    </script>

以及用于处理已发送数据的 C# 代码（Handler1.ashx）：

    public void ProcessRequest(HttpContext context)
    {
        if (context.Request.Files.Count > 0) //To handling files
        {
            HttpFileCollection files = context.Request.Files;
            for (int i = 0; i < files.Count; i++)
            {
                if ((files[i].ContentLength < 500000) && (files[i].ContentType == "image/jpeg"))
                {
                    HttpPostedFile file = files[i];
                    string fname = context.Server.MapPath("~/Images/" + file.FileName);
                    file.SaveAs(fname);
                }
            }
            context.Response.ContentType = "text/plain";
            context.Response.Write("File Uploaded Successfully!");
        }
        if (!string.IsNullOrEmpty(context.Request["information"])) //To handeling JSON
        {
            string JSON = context.Request["information"]; //JSON String
        }
    }

【讨论】：