前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >ASP.NET Core分布式项目实战(Consent视图制作)--学习笔记

ASP.NET Core分布式项目实战(Consent视图制作)--学习笔记

作者头像
郑子铭
发布2021-01-13 15:38:03
4400
发布2021-01-13 15:38:03
举报

任务19:Consent视图制作

按照上一节 Consent 的思路

在 mvcCookieAuthSample 项目的 Controllers 文件夹下新建一个 ConsentController

在 Views 文件夹下新建一个 Consent 文件夹,然后在该文件夹下新建一个 Index 视图

在 ViewModels 文件夹下新建一个 ConsentViewModel

在 ViewModels 文件夹下新建一个 ScopeViewModel

ScopeViewModel.cs
代码语言:javascript
复制
namespace mvcCookieAuthSample.ViewModels
{
    public class ScopeViewModel
    {
        public string Name { get; set; }
        public string DisplayName { get; set; }
        public string Description { get; set; }
        public string Emphasize { get; set; }
        public string Required { get; set; }
        public bool Checked { get; set; }
    }
}

这个定义来自于 IdentityServer4 官方文档中 Identity Resource 和 API Resource 的模型 https://identityserver4.readthedocs.io/en/latest/reference/identity_resource.html

ConsentViewModel.cs
代码语言:javascript
复制
namespace mvcCookieAuthSample.ViewModels
{
    public class ConsentViewModel
    {
        public string ClientId { get; set; }
        public string ClientName { get; set; }
        public string ClientLogoUrl { get; set; }

        /// <summary>
        /// 是否允许第二次登录不需要再次授权
        /// </summary>
        public bool AllowRemeberConsent { get; set; }

        // 对两种用户分别做出选择
        public IEnumerable<ScopeViewModel> IdentityScopes { get; set; }
        public IEnumerable<ScopeViewModel> ResourceScopes { get; set; }
    }
}

接下来需要把两个 ViewModel 的信息显示在 Index 里面,实现类似微博授权页面

_ScopeListitem.cshtml
代码语言:javascript
复制
@using mvcCookieAuthSample.ViewModels;
@model ScopeViewModel

<li>

</li>
Index.cshtml
代码语言:javascript
复制
@using mvcCookieAuthSample.ViewModels;
@model ConsentViewModel

<p>Consent Page</p>
<div class="row page-header">
    <div class="col-sm-10">
        @if (string.IsNullOrWhiteSpace(Model.ClientLogoUrl))
        {
            <div><img src="@Model.ClientLogoUrl"/></div>
        }

        <h1>
            @Model.ClientName
            <small>希望使用您的账户</small>
        </h1>
    </div>
</div>

<div class="row">
    <div class="col-sm-8">
        <form asp-action="Index">

            @if (Model.IdentityScopes.Any())
            {
                <ul class="list-group">
                    @foreach (var scope in Model.IdentityScopes)
                    {
                        @Html.Partial("_ScopeListitem", scope)
                    }
                </ul>
            }

            @if (Model.ResourceScopes.Any())
            {
                <ul class="list-group">
                    @foreach (var scope in Model.IdentityScopes)
                    {
                        @Html.Partial("_ScopeListitem", scope)
                    }
                </ul>
            }
        </form>
    </div>
</div>

上半部分展示图标和提示,下半部分分为三部分,分别列出 IdentityScopes 和 ResourceScopes,以及选择是否记住,最后实现授权

课程链接

http://video.jessetalk.cn/course/explore

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-05-13,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 DotNet NB 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 任务19:Consent视图制作
    • ScopeViewModel.cs
      • ConsentViewModel.cs
        • _ScopeListitem.cshtml
          • Index.cshtml
          • 课程链接
          领券
          问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档