运行环境

下载地址：https://dotnet.microsoft.com/download
image.png
下载64位的。
image.png
runtime是做什么用的呢？IIS这里有个模块。
image.png
有了这个AspNetCoreModuleV2 。dotnet core3 才能在iis上运行。
image.png
hosting是iis上需要安装的
image.png
后续的部署会在手写朝夕官网的时候会做部署。

创建项目

image.png
image.png
给项目起个名字WebApiDemo
image.png
右侧的Https可选也可以不选。反正最终是部署到iis上的
image.png

image.png
image.png

启动webapi的几种方式

直接点击iis express 启动。
image.png
image.png
webApi指定启动路由的地址在哪里指定？

命令启动，找到程序的目录，然后输入cmd
image.png
bin/debug/netcoreapp3.1
image.png
我们要启动的是WebApiDemo.dll
image.pngimage.png
—urls 指定启动的地址
image.png
指定ip： —ip 然后 —port指定端口号
image.png
显示三个绿色的info。说明程序已经执行ok了。
image.png
输入127.0.0.1:2020 输入地址啥也没打开。我们的webAPi和和MVC项目有个重大的区别。webapi虽然有指定的根目录，但是指定的根目录不好省略，所以我们必须要把根目录写上去。
image.png
我们首先要展示的是这个controller
image.png
输入WeatherForecast
image.png
这里设置了launchUrl，如果是MVc的项目会自动在地址的后面拼接上配置的launchUrl参数
image.png

加上swagger

image.png
image.png
项目依赖项，点击右键。
image.png
image.png

控制台进行安装

点击控制台
image.png
这里一定要选择安装到哪个项目下面
image.png
比如我们再新建一个其他项目
image.png
还是添加一个dotnetcore的应用程序，
image.png
比如叫做MvcDemo
image.png
image.png
这样现在就有两个项目了
image.png
这个时候再安装包的话，一定选对是哪个项目进行安装
image.png

image.png
这样就是在我们的webapi项目里面安装swagger了
image.png
mvc的项目的startup里面，指定了默认的路由
image.png
webApi里面是没有指定对应的路由的
image.png
把mvc项目里面的路由配置复制过来。
然后F12 进入到MapControllers里面看看里面能不能设置一些参数。image.png
好像是没有的
image.png
上面的复制过来，直接报错
image.png

image.png

image.png
手动去掉后面的，什么都不输入的话
image.png
代码恢复
image.png
配置swagger服务。
Doc配置版本号。
image.png
doc里面要新建配置项，OpenApiInfo,对象初始化器。
image.png
image.png

引用中间件的配置

先UseSwagger然后再UseSwaggerUI，用它的UI，在UI里面要写一些配置项。
image.png
配置项是莱姆达表达式。
image.png
要读取的json的文件，json文件是在项目生成的时候，自动生成的
image.png
V1要和上面配置的V1保持一致。如果不一致，那么就读取不到json文件。
image.png
前面是json的路径，后面是随便起的一个名字’
image.png
image.png
启动项目
image.png
手动输一下swagger/index
image.png

先把mvc的测试项目卸载掉。
image.png

设置默认启动页为swagger的页面。第一想到的可能是修改这个launchUrl
image.png
image.png
启动测试。，起作用了。
image.png
如果需要项目里面有一些中文标记。
通过Appdomain.CurrentDomain.BaseDirectory获取项目的根目录。根目录下的WebApiDemo.xml
image.png
image.png
右键项目—-选择属性
image.png
保存后，这里就有很多绿线
image.png
没写注释，就会有绿线
image.png
加上注释就没有绿线了
image.png
image.png

传参信息

例如这里加上一个参数
image.png
参数的描述
image.png
这里暂时先去掉，因为一旦打开，都会绿线的报错。
image.png

如果部署到IIS

这里的路径可能就会有问题了。这里改成相对的路径就可以了。
image.png

继续

属性调试，这里也有默认的启动项
image.png
改成这个
image.png
image.png
其实读取的就是这里的launchUrl
image.png

其他方法指定默认启动页

首先来告诉swagger是干嘛用的。在这里加个断点。
image.png
我们来请求下这个接口。
image.png
进入到断点。wagger中实际访问的就是我们的接口。
image.png

