輸入名稱和位置,確定,進入模板選擇頁面。選擇 WEB API 模板(選擇Web API 時會添加對MVC 的支持)如果這里啥也沒有,說明啥?說明你在安裝vs開發軟件的時候沒安裝那些需要的開發環境,所以會發現缺少很多東西,最好的辦法是重新安裝,安裝的時候把所有的東西都安裝一下。

Windows10+vs 2017中創建web Api教程插圖1

2、添加ApiController

查看生產的目錄結構,發現WebAPI 的結構和普通MVC程序結構是非常類似的。 默認VS會在Controllers 文件夾下創建一個示例控制器: ValuesController

具體看下圖知道了,結構非常相似

Windows10+vs 2017中創建web Api教程插圖2
Windows10+vs 2017中創建web Api教程插圖3

通過查看該控制器代碼,發現WebAPI的控制器與MVC控制器的主要區別:

1)WebAPI控制器類繼承自 ApiController 類

2)WebAPI 方法返回的是原始數據,而不是視圖。

(1) 添加自己的控制器時,只需要在參照示例,在 Controllers 文件夾下,新建一個繼承自 ApiController 的類 ApiController 在命名空間 System.Web.Http 下 控制器一般按約定以 Controller結尾,如:ActionController

3、Web API 中的路由和方法

我們可以在  App_Start 文件夾中的 WebApiConfig 文件內,查看并修改 WebAPI 的路由(當然還有別的其他配置)在該文件內,有一個默認路由配置

Windows10+vs 2017中創建web Api教程插圖4

可以看出,WebAPI 路由與MVC理由非常類似,但也有有個明顯的區別,在 Web API 路由中,沒有 {action} 指令這是因為 Web API 默認操作以請求使用的HTTP動詞來調度。

也是說,在控制器中有以常見 Http 動詞(Get, Post, Put, Delete, Head, Patch, Options)開頭的方法,這個方法可以匹配相應動詞的請求。

例如,在 ValuesController 控制器中的 Get 方法

Windows10+vs 2017中創建web Api教程插圖5

當客戶端以 Get 方式請求到該控制器時,Web API 將自動匹配 Get 方法 。

對于名稱不能匹配常見動詞的方法,Web API 默認支持 post 請求,這時,需要在方法中使用 [Http…] 特性進行裝飾。

如:

Windows10+vs 2017中創建web Api教程插圖6

這個時候,默認的路由配置不適用了,需要在 WebApiConfig  文件添加自定義的路由配置(主要是添加 {action} 特性,以支持不匹配動詞的方法)

Windows10+vs 2017中創建web Api教程插圖7

這一步完成后,可以在本中調用該API方法了。調用方法和普通 MVC 方法調用一樣。

之所以說可以在本調用,因為在其他調用時,屬于跨域操作,還需要跨域調用設置,但是配置這個跨域設置費勁巴拉的,所以不太建議搞,建議還是直接搞

4、Web API? 中跨域調用

要Web API 可以跨域調用,首先需要在中添加 Microsoft.AspNet.Cors 的引用。可以使用NuGet在中安裝 Microsoft.AspNet.Cors

注: 在OWIN 中需要引用 的是 Microsoft.AspNet.WebApi.Cors

Windows10+vs 2017中創建web Api教程插圖8

Microsoft.AspNet.Cors 安裝成功后,需要在 WebApiConfig   文件中添加可跨域方法配置

最主要添加代碼

config.EnableCors(new EnableCorsAttribute(“*”, “*”, “*”));

EnableCorsAttribute 在命名空間 System.Web.Http.Cors 中(在新安裝 的  Microsoft.AspNet.Cors 內)

Windows10+vs 2017中創建web Api教程插圖9

而其中的參數,表示對可跨域調用的方法的配置(這里全為 “*” 表示所有方法均可跨域調用)到處為止,Web API 創建、配置已經完成。

但是有的時候在跨域配置完成后,任然不能在其他進行跨域調用。這有可能是瀏覽器不支持的原因。目前ie瀏覽器是肯定不支持,火狐瀏覽器也不行,谷歌瀏覽器看起來還行。瀏覽器的支持程度可以參照下圖(從網上扒拉過來的)

Windows10+vs 2017中創建web Api教程插圖10

這個時候,需要在調用 API 的 JS 中設置對跨域的支持。

好在 JQuery 提供了簡單的方法,只需要通過 JQ 設置 :jQuery.support.cors = true

Windows10+vs 2017中創建web Api教程插圖11

上圖中, jQuery.support.cors = true 表示設置瀏覽器對跨域調用的支持。ajax 方法即是調用 控制器 (圖中是 IPAddress)中的 方法 (GetIp, 參數 為 0),可以看出調用方法與MVC 方法是一樣的。

到這里其實已經弄完了,webapi基本上搞好了,但是只是一個基礎的api只能勉強用用,非常南坪,我建議還是去api平臺看看,用哪些正兒八經的api,更適合開發和生產環境上使用。

作者:幻城

上一篇:

進一步理解API和SDK的區別及關系

下一篇:

API簽名及加密方式詳解
#你可能也喜歡這些API文章!

我們有何不同?

API服務商零注冊

多API并行試用

數據驅動選型,提升決策效率

查看全部API→
??

熱門場景實測,選對API

#AI文本生成大模型API

對比大模型API的內容創意新穎性、情感共鳴力、商業轉化潛力

25個渠道
一鍵對比試用API 限時免費

#AI深度推理大模型API

對比大模型API的邏輯推理準確性、分析深度、可視化建議合理性

10個渠道
一鍵對比試用API 限時免費