介紹
通過一個簡單的專案,總結一下常用的幾種WebApi編寫方式以及請求方式。
本文示例程式碼環境:vs2019、net5、MySQL
正文前準備
新建立了一個.Net5 WebAPI程式,安裝元件
<PackageReference Include="AutoMapper" Version="10.1.1" />
<PackageReference Include="AutoMapper.Extensions.Microsoft.DependencyInjection" Version="8.1.1" />
<PackageReference Include="Common.EFCoreConfigurations" Version="1.0.0" /> <!--自己測試使用封裝的nuget包-->
<PackageReference Include="Microsoft.AspNetCore.Mvc.NewtonsoftJson" Version="5.0.6" />
<PackageReference Include="Swashbuckle.AspNetCore" Version="5.6.3" />
ConfigureServices配置NewtonsoftJson以及Automapper和運算元據庫程式碼
public void ConfigureServices(IServiceCollection services)
{
services.AddControllers().AddNewtonsoftJson();
services.AddSwaggerGen(c =>
{
c.SwaggerDoc("v1", new OpenApiInfo { Title = "MyWebApi", Version = "v1" });
});
// 自己測試使用所以封裝了一個連線資料庫的操作
services.AddMySQLService<OpenContext>("Server=localhost;Database=test;Port=3306;charset=utf8;uid=root;pwd=123456;");
//注入AutoMapper
services.AddAutoMapper(Assembly.GetExecutingAssembly().DefinedTypes.Where(t => typeof(Profile).GetTypeInfo()
.IsAssignableFrom(t.AsType())).Select(t => t.AsType()).ToArray());
}
注意:在Net core3.0以後,微軟移除了Newtonsoft.Json,而使用了System.Text.Json,所以依賴於Newtonsoft.Json的元件將不可用,需要安裝 Microsoft.AspNetCore.Mvc.NewtonsoftJson 包
新增一個使用者控制器,裡面包含了get、post、put、patch、delete幾種型別的介面。這裡先不貼程式碼,一點一點看。通過一個使用者的新增、修改、刪除作為一個演示的流程。
記得配置允許跨域請求,要不js請求會報錯。詳情看此處
資料表結構如下
POST
約定用於向服務端提交資料操作,請求時候引數放在引數FromBody傳遞,這裡我們用於新增使用者操作
前端
var par = { "account": "張三", "passWord": "123456" };
$.ajax({
type: "post",
dataType: 'json',
contentType: "application/json",
url: "http://localhost:5000/api/User",
data: JSON.stringify(par),
success: function (data) {
console.log(data);
}
});
後端
[HttpPost]
public async Task<string> AddAsync(AddUserVm dto)
{
var exist = await _context.Set<User>().AsNoTracking().AnyAsync(t => !t.IsValid && t.Account == dto.Account);
if (exist)
throw new Exception("帳號重複");
var user = _mapper.Map<User>(dto);
await _context.Set<User>().AddAsync(user);
await _context.SaveChangesAsync();
return user.Id;
}
Postman
URL:http://localhost:5000/api/User
傳遞引數格式為json格式,請求頭部預設新增:"Content-Type", "application/json"
GET
傳遞引數的本質是url字串拼接,Request-Head頭部傳遞,Request-Body中不能傳遞,查詢我們剛才新增的使用者資訊
後端
[HttpGet]
public async Task<ActionResult<List<User>>> Get()
{
return await _context.Set<User>().AsNoTracking().ToListAsync().ConfigureAwait(false);
}
本次示例直接將實體類返回了,生產環境不建議如此操作。
前端
$.ajax({
type: "get",
url: "http://localhost:5000/api/User",
contentType: "application/json",
success: function (data, status) {
console.log(JSON.stringify(data));
}
});
Postman
url:http://localhost:5000/api/User
返回結果
PUT
更新使用者資訊
前端
var par = { "account": "張三", "passWord": "123456" };
$.ajax({
url: "http://localhost:5000/api/User/1394282152006258688",
type: "PUT",
contentType: "application/json",
data: JSON.stringify(par),
success: function (result) {
console.log(result);
}
});
後端
[HttpPut("{id}")]
public async Task<ActionResult> Put(string id, [FromBody] UpdateUserVm dto)
{
var entity = await _context.Set<User>().FindAsync(id).ConfigureAwait(false);
if (entity is null)
return NotFound();
if (!string.IsNullOrWhiteSpace(dto.Account))
entity.Account = dto.Account;
if (!string.IsNullOrWhiteSpace(dto.PassWord))
entity.PassWord = dto.PassWord;
_context.Set<User>().Update(entity);
await _context.SaveChangesAsync();
return Ok("成功");
}
Postman
URL:http://localhost:5000/api/User/1394282152006258688
引數傳遞:Body=>raw=>json
{
"account": "張三",
"passWord": "333333"
}
DELETE
刪除使用者資訊
前端
$.ajax({
url: "http://localhost:5000/api/User/1394282152006258688",
type: "DELETE",
success: function (result) {
console.log(result);
}
});
後端
[HttpDelete("{id}")]
public async Task<ActionResult> DeleteAsync(string id)
{
var entity = await _context.Set<User>().FindAsync(id).ConfigureAwait(false);
if (entity is null)
return NotFound();
entity.IsValid = false;
_context.Update(entity);
await _context.SaveChangesAsync();
return Ok("成功");
}
Postman
URL:http://localhost:5000/api/User/1394282152006258688
Patch
在此用於更新資料
請求格式:[{"op" : "replace", "path" : "/PassWord", "value" : "222222"}]
add:新增屬性或陣列元素。 對於現有屬性:設定值。
remove:刪除屬性或陣列元素。
replace:替換操作
前端
var par = [{"op" : "replace", "path" : "/PassWord", "value" : "222222"}];
$.ajax({
url: "http://localhost:5000/api/User/1394282152006258688",
type: "Patch",
contentType: "application/json",
data: JSON.stringify(par),
success: function (result) {
console.log(result);
}
});
後端
[HttpPatch("{id}")]
public async Task<ActionResult<string>> PatchAsync([FromRoute] string id, JsonPatchDocument<UpdateUserVm> jsonPatch)
{
var entity = await _context.Set<User>().AsNoTracking().FirstOrDefaultAsync(t => t.Id == id && !t.IsValid).ConfigureAwait(false);
if (entity is null)
return NotFound();
var dto = _mapper.Map<UpdateUserVm>(entity);
jsonPatch.ApplyTo(dto, ModelState);
if (!ModelState.IsValid)
{
return BadRequest(ModelState);
}
var user = await _context.Set<User>().FindAsync(id).ConfigureAwait(false);
_mapper.Map(dto,user);
_context.Set<User>().Update(user);
await _context.SaveChangesAsync().ConfigureAwait(false);
return entity.Id;
}
Postman
更新
URL:http://localhost:5000/api/User/1394214078116794368
引數傳遞:Body=>raw=>json
[{"op" : "replace", "path" : "/PassWord", "value" : "222222"}]
op屬性指示操作的型別,path屬性指示要更新的元素,value屬性提供新值。
參考文件:https://docs.microsoft.com/zh-cn/aspnet/core/web-api/jsonpatch?view=aspnetcore-5.0