第一步:首先在WebApi中進行管理NuGet包然后安裝下圖對應的插件
安裝完成后
第二步:修改SwaggerConfig.cs 如 api 版本號,title等相關信息
第三步:創建項目XML注釋文檔
右鍵項目→屬性→生成→選中下方的 “XML文檔文件” 然后保存
第四步:配置啟用 在WebApi中的App_Start中的SwaggerConfig.cs中進行配置
c.IncludeXmlComments(string.Format("{0}/bin/VueTest.XML",System.AppDomain.CurrentDomain.BaseDirectory));
第五步:啟動項目
地址:http://localhost:64607/swagger 這樣就成功咯~
第六步:訪問http://localhost:64607/swagger/docs/v1
這些就是在配置Vue中所需要的json文件,即在前端配置的時候的Input地址
Vue配置Swagger 首先在命令行中執行 npm install nswag 等待完成 然后在package.json中加入對應的腳本
“generate-client”: “node_modules/.bin/nswag swagger2tsclient /input:%npm_package_devConfig_genClient_input% /output:%npm_package_devConfig_genClient_output%” “devConfig”: { “apiUrl”:“http://localhost:64607/”, “genClient”: { “input”: “http://localhost:64607/swagger/docs/v1”, “output”: “src/api-client/client.ts” } },
然后運行npm run generate-client 生成對應的client 后台的接口會生成在client中 然后就可以在前端進行調用了哦,下面圖片是調用的具體例子:
原文鏈接:https://blog.csdn.net/qq_38365099/article/details/83786865