1.注意:Blazor是客户端技术,是Razor和SignalR技术的结合。优点是让C#后端开发人员不用懂即可完成前台功能。
2.Blazor Server实现了前后台一体化的解决方案,简化了部署,方便调试。目前主流的开发方式是WebAPI+前端框架,前后端的程序需要分别调试和部署,通过json配置文件实现前后端的融合。
3.因为前后台设计都是用C#语言,很多初学者都会碰到一个坑——分不清前后台代码。提醒初学者:razor组件附属的类或者组件内部@code内的代码都是前台的内容,如何想访问后台可以在页内注入后台服务或者用异步的方式访问。
4.后台访问代码如下:
如:
1.) 定义类systemservices.cs
using Furion.DependencyInjection;
using Furion.DynamicApiController;
using THGISServer.Core;
using System.Text.Json;
using System.Data;
namespace THGISServer.Application;
public class SystemService : ISystemService, IDynamicApiController, ITransient
{
private readonly IRepository<User> _userRepository;
public SystemService(IRepository<User> userRepository) {
_userRepository=userRepository;
}
public string GetDescription()
{
return "自主可控、简洁高效、跨平台的轻量级GIS平台。";
}
public string GetUsers()
{
var users = "select * from User".SqlQuery<User>();
var tt = JsonSerializer.Serialize(users);
//var tt=JsonSerializer.Serialize<DataTable>(dataTable);
return tt;
}
}
2.) 定义接口ISystemService.cs
namespace THGISServer.Application;
public interface ISystemService
{
string GetDescription();
string GetUsers();
}
3.) 定义razor组件 test.razor
@using THGISServer.Application;
@using System.Text.Json;
@inject ISystemService systemService
<div class="table-users scroll">
<Table TItem="SecurityDto" Items="@systemService.GetUsers()">
<TableColumns>
<TableColumn @bind-Field="@context.Name" />
<TableColumn @bind-Field="@context.Account" />
</TableColumns>
</Table>
</div>
5.razor组件访问webapi的方法:IHttpClientFactory
代码:
@using System.Diagnostics.CodeAnalysis;
@using THGISServer.Application;
@code {
[NotNull]
private IList<SecurityDto> Items { get; set; }
[Inject]
[NotNull]
private IHttpClientFactory HttpClientFactory { get; set; }
protected override async Task OnInitializedAsync()
{
var httpClient = HttpClientFactory.CreateClient();
string url = Navigation.BaseUri+"api/rabc/auth";
// var response=await httpClient.GetFromJsonAsync<List<SecurityDto>>(url);
var response = await httpClient.GetStringAsync(url);
}
}