web-dev-qa-db-ja.com

AngularJSからWeb APIに単純な文字列データを投稿できません

私はangularアプリからWeb APIにjson文字列を取得しようとしています。過去6時間、インターネット全体を調べてみました。

ネットワークコンソールを確認しましたが、jsonをフォームデータとして表示できますが、何らかの理由で私のWEB APIが取得していません。私は他のいくつかの投稿を見てきましたが、私の特定の問題に役立つものは一つもないようです。どんな方向でもいいです。私はすでに「変換」修正の使用を試みましたが、それは助けにはなりませんでした。

Web APIへのエントリーポイント

[HttpPost]
[Route("api/SkeltaInterfaceController/SaveWorkflow")]
public bool SaveWorkflow([FromBody] string json)
{
    ...
}

アングルコール

$scope.SaveWorkFlow = function () {
    $http({
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
        method: "POST",
        url: webAPI,
        data: {'DATA' : 'TEST DATA'
        }
    })
}

編集：I変更angularこれを呼び出す

$scope.SaveWorkFlow = function () {
    $http({
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
        method: "POST",
        url: webAPI,
        data: {'DATA' : 'TEST DATA'}
    })
}

Web APIは次のようになります

[HttpPost]
[Route("api/SkeltaInterfaceController/SaveWorkflow")]
public bool SaveWorkflow([FromBody] TestModel json)
{
    ...
}

そしてモデル

public class TestModel
{
    public string DATA { get; set; }
}

それでもDATAのnull値を取得していますが、何か設定が間違っていますか？

c#angularjsweb-serviceshttp-postasp.net-web-api
10
Willy

あなたの問題は、文字列を受け取ることを期待しているWebApiコントローラーメソッドにあると思いますが、それをオブジェクトに渡しています。それは少なくともメソッドにヒットしますが、nullを受け取りますか？

WebApiコントローラーメソッドに何を送信しようとしているかによって異なりますが、オブジェクトを送信する場合は、WebApiプロジェクトでそのオブジェクトを表すモデルを作成し、メソッドがパラメーターとしてオブジェクトを受け取るようにする必要があります。

たとえば、現在の方法では、次のようにします。

public class SaveModel 
{
    public string DATA {get; set;}
}


[HttpPost]
[Route("api/SkeltaInterfaceController/SaveWorkflow")]
public bool SaveWorkflow([FromBody] SaveModel model)
{ ...
7
mattherman

解決策はありますが、POST単純なstringデータ（オブジェクトではない）to _Web API_サービス。

POSTこのようなAPI（Test ApiController内）があるとしましょう）

_public void Post([FromBody]string value)
{
    //do something with value
}
_

AngularJSから、このメソッドに次のように投稿できます

（1） data as JSON（デフォルト）

_$scope.Test = function () {
    $http({
        method: "POST",
        url: "/api/Test",
        data: JSON.stringify("test")
    });
};
_

これはデフォルトで_Content-Type: application/json_を使用します。そしてサーバーはデータをJSONとして扱います。リクエストを見ると、リクエストの本文が次のような単純な文字列であることがわかります

_"test"
_

複雑なオブジェクトの場合は、JSON形式で表示されます。

（2） _application/x-www-form-urlencoded_としてのデータ（例のように）

_$scope.Test = function () {
    $http({
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
        method: "POST",
        url: "/api/Test",
        data: $.param({ "": "test" }),
    });
};
_

ここでは、コンテンツタイプを明示的に_application/x-www-form-urlencoded_に指定しているため、その形式でデータを送信する必要があります（URLクエリ文字列と同様）。そして、ここでは、データ内の空のキーはであり、_Web API_の奇妙なモデルバインディング要件を満たすだけです！ 結果のデータは次のようにエンコードされます

_=test
_

これは$.param({ "": "test" })で行ったものです。この理由の1つとして、FromBodyは主にobjectを送信するために使用され、単純なプリミティブ値ではありません。

したがって、コードの基本的な問題は、あなたが指定したものですコンテンツタイプ：application/x-www-form-urlencodedそして、あなたはJSON！としてデータを送信していました

33
Arghya C