AJAX & Web Api Post Method - 어떻게 작동합니까?

AJAX & Web Api Post Method - 어떻게 작동합니까?

AJAX / Jquery와 c#을 사용하여 데이터베이스에 기록하려고 합니다.파라미터를 C# 코드에 전달할 때마다 null로 표시됩니다.저는 비주얼 스튜디오에서 컨트롤러 클래스를 만들 때 생성하는 기본 템플릿을 사용하고 있습니다.어떤 도움이라도 주시면 감사하겠습니다!

참고: 제가 전화하려고 하는 휴게 서비스입니다. (일반 ASP 웹 사이트...MVC가 아닙니다.또한 GET Rest api는 완벽하게 동작합니다.)

쥬리/AJAX:

var dataJSON = { "name": "test" }

$('#testPostMethod').bind("click", GeneralPost);
function GeneralPost() {
    $.ajax({
        type: 'POST',
        url: '../api/NewRecipe',
        data:JSON.stringify(dataJSON),
        contentType: 'application/json; charset=utf-8',
        dataType: 'json'
    });
}

C#

    //If I remove the [FromBody] Tag then when I click the button this method is never called.
    public void Post([FromBody]string name)

    {

    }

편집:

코드를 조금 조정했지만 여전히 같은 문제가 발생하고 있습니다.요약하자면 POST 방법을 로드하고 있지만 null로 통과하고 있습니다.

C#

 public class RecipeInformation
    {
        public string name { get; set; }

    }

        public void Post(RecipeInformation information)

        {

        }

AJAX:

    var dataJSON = { information: { name: "test" } };

    $('#testPostMethod').bind("click", GeneralPost);
    console.log(dataJSON);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '../api/NewRecipe',
            data: dataJSON,
            contentType: 'application/json; charset=utf-8',
        });
    }

단순한 유형의 경우, 서버측:

public void Post([FromBody]string name)
{
}

클라이언트 측에서 json 형식으로 보낼지 정의하면 됩니다.

    var dataJSON = "test";

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '/api/NewRecipe',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

복잡한 유형으로 작업하려면 서버 측에서 다음을 정의해야 합니다.

public class RecipeInformation
{
    public string name { get; set; }
}

public class ValuesController : ApiController
{
    public void Post(RecipeInformation information)
    {
    }
}

그리고 클라이언트 측에서:

    var dataJSON = { name: "test" };

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '/api/NewRecipe',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

이와 같은 작업을 해보고 jquery param method를 사용하면 됩니다.

    var postData = {
        name : 'name'
    }

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '../api/NewRecipe',
            data: $.param(postData,true),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

저는 당신이 ASP를 사용하고 있다고 생각합니다.NET Web API와 이는 URL의 모든 단순한 유형(int, boole, string 등)과 본문의 모든 복잡한 유형을 바인딩합니다.이름을 표시했을 때FromBodyattribute를 url 매핑 대신 요청 본문에서 바인딩합니다.

ASP에 대한 자세한 내용을 확인할 수 있습니다.NET Web API 라우팅 및 매개 변수 바인딩:

• www.asp.net 에서
• www.west-wind.com 에서
• MSDN 상에서

데이터 계약 속성이 누락된 부분이 있습니다. 클래스를 다음과 같이 만들면 다음과 같습니다.

[DataContract]
public class RecipeInformation
{
    [DataMember]
    public string name { get; set; }
}

이러한 속성은 시스템에서 찾을 수 있습니다.런타임.직렬화, 그리고 Json 파서(Json).NET)은 이들을 사용하여 모델의 역직렬화를 돕습니다.

API 컨트롤러의 바인딩은 조금 이상한 면이 있습니다.저는 믿습니다.

public void Post([FromBody]RecipeInformation information)

와 함께

var dataJSON = { name: "test" };

작동할 것이며, 양식 데이터로 전달하면 확실히 작동할 것입니다.

언급한 대로 Microsoft Docs Use JS code의 도움으로 문제가 발견되었습니다.

$.post('api/updates/simple', { "": $('#status1').val() });

제가 놓친 것은 빈 속성 이름을 추가하는 것이었기 때문에 OP가 해야 할 일은{"":data:JSON.stringify(dataJSON)},대신에data:JSON.stringify(dataJSON),

$("#updateuser").클릭(함수) {

        var id = $("#id").val();
        var dataJSON = $("#username").val();

        alert("" + dataJSON);

        $.ajax({


            url: 'http://localhost:44700/api/Home/' + id,
            type: 'PUT',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',

            success: function (data, textStatus, xhr) {
                $.each(data, function (key, val) {
                    $("<li>" + val + "</li>").appendTo($("#names"));
                })
            },
            error: function (xhr, textStatus, errorThrown) {
                alert('Error in Operation');
            }

            })

    })

언급URL : https://stackoverflow.com/questions/15687903/ajax-web-api-post-method-how-does-it-work