.net Core MasaStack接入文档（一）-JZTXT

一、MasaPM接入流程

1.1 测试环境地址
1.2 添加环境
1.3 新建项目
1.4 新建应用
二、MasaAuth接入流程

2.1 测试环境地址
2.2 新建应用菜单权限
2.3 新建单点登录客户端
三、使用Masa.Stack.Components全自动实现系统基础框架

3.0 包含左侧菜单-顶部导航-页面路由-权限控制-个人中心等
3.1 NuGet添加依赖包
3.2 添加appsettings.json配置
3.3 添加Program.cs引用
3.4 修改MainLayout.razor
3.5 修改_Layout.cshtml 引入css和js包
3.6 修改App.razor
3.7 添加PermissionCode.cs元素Code常量类
3.8 实现IPermissionValidator接口自定义权限校验
3.9 使用PermissionView组件实现元素权限控制
四、 MasaStack服务组件线上K8s环境变量配置

4.0 线上环境在目前阶段此项属于必须项
4.1 添加资源配置映射
4.2 应用附加环境变量

一、PM接入流程

项目管理：整合系统也是使用MasaStack服务组件的基础，它将贯穿至所有基础服务。这是必须要存在的

测试环境地址：
- https://pm-staging.masastack.com
添加环境：
- 选择打开Overview左导菜单
- 点击新建环境 ，名称输入’Production‘，关联集群选择Defalut
新建项目：
- 选择Production环境
- 点击新建项目
  
  名称：随意（尽量和ID保持一致）
  团队：可选
  ID：必填（业务标识Key，如MasaIoT）
  类型：Operator
新建应用：
- 选择MasaIoT环境
- 点击新建应用
  
  名称：输入DaprAppID
  类型：UI项目选择UI，Api服务选择Service
  ID ：输入DaprAppID
  其他输入选项默认即可。

二、Auth接入流程

权限认证：可接管所有服务的单点登录、菜单权限、Token权限认证等。它是很强大的存在

测试环境地址：
- https://auth-staging.masastack.com
新建应用菜单权限：
- 2.1 选择左道菜单依次选择打开角色权限-> 权限页面
- 2.2 点击PM项目下拉菜单 ，选择PM项目中刚刚新建的MasaIoT选项
- 2.3 鼠标移到lonsid-iot-admin点击新建 然后愉快的创建菜单权限和元素权限
  
  Code ：全局唯一
  Key ：显示名称
  Icon ：可选
  Url ：可选（菜单元素需要填写跳转地址）
  其他选项默认即可。
新建单点登录客户端
- 选择左道菜单依次选择打开单点登录-> 客户端页面
  
  ClientId ：全局唯一
  ClientName ：显示名称
  ClientUri ：可选
  CallBackRedirectUri ：授权回调登录成功地址，可配置多环境
  如本机开发：http://localhost:19000/signout-oidc
  如线上测试：https://masa-iot-u-admin-test.lonsid.cn/signout-oidc
  
  PostLogoutRedirectUri ：授权回调退出登录地址，可配置多环境
  如本机开发：http://localhost:19000/signout-callback-oidc
  如线上测试：https://masa-iot-u-admin-test.lonsid.cn/signout-callback-oidc
  其他选项默认即可。

三、使用MasaAuth全局托管BlazorUI项目

使用Masa.Stack.Components可托管左道菜单-顶部导航-I18语言切换-用户个人中心

NuGet添加依赖包：

 <PackageReference Include="Masa.Stack.Components" Version="0.0.302" />
 <PackageReference Include="MASA.Blazor.Experimental.Components" Version="0.7.0" />

添加appsettings.json配置：

"OIDC": {
    "Service": "https://auth-service-staging.masastack.com/",//auth服务地址
    "Authority": "https://sso-staging.masastack.com",//sso地址
    "ClientId": "masa-iot-ui-admin",//客户端Id
    "ClientSecret": ""
}

"DccOptions": {
    "ManageServiceAddress": "http://localhost:8890",
    "RedisOptions": {
    "Servers": [
        {
        "Host": "10.175.207.202",
        "Port": 30260
        }
    ],
    "DefaultDatabase": 0,
    "Password": "Hzss@123redis"
    },
    "ConfigObjectSecret": "masastack.com"
}

