如何使用 json Ajax 将文件连同一些输入字符串发送到 Codebehind 中的 web 方法？

Question

所以我有这个表单，要求用户在输入框、文件（eg.docx、pdf 等）和图像（eg.jpg、png 等）中填写一些文本，然后全部数据将被发送到代码隐藏中的 [Webmethod] - 并做一些处理..我已经成功地使用 json/ajax 请求从输入框（eg.Title，描述等）实现了字符串.. 唯一让我卡住的是要通过 json 传递并由代码隐藏接收的文件。任何帮助或建议都将不胜感激

$.ajax({
    type: "POST",
    url: "insert.aspx/eventCreate",
    data: {
        'eventImage': eventImage,//here's the image
        'eventFile': eventFile, //here's the file
        'eventTitle': eventTitle,
        'eventDesc': eventDesc,
        'eventPlace': eventPlace,
        'eventType': eventType,
        'eventAttendee': eventAttendee,
        'userID': userID
    },
    async: true,
    contentType: "application/json; charset=utf-8",
    success: function (data, status) {
        console.log("Call successfull test");
        alert(data.d);
    },
    failure: function (data) {
        alert(data.d);
    },
    error: function (data) {
        alert(data.d);
    }
});

[WebMethod(EnableSession = true)]
public static string eventCreate(string eventTitle, string eventDesc, string eventPlace, string eventType, string eventAttendee, string UserID)
{
    //how do I get the Image and file from the request??


    return "0";
}

Answer 1

抱歉，刚刚注意到您正在使用 'WebMethod'。

您可以 post 您的文件作为 base64 字符串并在您的 WebMethod 中接收相同的字符串，然后将 base64 转换回您的 WebMethod 中的文件。

请按照link 将文件转换为base64。

和 link base64-encoded-string-to-file 将 base64 转换回您的网络方法中的文件。

function getBase64(file) {
   var reader = new FileReader();
   reader.readAsDataURL(file);
   reader.onload = function () {
     console.log(reader.result);
   };
   reader.onerror = function (error) {
     console.log('Error: ', error);
   };
}

$.ajax({
    type: "POST",
    url: "insert.aspx/eventCreate",
    data: {
        'eventImage': eventImage,//here's the image
        'eventFile': eventFile, //here's the file
        'eventTitle': eventTitle,
        'eventDesc': eventDesc,
        'eventPlace': eventPlace,
        'eventType': eventType,
        'eventAttendee': eventAttendee,
        'userID': userID,
        'fileBase64': getBase64(document.getElementById('fileUploadId').files[0])
    },
    async: true,
    contentType: "application/json; charset=utf-8",
    success: function (data, status) {
        console.log("Call successfull test");
        alert(data.d);
    },
    failure: function (data) {
        alert(data.d);
    },
    error: function (data) {
        alert(data.d);
    }
});

[WebMethod(EnableSession = true)]
public static string eventCreate(string eventTitle, string eventDesc, string eventPlace, string eventType, string eventAttendee, string UserID, string fileBase64)
{
    //how do I get the Image and file from the request??
    File.WriteAllBytes(@"c:\yourfile", Convert.FromBase64String(fileBase64));


    return "0";
}

如何使用 json Ajax 将文件连同一些输入字符串发送到 Codebehind 中的 web 方法？

how to send file along with some input strings to a webmethod in Codebehind using json Ajax?

c#

asp.net

ajax

json

webmethod