ABP VNext 使用 Vue 客户端 odic 登录配置 identityserver4


折腾很久,最后无意间试出来vue客户端通过odic跳转登录并返回vue客户端,记录以资与我一样的菜鸟。

1、后端是从ABP VNEXT 官网生成的模板项目,MVC项目和Angular项目都可以。后端项目进行数据迁移后无需做任何更改。

2、vue客户端的建立就不说了。

3、npm install odic-client。在vue目录中cmd执行这条语句。

4、建立一个ts文件,代码如下

import OidcClient from "oidc-client" var config={   authority: "https://localhost:44385",   client_id: "LearningMVC_App",   redirect_uri: "http://localhost:4200",   response_type: "code",   scope: "offline_access openid profile role email phone LearningMVC",   post_logout_redirect_uri: "http://localhost:4200" } var odic=new OidcClient.UserManager(config); export default odic;

至此就可以了。说明一下上述代码,上述代码是仿照Angular的配置的,无法配置成其他的,会报错无法成功导航到identityserver4。

之所以必须配置成上述那样是因为,模板项目在数据库中已经存了相关的配置,配置表是下面这些,我没有深究,可以加入其他的配置。