一.项目信息

1.项目名称

​ 开发JFinal、Blade、ActFramework集成JustAuthPlus的Demo。

2.方案描述

​ 采用前后端分离实现开发，前端项目基于Vue进行构建项目，后端分别使用JFinal、Blade和ActFramework框架构建项目，开发设计实现集成JustAuthPlus的第三方登录、OAuth登录、OIDC登录和账号密码登录的测试项目。

3.专注领域

​ Dev Tools，登录认证，OAuth，Social，OIDC。

4.技术标签

​ Java，Git，JFinal，Blade，ActFramework，第三方登录，OAuth2，JavaScript，animate，Vue，Axios， ElementUI等。

5.测试方向

​ 支持第三方登录、OAuth登录、OIDC登录、账号密码登录

6.项目主导师及开发者

​ 导师：张亚东（zhyd@fujieid.com）

​ 开发者：吴豪琪（whhwuemail@gmail.com）

7.提示

​ 若测试遇问题，请参考四.帮助。

二.测试准备

1. 第三方登录、OAuth登录、账号密码方式登录方式

1.1 在已经登录Gitee的情况下访问：https://gitee.com/oauth/applications

​ 1.1.1截图

​ 1.2 选择右上角，创建应用。按照Gitee要求填写1.2.1截图信息即可。

• **应用名称：**一般填写自己的网站首页，这里填写的是该项目测试首页。

• **应用描述：**一般填写自己的应用描述即可。

• 应用回调地址：由于是三个框架，这里为每个框架中的其中三个测试目标添加三个回调地址，填写信息如1.2.1截图信息。（建议应用回调地址与1.2.1截图信息保持一致，否则你需要自己去修改后端代码接口）

• **权限：**默认即可。

• **上传Logo：**JPG或者PNG格式，文件大小不超过2M。上传Logo不能为空

​ 1.2.1截图信息

2. OIDC登录方式

​ 由于Gitee没有Open ID Connect 登录方式，因此，这里稍微麻烦的选择了 阿里云OIDC登录。

登录阿里云。

主账号信息：

RAM用户信息

进入访问控制，选择OAuth应用管理，选择“创建应用”。填写以下信息

添加OAuth范围：openid，aliuid，profile

3. 测试说明

到此，前期准备完成。

三.正式测试

1.测试界面简述

1.1 项目启动，初始页面

1.2 选择测试框架，默认是JFinal框架（按照开发顺序）

1.3 开始测试

​ 在后端运行选择的框架项目，前端运行并选择不同的登录方式进行测试即可。其余页面信息可自行运行项目查看。

2.测试方式简述

3.JFinal框架集成JustAuthPlus的demo

3.1 JFinal-第三方登录

3.1.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-social</artifactId>
            <version>1.0.3</version>
</dependency>

3.1.2 测试

• 启动前后端项目，浏览器访问：http://127.0.0.1:8899/。

• 选择 JFInal（页面右上角设置按钮或看 四.帮助 1），点击第三方登录

• 输入你创建应用的clientId、clientSecret以及对应回调地址(social/oauth接口)。如图

  

  点击确认登录，若是第一次登录，则会跳转Gitee授权界面，点击授权后，可页面和后端控制台均会显示用户相关信息。

  测试结果：

  页面信息截图：

  后台信息截图：

  

  获取的信息，是通过后端操作gitee的用户接口拿到，属于你自己的Gitee账号信息。

3.2 JFinal-OAuth登录

3.2.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-oauth2</artifactId>
            <version>1.0.2</version>
</dependency>

点击OAuth登录

3.2.2 选择authorization code模式

​

• 输入你创建应用的clientId、clientSecret以及对应回调地址(oauth/code接口)。

• 确认登录

  

  测试结果：

3.2.3 选择password credentials模式

准备：

在前端项目中添加测试对应组件：如306 307 308行号所示。另外两个（Blade、ActFramework测试相同）

• 输入Gitee的登录账号和密码
• 确认登录

测试结果：

3.3 JFinal-账号密码登录

3.3.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-simple</artifactId>
            <version>1.0.1-alpha.1</version>
</dependency>

3.3.2 测试

该模式的账号密码选择后端项目静态数据库中所存储的账号密码： 输入账号：jap1 密码： jap1

​

测试结果：

3.4 JFinal-OIDC登录

3.4.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-oidc</artifactId>
            <version>1.0.1</version>
</dependency>

3.4.2 测试

• 输入在 二.测试准备时，阿里云访问控制的自己创建的第三方应用的AppId和已经保存的应用秘钥

  示例截图：

  

• 点击确认登录，若没有登录阿里云，会跳转登录页面进行确认授权。

  注：第一次授权登录，请使用主账号登录。需要使用RAM用户登录，请先创建RAM角色并提供对应权限。

  测试结果：

  主账号：

  

  ​

​ RAM账号登录：

