javascript 通过 jQuery AJAX 将字符串数组传递给 C# WebMethod

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29775348/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 11:02:56  来源:igfitidea点击:

pass string array via jQuery AJAX to C# WebMethod

javascriptc#jquery.netajax

提问by Shaggy

I want to pass a JavaScript string array to a C# WebMethod via jQuery (POST):

我想通过 jQuery (POST) 将 JavaScript 字符串数组传递给 C# WebMethod:

$.ajax({
    type: "POST", // GET or POST or PUT or DELETE verb          
    url: PageURL + 'ChangeColor', // Location of the service
    data: "{ 'OriginalColorHex': '" + JSON.stringify(clipartOriginalColorsHex) + "','ModifiedColorHex':'" + JSON.stringify(clipartModifiedColorsHex) +
          "','OriginalColorRGB': '" + JSON.stringify(clipartOriginalColorsRGB) + "','ModifiedColorRGB':'" + JSON.stringify(clipartModifiedColorsRGB) +
          "','fileName':'" + clipartFileName + "' }",
    contentType: "application/json; charset=utf-8", // Content type sent to server
    dataType: "json", // Expected data format from server
    processdata: true, // True or False      
    traditional: true,          
    success: function (result) { // On Successful service call
        console.log(result);
    }
});   

Data going in ajax call looks like this

ajax 调用中的数据如下所示

{ 'OriginalColorHex': '["#000000","#006565","#cccc99"]', 'ModifiedColorHex': '["#3366CC","#cc5500","#3366cc"]', 'OriginalColorRGB': '["rgb(0,0,0)","rgb(0,101,101)","rgb(204,204,153)"]', 'ModifiedColorRGB': '["rgb(51, 102, 204)","rgb(204, 85, 0)","rgb(51, 102, 204)"]', 'fileName': '179.svg' }

C# WebMethod:

C# 网络方法:

[WebMethod]
public static string ChangeClipartColor(string[] OriginalColorHex, string[] ModifiedColorHex, string[] OriginalColorRGB, string[] ModifiedColorRGB, string fileName)
{
    // Code Here
}

Error

错误

{
   "Message":"Cannot convert object of type \u0027System.String\u0027 to type \u0027System.String[]\u0027",
   "StackTrace":"   at System.Web.Script.Serialization.ObjectConverter.ConvertObjectToTypeInternal(Object o, Type type, JavaScriptSerializer serializer, Boolean throwOnError, Object\u0026 convertedObject)\r\n   at System.Web.Script.Serialization.ObjectConverter.ConvertObjectToTypeMain(Object o, Type type, JavaScriptSerializer serializer, Boolean throwOnError, Object\u0026 convertedObject)\r\n   at System.Web.Script.Services.WebServiceMethodData.StrongTypeParameters(IDictionary`2 rawParams)\r\n   at System.Web.Script.Services.WebServiceMethodData.CallMethodFromRawParams(Object target, IDictionary`2 parameters)\r\n   at System.Web.Script.Services.RestHandler.InvokeMethod(HttpContext context, WebServiceMethodData methodData, IDictionary`2 rawParams)\r\n   at System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext context, WebServiceMethodData methodData)",
   "ExceptionType":"System.InvalidOperationException"
}

采纳答案by Nate Barbettini

Quick Fix

快速解决

JSON arrays do not need to be in quotes. This is valid JSON:

JSON 数组不需要用引号引起来。这是有效的 JSON:

{
    "OriginalColorHex": [
        "#000000",
        "#006565",
        "#cccc99"
    ]
}

Try validating your JSON with a tool like JSONLintto make sure it's valid. The WebMethod should be able to accept a string array just fine.

尝试使用JSONLint 之类的工具验证您的 JSON,以确保其有效。WebMethod 应该能够接受一个字符串数组就好了。

A slightly better method

稍微好一点的方法

Instead of building your JSON as a string, build an object and then let JavaScript handle the conversion for you:

不是将您的 JSON 构建为字符串,而是构建一个对象,然后让 JavaScript 为您处理转换:

var clipartOriginalColorsHex = ['#000000','#006565','#cccc99'];
var clipartModifiedColorsHex = ['#3366CC','#cc5500','#3366cc'];
var clipartOriginalColorsRGB = ['rgb(0,0,0)','rgb(0,101,101)','rgb(204,204,153)'];
var clipartModifiedColorsRGB = ['rgb(51, 102, 204)','rgb(204, 85, 0)','rgb(51, 102, 204)'];
var fileName = '179.svg';

var myData = {
    OriginalColorHex: clipartOriginalColorsHex,
    ModifiedColorHex: clipartModifiedColorsHex,
    OriginalColorRGB: clipartOriginalColorsRGB,
    ModifiedColorRGB: clipartModifiedColorsRGB,
    fileName: fileName
};

$.ajax({
    type: "POST",       //GET or POST or PUT or DELETE verb          
    url: PageURL + 'ChangeColor',       // Location of the service
    data:   JSON.stringify(myData),
    contentType: "application/json; charset=utf-8",     // content type sent to server
    dataType: "json",   //Expected data format from server
    processdata: true,  //True or False      
    traditional: true,          
    success: function (result) {//On Successful service call
        console.log(result);
    }
});

Much cleaner, less error-prone, and easier to test. Here's a fiddleto demonstrate.

更干净,更不容易出错,并且更容易测试。这里有一个小提琴来演示。

回答by leopik

Because the values are not an array. Remove the quotes around the strings that look like an array.

因为这些值不是数组。删除看起来像数组的字符串周围的引号。

{ 'OriginalColorHex': ["#000000","#006565","#cccc99"],'ModifiedColorHex':["#3366CC","#cc5500","#3366cc"],'OriginalColorRGB': ["rgb(0,0,0)","rgb(0,101,101)","rgb(204,204,153)"],'ModifiedColorRGB':["rgb(51, 102, 204)","rgb(204, 85, 0)","rgb(51, 102, 204)"],'fileName':'179.svg' }

回答by Nils O

You are passing a string ('["#000000","#006565","#cccc99"]') into a string[]. Get rid of the single quotes around your array's. This should do it:

您正在将字符串 ('["#000000","#006565","#cccc99"]') 传递到字符串 []。去掉数组周围的单引号。这应该这样做:

$.ajax({
type: "POST",       //GET or POST or PUT or DELETE verb          
url: PageURL + 'ChangeColor',       // Location of the service
data:   "{ 'OriginalColorHex': " + JSON.stringify(clipartOriginalColorsHex) + ",'ModifiedColorHex':" + JSON.stringify(clipartModifiedColorsHex) +
        ",'OriginalColorRGB': " + JSON.stringify(clipartOriginalColorsRGB) + ",'ModifiedColorRGB':" + JSON.stringify(clipartModifiedColorsRGB) +
        ",'fileName':" + clipartFileName + " }",
contentType: "application/json; charset=utf-8",     // content type sent to server
dataType: "json",   //Expected data format from server
processdata: true,  //True or False      
traditional: true,          
success: function (result) {//On Successful service call
    console.log(result);
}

});

});

回答by adrian3martin

You could make your life easier by waiting to stringify your data after you've put it all together.

您可以在将所有数据放在一起后等待对数据进行字符串化,从而使您的生活更轻松。

var data = {
    OriginalColorHex: clipartOriginalColorsHex,
    ModifiedColorHex: clipartModifiedColorsHex,
    OriginalColorRGB: clipartOriginalColorsRGB,
    ModifiedColorRGB: clipartModifiedColorsRGB,
    fileName: clipartFileName
};

$.ajax({
    type: "POST", // GET or POST or PUT or DELETE verb          
    url: PageURL + 'ChangeColor', // Location of the service
    data: JSON.stringify(data),
    contentType: "application/json; charset=utf-8", // content type sent to server
    dataType: "json", // Expected data format from server
    processdata: true, // True or False      
    traditional: true,          
    success: function (result) { // On Successful service call
        console.log(result);
    }
});