Question

My HTTP REQUEST contains a valid JSON string having the double quote in the middle of the name “jo\”hn” escaped as seen here (captured by Fiddler Web Debugger)

{"name":"firstName","value":"jo\"hn"},

Note: The request submission process uses the standard jQuery $.ajax(..) call as seen in this article without issue.

---

Server side issue

My C# ASMX web service method receives the following C# string value that has the middle double quote unescaped (i.e. backslash has been removed). This cannot be deserialized without causing the error seen below.

This is where the disjoint in the process happens, before I receive the value into my web method. It’s as if ASP.NET is processing the string internally by unescaping it and putting it back together with no escapes, altering the original value instead of providing it verbatim to the web method parameter.

C# String is:

{"name":"firstName","value":"jo"hn"},

The ASMX Web method is roughly:

using System.Web.Script.Serialization;
using System.Web.Script.Services;

[WebMethod]
[ScriptMethod(ResponseFormat = System.Web.Script.Services.ResponseFormat.Json)]
public string saveData(string values)
{
    JavaScriptSerializer json = new JavaScriptSerializer();
    request = json.Deserialize<List<NameValuePair>>(values.ToString());
                // ^^^ KABOOM! 

The exception message understandably is:

{“Invalid object passed in, ‘:’ or ‘}’ expected. (423):
[{\”name\”:\”plc$lt$zoneHeaderTopNav$searchBoxTopNav$txtWord\”,\”value\”:\”\”},{\”name\”:\”salutation\”,\”value\”:\”Mr\”},{\”name\”:\”firstName\”,\”value\”:\”joh\”n\”},{\”name\”:\”lastName\”,\”value\”:\”smith\”},{\”name\”:\”initial\”,\”value\”:\”d\”}]”}

How do I best go about solving this problem without changing away from classic ASMX web services?

I might consider a front handler that cleans up the incoming request, or maybe running a string cleanup at the beginning of the web service method. Maybe a different JSON library.

However I wonder if there is an easy answer: tweak configuration, use an Attribute, a setting or overload method that might solve the problem?

I’ve done quite a bit of poking around the Internet but most articles cover returning JSON data from the server to the client and dealing with issues in that area.

---

Addendum Note: full client-side call details requested by Darin Dimitrov

UPDATE: Darin’s Answer posted here inline, for easy reference

function SaveDraft() {

    $.checklist.checkvalid();
    var formObj = $(':input:not([type=hidden])').serializeArray();

    var request = JSON.stringify(formObj);
    request = request.replace(/'/g, "");

    $.ajax({
        url: "/Service.asmx/saveData",
        type: "POST",

        // *** Original erroneous line: uses string concat - commented out
        // data: "{'values':'" + request + "'}",

        // *** CORRECTED LINE: provides an object instead of a string and calls JSON stringify.
        data: JSON.stringify({ values: request }), 

        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: SaveDraftSuccess,
        error: SaveDraftFail
    });
}

Note: This is the embodiment of the call that produces the valid JSON fragment shown at the top of the question.

Answer 1

Why are you doing this horrible manual JSON deserialization in your web service? Let me suggest you a far better approach.

Start by defining a model:

public class Person
{
    public string Name { get; set; }
    public string Value { get; set; }
}

then a web method:

[WebMethod]
[ScriptMethod]
public string SaveData(Person person)
{
    ...
}

and then you could invoke it from javascript. For example using jQuery:

$.ajax({
    url: 'foo.asmx/SaveData',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify({
        person: {
            name: 'firstName',
            value: ' jo\"h\'n'
        }
    }),
    success: function(result) {
        alert(result.d);
    }
});

No kabooms anymore.

The JSON.stringify method shown here is built-in modern browsers but if you need to support legacy browsers you could include the json2.js script to your page.

---

UPDATE:

Now that you have shown your code it seems that you are not encoding your request. Try like this:

var formObj = $(':input:not([type=hidden])').serializeArray();
var request = JSON.stringify(formObj);
$.ajax({
    url: "/Service.asmx/saveData",
    type: "POST",
    data: JSON.stringify({ values: request }),
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: SaveDraftSuccess,
    error: SaveDraftFail
});

Things to notice: you don’t need regeular expressions to remove single quotes and you should use JSON.stringify to properly encode your request values.