添加Program.cs引用：

 ```
 //截止到1.0.0-preview.22版本“AddMasaStackComponentsForServer”内置启用Dcc，默认读取环境变量内的Dcc配置，这里开发环境强制本地配置文件，线上任何环境都需要在k8s里面增加Dcc环境变量配置

 if (builder.Environment.IsDevelopment())
 {
     builder.Services.AddMasaConfiguration(builder => builder.UseDcc());
     builder.Services.AddDaprStarter(builder.Configuration.GetSection("DaprOptions"));
 }
 builder.Services.AddMasaOpenIdConnect(AppSettings.GetModel<MasaOpenIdConnectOptions>("OIDC"));

 string? authHost = builder.Environment.IsProduction() ? null : AppSettings.Get("OIDC:Service");

 builder.AddMasaStackComponentsForServer("wwwroot/i18n", authHost);
 ```

修改MainLayout.razor：

替换以下代码

@using Masa.Stack.Components
@using Microsoft.AspNetCore.Components.Rendering
@inherits LayoutComponentBase

<SLayout AppId="lonsid-iot-admin" ShowBreadcrumbs WhiteUris="_whiteUrls"
        Logo="logo_full.svg"
        MiniLogo="logo_full.svg">
    <MContainer Fluid class="pa-6">
        @Body
    </MContainer>
</SLayout>

修改_Layout.cshtml：

在head标签引入css包

<link href="_content/Masa.Blazor/css/masa-blazor.min.css" rel="stylesheet">
<link href="css/materialdesign/v6.x/css/materialdesignicons.min.css" rel="stylesheet">
<link href="_content/Masa.Stack.Components/css/app.css" rel="stylesheet">
<link href="css/material/icons.css" rel="stylesheet">
<link href="css/fontawesome/v5.15.4/css/all.min.css" rel="stylesheet">
<link href="https://cdn.masastack.com/npm/animate.css/4.1.1/animate.min.css" rel="stylesheet" />
<link href="css/masa-blazor-pro.css" rel="stylesheet" />

在body标签引入js包

<script src="_content/BlazorComponent/js/blazor-component.js"></script>
<script src="js/echarts/5.1.1/echarts.min.js"></script>
<script src="_content/Masa.Stack.Components/js/components.js"></script>
<script src="_content/MASA.Blazor.Experimental.Components/js/experimental.js"></script>

修改App.razor：

替换以下代码

@using Masa.Contrib.Service.Caller.Authentication.Standard;
@inject Masa.Contrib.StackSdks.Caller.TokenProvider TokenProvider

<CascadingAuthenticationState>
    <Microsoft.AspNetCore.Components.Routing.Router AdditionalAssemblies="additionalAssemblies" AppAssembly="@typeof(App).Assembly">
        <Found Context="routeData">
            <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
            <FocusOnNavigate RouteData="@routeData" Selector="h1" />
        </Found>
        <NotFound>
            <PageTitle>Not found</PageTitle>
            <LayoutView Layout="@typeof(MainLayout)">
                <p role="alert">Sorry, there's nothing at this address.</p>
            </LayoutView>
        </NotFound>
    </Microsoft.AspNetCore.Components.Routing.Router>
</CascadingAuthenticationState>

@code {

    private List<Assembly> additionalAssemblies = new();

    public App()
    {
        var masaStackComponentsAssembly = typeof(Masa.Stack.Components.UserCenter).Assembly;
        additionalAssemblies.Add(masaStackComponentsAssembly);
    }

    [Parameter]
    public Masa.Contrib.StackSdks.Caller.TokenProvider InitialState { get; set; } = null!;

    protected override Task OnInitializedAsync()
    {
        TokenProvider.AccessToken = InitialState.AccessToken;
        TokenProvider.RefreshToken = InitialState.RefreshToken;
        TokenProvider.IdToken = InitialState.IdToken;
        return base.OnInitializedAsync();
    }
}

添加PermissionCode.cs常量类：

这里需要把元素的Code码添加为静态变量，供页面检查元素使用

public class PermissionCodes
{

    public readonly static string AppId = "lonsid-iot-admin";

    #region 产品中心

    /// <summary>
    /// 产品管理
    /// </summary>
    public static readonly string Product_List = "0029000200010001";

    /// <summary>
    /// 同步
    /// </summary>
    public static readonly string Synchronize = "00290002000100010001";

    ...
}

实现IPermissionValidator自定义权限校验接口：

创建PermissionValidator.cs继承IPermissionValidator接口

public class PermissionValidator : IPermissionValidator
{
    private readonly IUserContext _userContext;
    private readonly IDistributedCacheClient _distributedCacheClient;
    private readonly ICallerFactory _callerFactory;

    public PermissionValidator(IUserContext userContext, IDistributedCacheClient distributedCacheClient, ICallerFactory callerFactory)
    {
        _userContext = userContext;
        _distributedCacheClient = distributedCacheClient;
        _callerFactory = callerFactory;
    }