4.Blade框架集成JustAuthPlus的demo

4.1 Balde-第三方登录

4.1.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-social</artifactId>
            <version>1.0.3</version>
</dependency>

4.1.2 测试

• 启动前后端项目，浏览器访问：http://127.0.0.1:8899/。

• 选择 Blade（页面右上角设置按钮或看 四.帮助 1），点击第三方登录

  

• 输入你创建应用的clientId、clientSecret以及对应回调地址(social/oauth接口)。注意此时回调地址的IP地址不同。如图

  

  测试结果

  

  

4.2 Balde-OAuth登录

4.2.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-social</artifactId>
            <version>1.0.3</version>
</dependency>

点击OAuth登录

4.2.2 选择authorization code模式

• ​ 输入你创建应用的clientId、clientSecret以及对应回调地址(oauth/code接口)。

• 确认登录

测试结果

4.2.3 选择password credentials模式

准备： 见3.2.2 选择password credentials模式

​ 输入你自己的Gitee账号和密码

• 确认登录

4.3 Balde-账号密码登录

4.3.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-simple</artifactId>
            <version>1.0.1-alpha.1</version>
</dependency>

该模式的账号密码选择后端项目静态数据库中所存储的账号密码： 输入账号：jap2 密码： jap2

4.3.2 测试

测试结果

4.4 Balde-OIDC登录

4.4.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-oidc</artifactId>
            <version>1.0.1</version>
</dependency>

4.4.2 测试

• 输入在 二.测试准备时，阿里云访问控制的自己创建的第三方应用的AppId和已经保存的应用秘钥

  截图如下：

  测试结果

  主账号

  

5.ActFramework框架集成JustAuthPlus的demo

5.1 ActFramework-第三方登录

5.1.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-social</artifactId>
            <version>1.0.3</version>
</dependency>

5.1.2 测试

• 启动前后端项目，浏览器访问：http://127.0.0.1:8899/。

• 选择 ActFramework（页面右上角设置按钮或看 四.帮助 1），点击第三方登录

• 输入你创建应用的clientId、clientSecret以及对应回调地址(social/oauth接口)。如图

  

  测试结果

  

  

5.2 ActFramework-OAuth登录

5.2.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-social</artifactId>
            <version>1.0.3</version>
</dependency>

5.2.2 选择authorization code模式

• 输入你创建应用的clientId、clientSecret以及对应回调地址(oauth/code接口)。

  

• 确认登录

  测试结果

  

  

5.2.3 选择password credentials模式

• 输入你自己的Gitee账号和密码

  准备： 见3.2.2 选择password credentials模式

  

  测试结果

  

  

​

5.3 ActFramework-账号密码登录

5.3.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-simple</artifactId>
            <version>1.0.1-alpha.1</version>
</dependency>

5.3.2 测试

该模式的账号密码选择后端项目静态数据库中所存储的账号密码： 输入账号：jap3 密码： jap3

测试结果

5.4 ActFramework-OIDC登录

5.4.1 引入依赖

<dependency>
            <groupId>com.fujieid</groupId>
            <artifactId>jap-oidc</artifactId>
            <version>1.0.1</version>
</dependency>

5.4.2 测试

• 输入在 二.测试准备时，阿里云访问控制的自己创建的第三方应用的AppId和已经保存的应用秘钥

  示例截图：

  

  主账号登录：

  

  

  RAM账号登录：

  

  

四.帮助

1.前端

当需要测试除开JFinal框架外的项目，而又觉得每次测试需要频繁更换选择目标项目，可在前端项目的IndexMain.vue中，手动更改参数isShow的值（默认值为1）。如：

1.1 前端页面其他功能描述

• 页面首页左上角，可直接前往JustAuthPlus 社区官网，可学习并了解JAP、JustAuth详细信息。
• 另外三个框架，此次添加了简要说明和框架功能简要概述。若想了解具体信息，可点击框架简介，前往对应官网或者仓库使用文档学习更多内容。

• 各个登录框或者对话框，均特别添加了该框架下功能的简要介绍和其他具有参考性的链接。

• 所有页面元素，均实现了动画动作。

2.后端

2.1 注释部分

​ 后端项目各个测试实现代码，各个测试模块和功能，均已添加注释，可自行调试程序和参考。

2.2 项目运行

​ 由于此次项目分为一个前端（http://127.0.0.1:8899/），三个后端项目（http://127.0.0.1:8091/，http://127.0.0.1:8092/，http://127.0.0.1:8093/）。因此，项目运行，请务必保证，这四个端口出于未被占有的状态，且前端项目一直出于运行状态。

​ 当某个功能完成测试后，继续下一个功能进行测试，若遇显示数据为null或者其他异常问题，请重新启动该项目。建议每完成一个功能测试后，重启项目运行。

3.其他

由于作者能力有限，若存在不严谨的问题，望谅解。

​