json parsing error syntax error onverwacht einde van input

Ik kreeg het volgende stukje code

function pushJsonData(productName) {
    $.ajax({
        url: "/knockout/SaveProduct",
        type: "POST",
        contentType: "application/json",
        dataType: "json",
        data: " { \"Name\" : \"AA\" } ",
        async: false,
        success: function () {
            loadJsonData();   
        },
        error: function (jqXHR, textStatus, errorThrown) {
          alert(textStatus + " in pushJsonData: " + errorThrown + " " + jqXHR);
        }
    });
}

Merk op dat ik de datawaarde hard codeerde. De gegevens worden prima in de database gepushed. Ik krijg echter steeds de foutmelding "parsing error syntax error unexpected end of input". Ik ben er zeker van dat mijn gegevens in de juiste JSON syntaxis zijn. Toen ik controleerde met op het netwerk van Chrome inspector het saveProduct verzoek toonde de gegevens correct is.

{ "Name": "AA" }

Dit POST verzoek heeft geen antwoord. Dus ik weet niet waar de parse fout vandaan kwam. Ik heb geprobeerd met FireFox browser. Hetzelfde gebeurde.

Kan iemand een idee geven wat er mis is?

Bedankt,

P.S. Hier is de controller code

namespace MvcApplJSON.Controllers
{
    public class KnockoutController : Controller
    {
        //
        // GET: /Knockout/

        public ActionResult Index()
        {
            return View();
        }

        [HttpGet]
        public JsonResult GetProductList()
        {
            var model = new List<Product>();
            try
            {
                using (var db = new KOEntities())
                {
                    var product = from p in db.Products orderby p.Name select p;
                    model = product.ToList();
                }
            }
            catch (Exception ex)
            { throw ex; }
            return Json(model, JsonRequestBehavior.AllowGet);
        }
        [HttpPost]
        public void SaveProduct (Product product)
        {
            using (var db = new KOEntities())
            {
                db.Products.Add(new Product { Name = product.Name, DateCreated = DateTime.Now });
                db.SaveChanges();
            }
        }
    }
}
Oplossing

Ik kan niet met zekerheid zeggen wat het probleem is. Het kan een slecht teken zijn, het kunnen de spaties zijn die je aan het begin en aan het eind hebt laten staan, geen idee.

Hoe dan ook, je moet je JSON niet hardcoderen als strings zoals je hebt gedaan. In plaats daarvan is de juiste manier om JSON data naar de server te sturen het gebruik van een JSON serializer:

data: JSON.stringify({ name : "AA" }),

Zorg er nu op de server ook voor dat je het juiste view model hebt dat deze input verwacht te ontvangen:

public class UserViewModel
{
    public string Name { get; set; }
}

en de overeenkomstige actie:

[HttpPost]
public ActionResult SaveProduct(UserViewModel model)
{
    ...
}

Nu is er's nog één ding. Je hebt dataType: 'json' opgegeven. Dit betekent dat je verwacht dat de server een JSON resultaat zal retourneren. De controller actie moet JSON retourneren. Als je controller actie een view teruggeeft kan dit de fout verklaren die je krijgt. Het's wanneer jQuery probeert om het antwoord van de server te parsen:

[HttpPost]
public ActionResult SaveProduct(UserViewModel model)
{
    ...
    return Json(new { Foo = "bar" });
}

Dit gezegd zijnde, in de meeste gevallen, meestal hoeft u de dataType eigenschap niet in te stellen wanneer u een AJAX verzoek doet aan een ASP.NET MVC controller actie. De reden hiervoor is dat wanneer je een specifiek ActionResult retourneert (zoals een ViewResult of een JsonResult), het framework automatisch de juiste Content-Type response HTTP header zal instellen. jQuery zal dan deze header gebruiken om het antwoord te parseren en het als parameter te voeden aan de succes callback die al geparsed is.

Ik vermoed dat het probleem dat je hier hebt is dat uw server niet geldige JSON terug. Hij heeft ofwel een ViewResult of een PartialViewResult teruggestuurd, of je hebt geprobeerd om manueel wat gebroken JSON te maken in je controller actie (wat je natuurlijk nooit zou moeten doen maar in plaats daarvan het JsonResult gebruiken).

Nog een ding dat ik net opmerkte:

async: false,

Vermijd alsjeblieft om dit attribuut op valse te zetten. Als je dit attribuut op false zet, bevriest de browser van de client tijdens de hele uitvoering van het verzoek. Je zou in dit geval gewoon een normale aanvraag kunnen doen. Als je AJAX wilt gebruiken, begin dan te denken in termen van asynchrone gebeurtenissen en callbacks.

Commentaren (10)

Ik gebruikte een Node http request en luisterde naar het data event. Dit event zet de data alleen tijdelijk in een buffer, en dus is er geen volledige JSON beschikbaar. Om dit op te lossen, moet elke data event worden toegevoegd aan een variabele. Zou iemand kunnen helpen (http://nodejs.org/api/http.html).

Commentaren (0)

Bij mij was het probleem te wijten aan enkele aanhalingstekens voor het naam/waarde-paar... data: "{'Name':'AA'}"

Toen ik het veranderde in dubbele aanhalingstekens voor het naam/waarde-paar werkte het prima... data: '{"Naam":"AA"}' of zoals dit... data: "{"Naam":\"AA"}"

Commentaren (1)