    /// <summary>
    /// 元素权限校验方法
    /// </summary>
    public bool Validate(string code, ClaimsPrincipal user)
    {
        try
        {
            var userId = _userContext.GetUserId<Guid>();
            List<string>? permissions = null;

            try
            {
                permissions = _distributedCacheClient.Get<List<string>>(userId.ToString());
            }
            catch (Exception ex)
            {
            }

            if (permissions == null)
            {
                this.GetPermissionsAsync();

                permissions = _distributedCacheClient.Get<List<string>>(userId.ToString());
            }

            return permissions.Any(per => per == code);
        }
        catch (Exception)
        {
            return false;
        }
    }

    /// <summary>
    /// 获取元素权限存到Redis缓存五分钟
    /// </summary>
    public void GetPermissionsAsync()
    {
        var userId = _userContext.GetUserId<Guid>();
        var caller = _callerFactory.Create("masa.contrib.basicability.auth");
        var permissions = Task.Run(async () =>
        {
            var reponse = await caller.GetAsync($"api/permission/element-permissions?appId={PermissionCodes.AppId}&userId={userId}");
            return await reponse.Content.ReadFromJsonAsync<List<string>>();
        }).Result;

        _distributedCacheClient.Set<List<string>>(userId.ToString(), permissions, new CacheEntryOptions()
        {
            AbsoluteExpirationRelativeToNow = TimeSpan.FromMinutes(5),
        });
    }
}

修改Program.cs注入单例

builder.Services.AddScoped<IPermissionValidator, LONSID.IoT.Admin.PermissionValidator>();

使用PermissionView组件实现元素权限控制：

<PermissionView Code="@PermissionCodes.Agent_List_Add">
    <MButton Color="primary" class="ml-6 rounded-lg btn small-btn" OnClick="OnAdd">
         <MIcon Left>mdi-plus</MIcon><span>新增</span>
    </MButton>
</PermissionView>

四、MasaStack服务组件线上K8s环境变量配置

线上环境在目前阶段此项属于必须项

添加资源配置映射：

选择菜单选项依次选择打开资源-> 配置映射->添加配置映射页面

名称：masastack
命名空间：选择项目所在的（如：masa.iot）
点击确定保存
返回上一页，选择刚刚masa.iot命名空间下的masastack ，点击 查看/编辑YAML

//添加data以下参数，并修改一下参数
data:
    ADMIN_PWD: admin123
    CLUSTER: Default

    //根据具体情况修改
    CONNECTIONSTRING: '{"Server": "rm-brds.aliyuncs.com",
        "Port": 3433,"Database":"","UserId": "masastack","Password":"Hzss@123mtack"}'
    DCC_SECRET: masastack.com
    DOMAIN_NAME: lonsid.cn
    ELASTIC: '{"Nodes":["http://masastack-es.masastack:9200"],"Index":"user_dev"}'
    ENVIRONMENT: Production
    IS_DEMO: "false"

    //`服务地址域名前缀`： `pm-server`.lonsid.cn
    MASA_SERVER: '{"pm":{"server":"pm-server"},"dcc":{"server":"dcc-server"},"auth":{"server":"auth-server"},"mc":{"server":"mc-server"},"scheduler":{"server":"scheduler-server","worker":"scheduler-worker"},"tsc":{"server":"tsc-server"},"alert":{"server":"alert-server"}}'

    //`服务地址域名前缀`： pm-ui.lonsid.cn
    MASA_UI: '{"pm":{"ui":"pm-ui"},"dcc":{"ui":"dcc-ui"},"auth":{"ui":"auth-ui","sso":"auth-sso"},"mc":{"ui":"mc-ui"},"scheduler":{"ui":"scheduler-ui"},"tsc":{"ui":"tsc-ui"},"alert":{"ui":"alert-ui"}}'

    //`服务地址域名后缀`： pm-server.`lonsid.cn`
    NAMESPACE: lonsid.cn
    OTLP_URL: http://otel-collector.masastack:4317
    
    //根据具体情况修改
    REDIS: '{"RedisHost": "r-bp1pu2t1ydd4pdkozz.redis.rds.aliyuncs.com", "RedisPort":
        6379, "RedisDb": 9,"RedisPassword": "hzss@123redis"}'
    TLS_NAME: lonsid-cn
    VERSION: 1.0-Preview1

添加资源配置映射：
- 回到服务列表找到项目选择升级
- 打开环境变量卡片，点击添加附加资源
  
  类型选择：Config Map
  源：选择masastack
  键：All
  前缀：空

JZTXT

.net Core MasaStack接入文档（一）

目录

一、PM接入流程

二、Auth接入流程

三、使用MasaAuth全局托管BlazorUI项目

四、MasaStack服务组件线上K8s环境变量配置