从壹开始 [ Ids4实战 ] 之七 ║ 客户端、服务端、授权中心全线打通

简介: 从壹开始 [ Ids4实战 ] 之七 ║ 客户端、服务端、授权中心全线打通

一、Blog.Admin 客户端

Admin项目,是基于Vue+Ele开发的一套后端权限框架,是我自主研发的,里边主要是用到了动态数据库授权认证,使用JWT的复杂策略授权技术,精确到按钮基本,目前部门数据权限还在设计当中,以后也会附加上,这是内部授权这一块,但是认证想做一个统一认证中心,所以就想到了IdentityServer4了。

Vue项目和其他的SPA项目是一样的,连接IdentityServer4认证中心,主要是通过oidc-client这个插件来处理的,

npm install oidc-client --save

用法其实很简单,我简单说下思路,具体的看我的代码,或者看官网都可以:

class ApplicationUserManager extends UserManager {
  constructor () {
    super({
      authority: 'http://ids.neters.club',
      client_id: 'blogadminjs',
      redirect_uri: 'http://vueadmin.neters.club/callback',
      response_type: 'id_token token',
      scope: 'openid profile roles blog.core.api',
      post_logout_redirect_uri: 'http://vueadmin.neters.club'
    })
  }

这个是核心方法,目的是通过配置,实现用户管理,比如登录,跳转,回调,获取用户信息,令牌token,刷新等等,当然以后可能会配合单点登录做处理。

methods: {
    async refreshUserInfo() {
      const user = await applicationUserManager.getUser();
      if (user) {
        this.user.name = user.profile.name;
        this.user.isAuthenticated = true;
      } else {
        this.user.name = "";
        this.user.isAuthenticated = false;
      }
    }
  }

这个是使用上边的UserManager来处理远程获取到的用户数据。

具体的代码我已经放到了Blog.Admin项目的ids4分支下了:

二、Blog.Core 资源服务端

这个项目想必都知道了,不多说什么,其实你的任意一个后端服务项目都可以,只要做个表结构,然后配置Identityserver4的认证即可。

//2.2【认证】、IdentityServer4 认证 (暂时忽略)
services.AddAuthentication("Bearer")
  .AddIdentityServerAuthentication(options =>
  {
      options.Authority = "http://ids.neters.club";
      options.RequireHttpsMetadata = false;
      options.ApiName = "blog.core.api";
  });

这个就是一个核心的代码,将我们BlogCore的资源服务器认证方式,从JWT改成Ids4认证

修改完认证方式以后,下边就是简单的对其中几个小知识点进行微调了,比如某些Claim声明字段,我用的和Ids4不太一样,所以就简单微调一下,主要的修改内容,我也新建了一个分支,可以自行查看下,修改的地方不多。

三、Blog.Idp 认证授权中心

这个才是整个项目的重头戏,项目的重中之重,不过配置起来也不难,具体的操作和使用,我也在录视频和写文章,其实只要了解这几个知识点,就基本学会了Ids4了:

1、如何引用指定的nuget包;

2、JWT、OpenID、OAuth2、OIDC 四者的关系和内容;

3、常见的四种授权方式:简化、混合、密码、客户端等要明白场景,会用;

4、学会联调;

具体的就不多说了,不是今天的讲解内容。今天主要点一下部署的时候的几个知识点,其他的看我的代码即可,这次是master分支。

// 使用证书,可以直接使用开发证书
builder.AddDeveloperSigningCredential();
// 或者自己配置
.AddDeveloperSigningCredential(true, ConstanceHelper.AppSettings.CredentialFileName)
.AddSigningCredential(new X509Certificate2(Path.Combine(Environment.WebRootPath,
        Configuration["Certificates:Path"]),
        Configuration["Certificates:Password"]))
证书这个很重要,当然既然是安全,就要好好处理,可以配合的证书,继续搞搞HTTPS安全协议,未来还是很多要处理的。
new Client {
     ClientId = "blogadminjs",
     ClientName = "Blog.Admin JavaScript Client",
     AllowedGrantTypes = GrantTypes.Implicit,
     AllowAccessTokensViaBrowser = true,
     RedirectUris =           { "http://vueadmin.neters.club/callback" },
     PostLogoutRedirectUris = { "http://vueadmin.neters.club" },
     AllowedCorsOrigins =     { "http://vueadmin.neters.club" },
     AllowedScopes = {
         IdentityServerConstants.StandardScopes.OpenId,
         IdentityServerConstants.StandardScopes.Profile,
         "roles",
         "blog.core.api"
     }
 }

这是另一个重点,必须要配置客户端,不仅是数据生成到数据库,更是在授权的时候,起到安全的作用。

最后一个小问题,确定是我自己的问题,就是部署的时候,我本来用的Nginx进行代理,但是配置文件里,却依然是localhost:

这样就导致了一个问题,虽然我的认证中心项目可以正常的跑,我是说服务器生产环境,但是用客户端去登录的时候,会自动跑到locaohost里,毕竟配置文件是这样的。

网上找了很多资料,都是本地教程,部署的都很少,我也是很方,最后我找到了官方的一个在线demo项目,它是正常的,我仔细研究了下代码,代码和我的没啥区别,最后灵机一动,我看了看他们的服务器,是IIS!我赶紧实验了一番,还真的是正常了:

但是这个不科学呀,这个我要承认下,肯定是我学艺不精,Nginx肯定是可行的,但是我没有找到为何去配置,这个时候应该查看官网的,当我继续在寻找的时候,但是正好有一个小伙伴的小伙伴告诉了我,贼简单,这个故事告诉我们,学习知识要从细节着手,不能知其然而不知其所以然。

var builder = services.AddIdentityServer(options =>     {         options.Events.RaiseErrorEvents = true;         options.Events.RaiseInformationEvents = true;         options.Events.RaiseFailureEvents = true;         options.Events.RaiseSuccessEvents = true;         options.IssuerUri = "http://ids.neters.club";// 就是这里         options.PublicOrigin = "http://ids.neters.club";     })

结果还是正确的,看来还是要多读文档,当然如果实在是绕不过来,也可以先求助。

就这样,元旦一整天就过去了,项目也终于放上去了,当然还有很多要优化的,比如如何在Nginx部署IdentityServer的时候配置HTTPS协议,既然开始了,便只顾风雨兼程了。

四、下一步 2020

今年开始,一切都是新的,第一个闭环已经完成了,当然还有很多需要优化,比如单点登录,DDD和Blog项目也迁移到Ids4上来,那下一个就开始了 —— CI/CD DevOps 我来了。

https://github.com/anjoy8/Blog.IdentityServer(授权)

https://github.com/anjoy8/Blog.Admin(客户端)

https://github.com/anjoy8/Blog.Core(资源服务器)

相关文章
|
2月前
|
运维 监控 开发工具
应用研发平台EMAS常见问题之用阿里的deviceId离线就收不到信息如何解决
应用研发平台EMAS(Enterprise Mobile Application Service)是阿里云提供的一个全栈移动应用开发平台,集成了应用开发、测试、部署、监控和运营服务;本合集旨在总结EMAS产品在应用开发和运维过程中的常见问题及解决方案,助力开发者和企业高效解决技术难题,加速移动应用的上线和稳定运行。
|
7天前
|
JavaScript 数据管理 API
从壹开始 [ Ids4实战 ] 之五 ║ 多项目集成统一认证中心的思考
从壹开始 [ Ids4实战 ] 之五 ║ 多项目集成统一认证中心的思考
|
2月前
|
缓存 运维 监控
应用研发平台EMAS 常见问题之用华为的推送界面阿里云收不到如何解决
应用研发平台EMAS(Enterprise Mobile Application Service)是阿里云提供的一个全栈移动应用开发平台,集成了应用开发、测试、部署、监控和运营服务;本合集旨在总结EMAS产品在应用开发和运维过程中的常见问题及解决方案,助力开发者和企业高效解决技术难题,加速移动应用的上线和稳定运行。
545 2
|
2月前
|
运维 监控 网络安全
应用研发平台EMAS产品常见问题之小米辅助通道注册失败如何解决
应用研发平台EMAS(Enterprise Mobile Application Service)是阿里云提供的一个全栈移动应用开发平台,集成了应用开发、测试、部署、监控和运营服务;本合集旨在总结EMAS产品在应用开发和运维过程中的常见问题及解决方案,助力开发者和企业高效解决技术难题,加速移动应用的上线和稳定运行。
|
安全 数据管理 API
国王小组:交易所搭建|API网关的API架构
一、何为API网关? APIGateway 即API网关,所有请求首先会经过这个网关,然后到达后端服务,有点类似于Facade模式。API网关作为系统接口对外的统一出口,可以减少调用方对服务实现的感知。 没有API网关时的系统结构如下图1:由图可以看出,在没有API网关作为统一出口的情况下,需要调用方自己组合各种服务,而且容易让调用方感知后端各种服务的存在。
国王小组:交易所搭建|API网关的API架构
|
数据可视化 机器人 API
DingTalk「开发者说」钉钉连接平台,企业自建场景下如何实现系统互通
钉钉连接平台通过简单的低代码配置,帮助企业迅捷实现系统集成和连接,降低集成实施的周期和成本。本文主要介绍在企业自建场景下,如何使用连接平台的连接流实现系统互通,包括三个案例分享:1. 会议室预定后发送机器人通知;2. 企业报警信息通过机器人发送到群;3. 销帮帮新增客户同步到企业内部系统。
1560 0
DingTalk「开发者说」钉钉连接平台,企业自建场景下如何实现系统互通
|
JSON 物联网 数据处理
阿里云物联网.NETCore客户端|CZGL AliloTClient:7.服务调用
阿里云物联网.NETCore客户端|CZGL AliloTClient:7.服务调用
294 0
阿里云物联网.NETCore客户端|CZGL AliloTClient:7.服务调用
|
数据可视化 物联网 数据挖掘
阿里云物联网NETCore客户站瑞CZGL.AliloTClient:4.1 上报位置信息
阿里云物联网NETCore客户站瑞CZGL.AliloTClient:4.1 上报位置信息
155 0
阿里云物联网NETCore客户站瑞CZGL.AliloTClient:4.1 上报位置信息
|
移动开发
秒懂云通信:号码认证H5 JSSDK版本全新上线
云通信号码认证可以一键加速改善APP用户登录体验,已经成为当下很多APP的主流选择。阿里云号码认证服务H5 JSSDK版本全新上线,可以在手机打开数据流量的情况下,校验用户输入H5页面的手机号码跟当前手机SIM流量卡是否一致,确保输入手机号为机主本人,免输入短信验证码,提升用户体验和注册转化。
1081 0
秒懂云通信:号码认证H5 JSSDK版本全新上线
|
物联网 API
手把手学IOT服务端API编程[16、查询设备影子]|MVP讲堂
本教程旨在介绍服务器端的API编程接口,基于php脚本的sdk,希望对物联网服务器端有编程需求的有所帮助。阿里云MVP手把手教你!有演示视频,千万别错过!
1724 0

热门文章

最新文章