abp里面是这么用的。

把这段代码删掉
image.png
这里改成返回IActionResult，返回IActionResult就可以进行Redirect ，页面重定向。
image.png
image.png
输入这个地址。
image.png
很快会重定向到swagger的地址。这就是abp里面这么用的。
image.png
简化一下地址
image.png
启动程序，
image.png
跳转到。这样不破坏原有的配置，实现了跳转。
image.png

创建新的Controller

image.png
添加一个api的空的控制器。
image.png
HomeController
image.png

image.png
返回一个string，直接return了一个ok。如果就这么写直接启动会报错。
image.png
如果要让我们的系统集成swagger，那么所有的接口必须要规范化。
image.png
加上[HttpGet]。设置了请求类型。
image.png
image.png
请求数据测试。
image.png
请求的接口地址是api/[controller]
image.png
可以在后面加上action
image.png

image.png

image.png

前面把api去掉了
image.png

image.png

多个action的情况

image.png

image.png
image.png
不要action
image.png
去掉了action。就不知道该请求哪个数据了。
image.png
直接报错。
image.png

restful风格

如果里面只有一个get方法
image.png
那么肯定就知道访问的是唯一存在的一个方法
image.png
一旦有两个方法，就不知道该请求哪一个了
image.png
这时候就用到重载。有参数并且返回类型为int
image.png
还是报错
image.png

restful风格需要加的东西

后面需要根一个i的参数。跟在我们Get后面的参数。
image.png

image.png
image.png
输入10 执行一下
image.png
返回10
image.png
不光是方法需要重载，路由也不能一样。
image.png
httppost的请求
image.png

image.png

image.png
image.png
post的方法
image.png
进入的是HttpPost的方法
image.png

put和delete

请求方式的不同，请求到不同路由里面去。
image.png

image.png

加上返回的信息区分
image.png

image.png

结合前端请求api接口测试。

打开VSCode，然后新建一个页面，生成html标准页面。
image.png
引入vue和axios
image.png

快捷键同时修改多行

image.png
shift+alt点击多行
image.png
image.png
然后Ctrl+D。把多行都选中。然后Ctrl+C都复制一下。
image.png
然后shift+Alt 选中id这里赋值
image.png
一下子全复制过来
image.png
image.png
在默认浏览器中打开
image.png
image.png

image.png
分别输出返回的数据
image.png
报错，跨域的问题
image.png
在后端加上断点
image.png
前端页面
image.png
点击前台页面的get
image.png
进入到后台的断点
image.png
点击前台post也进入到后台的post
image.png
点击前台put没有进入后台。delete也没有进入。
image.png
跨域是不能返回，但是可以进入到后台的断点。

本节课的重点

从dotnetCore3.0开始，controller里面多了这个 ApiController。以前在dotnetCore2.X的时候是没有这个的
image.png
F12进去，它是ControllerAttribute的子类。
image.png
还是先了IFilterMetadata的接口。
image.png
好处是对数据进行自动的推断，

不加ApiController，get请求的区别。运行测试。
image.png
加俩断点。
image.png

image.png
image.png
get2传一个i的参数值
image.png
get1可以正常进来
image.png
加一个get3 通过url这种方式去传值
image.png

image.png
进入到断点
image.png
一定要符合这种路由的格式，才会到这个断点来。
image.png
这里加一个i的参数。
image.png
点击get2
image.png
image.png

get4，这种方式去传值。
image.png
image.png

image.png
进来了 ，但是i是null
image.png

加上[FromBody]

image.png
image.png
进不去。问题出在axios再向get传递数据的时候，需要加上参数params
image.png
image.png
进入断点
image.png
以上是没有ApiController的情况

加上[ApiController]

image.png
image.png

image.png
image.png

image.png
get4
image.png
image.png

结论：

也就是说 get请求和加不加ApiController没有影响。

测试几个post请求

新增加几个方法
image.png

前台post的传值
image.png
image.png

没有进入断点，加上params试试。也进不去。
image.png

解决post传参的问题

