Angular post request to c# web api 2 RESTful web service











up vote
0
down vote

favorite












I'm trying to send a http post request from angular client to C# web API 2 RESTful web service.



My client:



var userId = "123456";
var password = "654321";

const headersContent = new Headers().set('Content-Type', 'application/x-www-form-urlencoded');
var url = "http://localhost:35615/login"
this.http.post(url, {
"userId": userId,
"password": password
}, {withCredentials: true}).subscribe(res => {
console.log(res);
});


My Server:



[Route("login")]
[HttpPost]
public IHttpActionResult LoginReq([FromBody] string parameters)
{
//Deserialize the parameters.
}


My problem is the parameters var is null although the post request in the network tab in chrome includes the data.



Can someone explain me what I'm doing wrong and how can I fix it?
Thank you!










share|improve this question


























    up vote
    0
    down vote

    favorite












    I'm trying to send a http post request from angular client to C# web API 2 RESTful web service.



    My client:



    var userId = "123456";
    var password = "654321";

    const headersContent = new Headers().set('Content-Type', 'application/x-www-form-urlencoded');
    var url = "http://localhost:35615/login"
    this.http.post(url, {
    "userId": userId,
    "password": password
    }, {withCredentials: true}).subscribe(res => {
    console.log(res);
    });


    My Server:



    [Route("login")]
    [HttpPost]
    public IHttpActionResult LoginReq([FromBody] string parameters)
    {
    //Deserialize the parameters.
    }


    My problem is the parameters var is null although the post request in the network tab in chrome includes the data.



    Can someone explain me what I'm doing wrong and how can I fix it?
    Thank you!










    share|improve this question
























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      I'm trying to send a http post request from angular client to C# web API 2 RESTful web service.



      My client:



      var userId = "123456";
      var password = "654321";

      const headersContent = new Headers().set('Content-Type', 'application/x-www-form-urlencoded');
      var url = "http://localhost:35615/login"
      this.http.post(url, {
      "userId": userId,
      "password": password
      }, {withCredentials: true}).subscribe(res => {
      console.log(res);
      });


      My Server:



      [Route("login")]
      [HttpPost]
      public IHttpActionResult LoginReq([FromBody] string parameters)
      {
      //Deserialize the parameters.
      }


      My problem is the parameters var is null although the post request in the network tab in chrome includes the data.



      Can someone explain me what I'm doing wrong and how can I fix it?
      Thank you!










      share|improve this question













      I'm trying to send a http post request from angular client to C# web API 2 RESTful web service.



      My client:



      var userId = "123456";
      var password = "654321";

      const headersContent = new Headers().set('Content-Type', 'application/x-www-form-urlencoded');
      var url = "http://localhost:35615/login"
      this.http.post(url, {
      "userId": userId,
      "password": password
      }, {withCredentials: true}).subscribe(res => {
      console.log(res);
      });


      My Server:



      [Route("login")]
      [HttpPost]
      public IHttpActionResult LoginReq([FromBody] string parameters)
      {
      //Deserialize the parameters.
      }


      My problem is the parameters var is null although the post request in the network tab in chrome includes the data.



      Can someone explain me what I'm doing wrong and how can I fix it?
      Thank you!







      c# angular rest http asp.net-web-api2






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 7 at 13:04









      KonRow

      206




      206
























          4 Answers
          4






          active

          oldest

          votes

















          up vote
          1
          down vote



          accepted










          You are passing an anonymous object with properties "UserId" and "Password".
          Make a Data Contract class which has those 2 properties as strings and use it in the parameters of your REST method.



          public IHttpActionResult LoginReq([FromBody] User user) { ... }





          share|improve this answer






























            up vote
            1
            down vote













            If you are passing an object from your Angular POST request the Web API POST method can be changed to accept an User defined type as parameter to read it from the request body.



            You can create the below user defined type in C# to bind UserId and Password properties from your angular Post request



            public class UserLogin
            {
            public int UserId { get; set; }
            public string Password { get; set; }
            }

            [Route("login")]
            [HttpPost]
            public IHttpActionResult LoginReq([FromBody] UserLogin user)
            {
            //Deserialize the parameters.
            }


            I would recommend going through this documentation to read more about parameter binding in Web API. Believe me its worth your time.






            share|improve this answer




























              up vote
              0
              down vote













              You post userId and password, but expect String parameters. Change to String userId, String password. The Modelbinder only will bind matching properties.






              share|improve this answer





















              • Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                – KonRow
                Nov 7 at 13:10










              • try parameter=value without qoutes in the post, so userId:userId, password:password
                – Cookinski
                Nov 7 at 13:13


















              up vote
              0
              down vote













              Just add JSON.stringify() you are sending an object to the server which expects only a string as a parameter so make it as a string and pass the value otherwise create a model with userid and password in your server side and mention that object



              let obj =  {
              "userId": userId,
              "password": password
              };
              this.http.post(url, JSON.stringify(obj), {withCredentials: true}).subscribe(res => {
              console.log(res);
              });


              The above code will work with the string parameters - Going forward try to use model and pass the object from Angular



              Happy Coding !!






              share|improve this answer





















                Your Answer






                StackExchange.ifUsing("editor", function () {
                StackExchange.using("externalEditor", function () {
                StackExchange.using("snippets", function () {
                StackExchange.snippets.init();
                });
                });
                }, "code-snippets");

                StackExchange.ready(function() {
                var channelOptions = {
                tags: "".split(" "),
                id: "1"
                };
                initTagRenderer("".split(" "), "".split(" "), channelOptions);

                StackExchange.using("externalEditor", function() {
                // Have to fire editor after snippets, if snippets enabled
                if (StackExchange.settings.snippets.snippetsEnabled) {
                StackExchange.using("snippets", function() {
                createEditor();
                });
                }
                else {
                createEditor();
                }
                });

                function createEditor() {
                StackExchange.prepareEditor({
                heartbeatType: 'answer',
                convertImagesToLinks: true,
                noModals: true,
                showLowRepImageUploadWarning: true,
                reputationToPostImages: 10,
                bindNavPrevention: true,
                postfix: "",
                imageUploader: {
                brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
                contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
                allowUrls: true
                },
                onDemand: true,
                discardSelector: ".discard-answer"
                ,immediatelyShowMarkdownHelp:true
                });


                }
                });














                 

                draft saved


                draft discarded


















                StackExchange.ready(
                function () {
                StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53190029%2fangular-post-request-to-c-sharp-web-api-2-restful-web-service%23new-answer', 'question_page');
                }
                );

                Post as a guest















                Required, but never shown

























                4 Answers
                4






                active

                oldest

                votes








                4 Answers
                4






                active

                oldest

                votes









                active

                oldest

                votes






                active

                oldest

                votes








                up vote
                1
                down vote



                accepted










                You are passing an anonymous object with properties "UserId" and "Password".
                Make a Data Contract class which has those 2 properties as strings and use it in the parameters of your REST method.



                public IHttpActionResult LoginReq([FromBody] User user) { ... }





                share|improve this answer



























                  up vote
                  1
                  down vote



                  accepted










                  You are passing an anonymous object with properties "UserId" and "Password".
                  Make a Data Contract class which has those 2 properties as strings and use it in the parameters of your REST method.



                  public IHttpActionResult LoginReq([FromBody] User user) { ... }





                  share|improve this answer

























                    up vote
                    1
                    down vote



                    accepted







                    up vote
                    1
                    down vote



                    accepted






                    You are passing an anonymous object with properties "UserId" and "Password".
                    Make a Data Contract class which has those 2 properties as strings and use it in the parameters of your REST method.



                    public IHttpActionResult LoginReq([FromBody] User user) { ... }





                    share|improve this answer














                    You are passing an anonymous object with properties "UserId" and "Password".
                    Make a Data Contract class which has those 2 properties as strings and use it in the parameters of your REST method.



                    public IHttpActionResult LoginReq([FromBody] User user) { ... }






                    share|improve this answer














                    share|improve this answer



                    share|improve this answer








                    edited Nov 12 at 12:30

























                    answered Nov 7 at 13:21









                    Julian Peil

                    657




                    657
























                        up vote
                        1
                        down vote













                        If you are passing an object from your Angular POST request the Web API POST method can be changed to accept an User defined type as parameter to read it from the request body.



                        You can create the below user defined type in C# to bind UserId and Password properties from your angular Post request



                        public class UserLogin
                        {
                        public int UserId { get; set; }
                        public string Password { get; set; }
                        }

                        [Route("login")]
                        [HttpPost]
                        public IHttpActionResult LoginReq([FromBody] UserLogin user)
                        {
                        //Deserialize the parameters.
                        }


                        I would recommend going through this documentation to read more about parameter binding in Web API. Believe me its worth your time.






                        share|improve this answer

























                          up vote
                          1
                          down vote













                          If you are passing an object from your Angular POST request the Web API POST method can be changed to accept an User defined type as parameter to read it from the request body.



                          You can create the below user defined type in C# to bind UserId and Password properties from your angular Post request



                          public class UserLogin
                          {
                          public int UserId { get; set; }
                          public string Password { get; set; }
                          }

                          [Route("login")]
                          [HttpPost]
                          public IHttpActionResult LoginReq([FromBody] UserLogin user)
                          {
                          //Deserialize the parameters.
                          }


                          I would recommend going through this documentation to read more about parameter binding in Web API. Believe me its worth your time.






                          share|improve this answer























                            up vote
                            1
                            down vote










                            up vote
                            1
                            down vote









                            If you are passing an object from your Angular POST request the Web API POST method can be changed to accept an User defined type as parameter to read it from the request body.



                            You can create the below user defined type in C# to bind UserId and Password properties from your angular Post request



                            public class UserLogin
                            {
                            public int UserId { get; set; }
                            public string Password { get; set; }
                            }

                            [Route("login")]
                            [HttpPost]
                            public IHttpActionResult LoginReq([FromBody] UserLogin user)
                            {
                            //Deserialize the parameters.
                            }


                            I would recommend going through this documentation to read more about parameter binding in Web API. Believe me its worth your time.






                            share|improve this answer












                            If you are passing an object from your Angular POST request the Web API POST method can be changed to accept an User defined type as parameter to read it from the request body.



                            You can create the below user defined type in C# to bind UserId and Password properties from your angular Post request



                            public class UserLogin
                            {
                            public int UserId { get; set; }
                            public string Password { get; set; }
                            }

                            [Route("login")]
                            [HttpPost]
                            public IHttpActionResult LoginReq([FromBody] UserLogin user)
                            {
                            //Deserialize the parameters.
                            }


                            I would recommend going through this documentation to read more about parameter binding in Web API. Believe me its worth your time.







                            share|improve this answer












                            share|improve this answer



                            share|improve this answer










                            answered Nov 7 at 15:53









                            Karthik

                            315




                            315






















                                up vote
                                0
                                down vote













                                You post userId and password, but expect String parameters. Change to String userId, String password. The Modelbinder only will bind matching properties.






                                share|improve this answer





















                                • Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                                  – KonRow
                                  Nov 7 at 13:10










                                • try parameter=value without qoutes in the post, so userId:userId, password:password
                                  – Cookinski
                                  Nov 7 at 13:13















                                up vote
                                0
                                down vote













                                You post userId and password, but expect String parameters. Change to String userId, String password. The Modelbinder only will bind matching properties.






                                share|improve this answer





















                                • Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                                  – KonRow
                                  Nov 7 at 13:10










                                • try parameter=value without qoutes in the post, so userId:userId, password:password
                                  – Cookinski
                                  Nov 7 at 13:13













                                up vote
                                0
                                down vote










                                up vote
                                0
                                down vote









                                You post userId and password, but expect String parameters. Change to String userId, String password. The Modelbinder only will bind matching properties.






                                share|improve this answer












                                You post userId and password, but expect String parameters. Change to String userId, String password. The Modelbinder only will bind matching properties.







                                share|improve this answer












                                share|improve this answer



                                share|improve this answer










                                answered Nov 7 at 13:07









                                Cookinski

                                715




                                715












                                • Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                                  – KonRow
                                  Nov 7 at 13:10










                                • try parameter=value without qoutes in the post, so userId:userId, password:password
                                  – Cookinski
                                  Nov 7 at 13:13


















                                • Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                                  – KonRow
                                  Nov 7 at 13:10










                                • try parameter=value without qoutes in the post, so userId:userId, password:password
                                  – Cookinski
                                  Nov 7 at 13:13
















                                Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                                – KonRow
                                Nov 7 at 13:10




                                Tried to do it like this LoginReq([FromBody] string userId, [FromBody] string password) - same result, the parameters are null
                                – KonRow
                                Nov 7 at 13:10












                                try parameter=value without qoutes in the post, so userId:userId, password:password
                                – Cookinski
                                Nov 7 at 13:13




                                try parameter=value without qoutes in the post, so userId:userId, password:password
                                – Cookinski
                                Nov 7 at 13:13










                                up vote
                                0
                                down vote













                                Just add JSON.stringify() you are sending an object to the server which expects only a string as a parameter so make it as a string and pass the value otherwise create a model with userid and password in your server side and mention that object



                                let obj =  {
                                "userId": userId,
                                "password": password
                                };
                                this.http.post(url, JSON.stringify(obj), {withCredentials: true}).subscribe(res => {
                                console.log(res);
                                });


                                The above code will work with the string parameters - Going forward try to use model and pass the object from Angular



                                Happy Coding !!






                                share|improve this answer

























                                  up vote
                                  0
                                  down vote













                                  Just add JSON.stringify() you are sending an object to the server which expects only a string as a parameter so make it as a string and pass the value otherwise create a model with userid and password in your server side and mention that object



                                  let obj =  {
                                  "userId": userId,
                                  "password": password
                                  };
                                  this.http.post(url, JSON.stringify(obj), {withCredentials: true}).subscribe(res => {
                                  console.log(res);
                                  });


                                  The above code will work with the string parameters - Going forward try to use model and pass the object from Angular



                                  Happy Coding !!






                                  share|improve this answer























                                    up vote
                                    0
                                    down vote










                                    up vote
                                    0
                                    down vote









                                    Just add JSON.stringify() you are sending an object to the server which expects only a string as a parameter so make it as a string and pass the value otherwise create a model with userid and password in your server side and mention that object



                                    let obj =  {
                                    "userId": userId,
                                    "password": password
                                    };
                                    this.http.post(url, JSON.stringify(obj), {withCredentials: true}).subscribe(res => {
                                    console.log(res);
                                    });


                                    The above code will work with the string parameters - Going forward try to use model and pass the object from Angular



                                    Happy Coding !!






                                    share|improve this answer












                                    Just add JSON.stringify() you are sending an object to the server which expects only a string as a parameter so make it as a string and pass the value otherwise create a model with userid and password in your server side and mention that object



                                    let obj =  {
                                    "userId": userId,
                                    "password": password
                                    };
                                    this.http.post(url, JSON.stringify(obj), {withCredentials: true}).subscribe(res => {
                                    console.log(res);
                                    });


                                    The above code will work with the string parameters - Going forward try to use model and pass the object from Angular



                                    Happy Coding !!







                                    share|improve this answer












                                    share|improve this answer



                                    share|improve this answer










                                    answered Nov 7 at 13:34









                                    Rahul Swamynathan

                                    786212




                                    786212






























                                         

                                        draft saved


                                        draft discarded



















































                                         


                                        draft saved


                                        draft discarded














                                        StackExchange.ready(
                                        function () {
                                        StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53190029%2fangular-post-request-to-c-sharp-web-api-2-restful-web-service%23new-answer', 'question_page');
                                        }
                                        );

                                        Post as a guest















                                        Required, but never shown





















































                                        Required, but never shown














                                        Required, but never shown












                                        Required, but never shown







                                        Required, but never shown

































                                        Required, but never shown














                                        Required, but never shown












                                        Required, but never shown







                                        Required, but never shown







                                        這個網誌中的熱門文章

                                        Hercules Kyvelos

                                        Tangent Lines Diagram Along Smooth Curve

                                        Yusuf al-Mu'taman ibn Hud