• Web API与AJAX:理解FormBody和 FormUri的WebAPI中的属性


    这是这一系列文章"与 AJAX 的 Web API"。在这一系列我们都解释消耗 Web API rest 风格的服务使用 jQuery ajax() 和其他方法的各种方法。您可以阅读我们以前的演示文稿,请访问下面的文章:

    这条 exlains 的"FormBody"和"FormUri"属性以及如何使用它们的操作参数与消费上的客户端的数据。所以,让我们举个例子。

    使用 FromUri 属性来发送数据

    使用 FormUri 属性,我们可以将数据传递通过的 URI URL。值应以键值对的形式。下面是一个示例,通过一个 URI 发送数据。在此示例中我们发送一个字符串通过 URL。参数的名称是"名称"。

    1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="APICall.aspx.cs" Inherits="WebApplication1.APICall" %>  
    2.   
    3. <head runat="server">  
    4.   
    5.     <script src="jquery-1.7.1.js" type="text/javascript"></script>  
    6.   
    7.      <script>  
    8.   
    9.          $(document).ready(function () {  
    10.   
    11.              $("#Save").click(function () {  
    12.   
    13.                   
    14.   
    15.                  $.ajax({  
    16.   
    17.                      url: 'http://localhost:3413/api/person?Name=Sourav',  
    18.   
    19.                      type: 'POST',  
    20.   
    21.                      dataType: 'json',  
    22.   
    23.                      success: function (data, textStatus, xhr) {  
    24.   
    25.                          console.log(data);  
    26.   
    27.                      },  
    28.   
    29.                      error: function (xhr, textStatus, errorThrown) {  
    30.   
    31.                          console.log('Error in Operation');  
    32.   
    33.                      }  
    34.   
    35.                  });  
    36.   
    37.              });  
    38.   
    39.          });  
    40.   
    41.     </script>  
    42.   
    43. </head>  
    44.   
    45. <body>  
    46.   
    47.     <form name="form1" id="form1">  
    48.   
    49.         <input type="button" id="Save" value="Save Data" />  
    50.   
    51.     </form>  
    52.   
    53. </body>  
    54.   
    55. </html>  

    很明显有在此方法中的某些限制。某些浏览器中的 URL 的长度是 256 个字符的限制和可能存在的安全漏洞。

    配置 Web API 从 URI 获取数据

    现在我们需要配置 Web API 从 URI 中提取数据。我们已推行一项行动命名为"PostAction",将一个参数,并具有 FromUri 属性指定该参数。这意味着名称参数的值将通过 URI。这里是工作守则的执行。

    1. using System;  
    2.   
    3. using System.Collections.Generic;  
    4.   
    5. using System.Linq;  
    6.   
    7. using System.Net;  
    8.   
    9. using System.Net.Http;  
    10.   
    11. using System.Web.Http;  
    12.   
    13.    
    14.   
    15. namespace WebApplication1.WebAPI  
    16.   
    17. {  
    18.   
    19.    
    20.   
    21.     public class personController : ApiController  
    22.   
    23.     {  
    24.   
    25.         [HttpPost]  
    26.   
    27.         public String PostAction([FromUri] string Name)  
    28.   
    29.         {  
    30.   
    31.             return "Post Action";  
    32.   
    33.         }  
    34.   
    35.    
    36.   
    37.     }  
    38.   
    39. }  

    我们有一个停止的应用程序,以检查是否所的数据来和它来。

    注:我们可以在一个单一的 URI 传递多个参数。

    Configure Web-API to get data from URI

    获取数据使用 FromBody 属性

    这是另一种方式,在 ajax() 调用获取数据。在此示例中,我们将看到如何使用 FromBody 属性的数据。看一看下面的示例。在这里是要发送数据的 ajax() 函数的实现。看一看 ajax() 函数的数据参数。我们看到使用键值对的值被传递的数据,但关键部分是空的。我们使用 FormBody 属性的接收数据感兴趣的时候我们应该保持为空的关键部分。

    1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="APICall.aspx.cs" Inherits="WebApplication1.APICall" %>  
    2.   
    3. <head runat="server">  
    4.   
    5.     <script src="jquery-1.7.1.js" type="text/javascript"></script>  
    6.   
    7.      <script>  
    8.   
    9.          $(document).ready(function () {  
    10.   
    11.              $("#Save").click(function () {  
    12.   
    13.                   
    14.   
    15.                  $.ajax({  
    16.   
    17.                      url: 'http://localhost:3413/api/person',  
    18.   
    19.                      type: 'POST',  
    20.   
    21.                      dataType: 'json',  
    22.   
    23.                      data:{"":"Sourav Kayal"},  
    24.   
    25.                      success: function (data, textStatus, xhr) {  
    26.   
    27.                          console.log(data);  
    28.   
    29.                      },  
    30.   
    31.                      error: function (xhr, textStatus, errorThrown) {  
    32.   
    33.                          console.log('Error in Operation');  
    34.   
    35.                      }  
    36.   
    37.                  });  
    38.   
    39.    
    40.   
    41.    
    42.   
    43.              });  
    44.   
    45.          });  
    46.   
    47.     </script>  
    48.   
    49. </head>  
    50.   
    51. <body>  
    52.   
    53.         <input type="button" id="Save" value="Save Data" />  
    54.   
    55. </body>  
    56.   
    57. </html>  

    现在我们需要配置 Web API 操作接收使用 FromBody 属性的值。请参阅人控制器中的"PostAction"的操作。我们将看到用 FromBody 属性指定 Name 参数。

    1. using System;  
    2.   
    3. using System.Collections.Generic;  
    4.   
    5. using System.Linq;  
    6.   
    7. using System.Net;  
    8.   
    9. using System.Net.Http;  
    10.   
    11. using System.Web.Http;  
    12.   
    13.    
    14.   
    15. namespace WebApplication1.WebAPI  
    16.   
    17. {  
    18.   
    19.     public class person  
    20.   
    21.     {  
    22.   
    23.         public string name { get; set; }  
    24.   
    25.         public string surname { get; set; }  
    26.   
    27.     }  
    28.   
    29.    
    30.   
    31.     public class personController : ApiController  
    32.   
    33.     {  
    34.   
    35.         [HttpPost]  
    36.   
    37.         public String PostAction([FromBody] String Name)  
    38.   
    39.         {  
    40.   
    41.             return "Post Action";  
    42.   
    43.         }  
    44.   
    45.    
    46.   
    47.     }  
    48.   
    49. }  
     
    Get data using FromBody attribute

    我们看到值从 ajax() 函数来在 POST 操作的时间。

    是允许多个 FormBody 属性吗?

    是,多个 formBodys 不允许在单个操作中。换句话说,我们不能在单个操作中指定多个 FromBody 参数。在这里是操作的不正确实现的示例:

    1. using System;  
    2.   
    3. using System.Collections.Generic;  
    4.   
    5. using System.Linq;  
    6.   
    7. using System.Net;  
    8.   
    9. using System.Net.Http;  
    10.   
    11. using System.Web.Http;  
    12.   
    13.    
    14.   
    15. namespace WebApplication1.WebAPI  
    16.   
    17. {  
    18.   
    19.     public class personController : ApiController  
    20.   
    21.     {  
    22.   
    23.         [HttpPost]  
    24.   
    25.         public String PostAction([FromBody]string name, [FromBody] string surname)  
    26.   
    27.         {  
    28.   
    29.             return "";  
    30.   
    31.         }  
    32.   
    33.    
    34.   
    35.     }  
    36.   
    37. }  

    结论

    这篇文章有 exlaind FromUri 和 FromBody 从 jQuery ajax() 函数接收一个值的概念。我希望你理解了,你将会在您下一次的 AJAX 调用中实现它。在以后的文章中,我们将探讨几个有趣的事实。

  • 相关阅读:
    hdu5894 hannnnah_j’s Biological Test(组合数取模)
    HDU5883 The Best Path(并查集+欧拉路)
    HDU5881 Tea(简单题)
    组合数取模
    codeforces703D Mishka and Interesting sum(区间偶数异或)
    upcoj2679 Binary Tree(思路题)
    upcoj2673 It Can Be Arranged(isap)
    atom编辑器适用
    python库pandas
    fabric Node SDK进行连接
  • 原文地址:https://www.cnblogs.com/lenther2002/p/4820571.html
Copyright © 2020-2023  润新知