前台不加参数 ，测试
image.png
image.png
请求可以进来，传值为null
image.png
传一个name
image.png
然后post就进不去断点了。
image.png

image.png
image.png
进来了
image.png
image.png

允许跨域

image.png
image.png
contrller上加上允许跨域
image.png
image.png
post请求。通过这种对象的传值方式。
image.png
后台接收不到数据。

WeatherforecostController.cs
WebapiDemo
Startup.cs
HomeControllercs
DWebApiDcmo
KWebAPIDemo.ControllcrsHomControllcr
月月付图*PICOmEYDTR门ex
[HttpGet]
0个引月
publicstringGe(sTring)
四羽设
return”这是Get”;
//http://localhsot:8888/home/i)
[HttpGet(“i))
0个5月
publicstringGeT(i)
return”这是Get带参数,参数是”+i;
[HttpPost]
0个3月
publicstringPost(string
intage)
nulli
name
return”这是POst”;
//HttpPut]
//publicstringPut)
//

  1.     ![image.png](https://cdn.nlark.com/yuque/0/2020/png/192446/1606369998893-2fe8ae15-004e-4e5e-a065-a11dd2983d1f.png "image.png")

换成这种方式传值
image.png
image.png
这是表单格式的传值。也就是说只有是表单格式的传值，后端才可以获取到值。
image.png
如果是下面这种json格式的传值方式，后端获取不到值。
image.png

这是这两种方式，json对象传值方式是Request Payload.
参数+等号的传值是Form Data的形式
image.png
后端这里只能接受Form Data的格式的数据
image.png

方法2

还可以通过New URLSearchParams对象。然后Append键值对的形式去传值。
image.png
image.png

image.png

image.png

方法3：qs.js

image.png
这里因为没有这个库，只是代码模拟一下，
image.png

image.png
从后面的大项目里面用到的安装好的qs.js复制过来。
image.png
复制到当前这个演示项目里面。
image.png
image.png
引入后，这里就可以正常的使用了。
image.png
刷新页面，点击post
image.png
后端也可以获取到值了。
image.png
qs.stringify把json对象转换成了表单的形式，这样是可以进行post数据的传输的。

三种方式的总结：

1是拼接字符串：
image.png
方法2：、3

image.png

加上ApiController

到目前为止我们是没有ApiController的。现在我们把ApiController加上
image.png
1小时48分
image.png

image.png
这里字符写错了。应该是stringify
image.png

这里还是改成用postData的方式
image.png
image.png
进入到断点，参数都没有值。刚才没有加上[ApiController]的时候还能获取到值的。
image.png
image.png
改成json对象的形式
image.png
image.png
还是拿不到值。
image.png
image.png
加上[FromBody],那么第二个参数怎么办呢？
image.png

重点-加上[ApiController]后

加上apiController后，参数就不能通过这种形式，两个参数分别获取了
image.png
加上后，就逼着我们使用视图模型
添加Models文件夹。
image.png
创建UserInput类。
image.png
快捷键prop
image.png
自动生成的代码
image.png
创建name和age这两个属性
image.png
这里换成对象的形式
image.png
image.png

获取到了值。
image.png
如果不要ApiController
image.png
那么这里我们就需要加上[FromBody]
image.png
image.png

也获取到了值。
image.png

ApiController的好处

apiController是dotnetCore3.X才出现的。它的作用：
1：参数绑定策略的自动推断。
在apiController出现之前我们用的是[FromBody]
image.png
加上apiController之后我们这里就可以不用[FromBody]了。因为ApiController可以自动推断。
image.png
image.png
这样就不用再指定FromBody或者FromData了。它能够帮我们自动的推断。
image.png
2：自动的帮我们进行状态的验证。
如果我们去掉了ApiController，这里还是加上[FromBody]
那么我们就需要用到ModelState.IsValid来验证模型上的数据，
image.png
如果没有通过验证，要返回一个BadRequest，把状态返回回去。
image.png
如果我们使用了ApiController，它会自动帮我们的模型进行验证，如果没有验证通过，会自动返回400，badRequest

数据模型推断和模型状态的验证。
image.png

下节课开始 webApi过滤器的使用。然后就是手写过滤器。手写过滤器有一点点难。

结束