原创

JustAuth发布1.10.0版本，集成华为和企业微信登录，更加灵活的state缓存

温馨提示：
本文最后更新于 2021年08月13日，已超过 1,231 天没有更新。若文章内的图片失效（无法正常加载），请留言反馈或直接联系我。

JustAuth发布1.10.0版本，集成华为和企业微信登录，更加灵活的state缓存

更新内容

新增

  • 增加AuthCache配置类AuthCacheConfig.java，可以自定义缓存有效期以及是否开启定时任务
  • 简单封装极简版的针对JustAuth的Log工具类
  • 集成华为登录
  • 集成企业微信

    修改

  • 抽取 cache 接口，方便用户自行集成 cache
  • 修改AuthChecker#checkCode方法，对于不同平台使用不同参数接受code的情况统一做处理
  • 添加StringUtil单元测试，修复bug

    删除

  • 去掉slf4j依赖，

    其他

  • 规范测试类

集成华为授权登录

一、注册并登录

注册并登录华为开发者联盟官网:http://developer.huawei.com/consumer/cn
image

二、申请开发者认证

点击右上角“管理中心”，如果你是第一次注册登录华为开发者平台，那么需要先进行账号认证
请自行操作。
注：如果你是新用户，那么可能注册完成后就会要求你认证，页面如下：

image

选择“个人开发者”认证，接下来会让你选择认证方式，
image

我选择的“支付宝扫码认证”，这种方式确实十分快，几分钟就完事了（PS：“身份证人工审核认证 ”这种认证方式，本人没用，所以不知道具体的认证时间）。

三、创建应用

认证完成后，重新进入管理中心:https://developer.huawei.com/consumer/cn/console#/serviceCards/
image
这个“开发者联盟使用向导”可以视个人情况选择关闭，接下来就是重点了，如果不想走弯路，一定要仔细按照教程步骤来做，当时我就折腾了老大会才搞明白。

首先，我一开始创建应用的时候是按照官网教程:https://developer.huawei.com/consumer/cn/devservice/doc/31107操作的，官网教程中说的是创建“免安装/H5应用”，
image
image
但是我在实际操作的时候，并没有看到这个选项
image

当时我还以为是华为的网站更新而文档没有更新，所以专门去提了工单
image

后来才得知是“开通了白名单才能申请“免安装/H5应用”，个人开发者一般是无法申请的”。

那么，难道个人开发者就没法用了吗？当然不是，要不也不会有这篇教程了......

当时我根据网站上列出的这几种应用类型，挨个点了一遍，大致浏览了以下各类型应用需要的参数，也不知道是因为心有灵犀还是因为别的原因，当时自己选来选去，最终选了一个“服务器应用”，奔着试试看的想法，大不了换种类型重新试。

选定应用类型后，根据提示，需要先创建产品
image
点击“创建产品”按钮后会弹出窗口，按照提示填入相应内容即可：
image

创建完产品后，会弹出提示框告知产品的appid和secret，记得先保存起来。

最终创建完成后的应用内容如下

image

四、对接SDK完成授权登录

参考开放平台鉴权:https://developer.huawei.com/consumer/cn/devservice/doc/30101文档说明，获取授权链接，然后拿授权code换取accessToken。

4.1 获取授权链接

根据文档说明，我们拼装一下授权地址：

https://oauth-login.cloud.huawei.com/oauth2/v2/authorize?response_type=code&client_id=[创建产品时给的appid]&redirect_uri=[上面填的回调地址]&access_type=offline&scope=https%3A%2F%2Fwww.huawei.com%2Fauth%2Faccount%2Fbase.profile

浏览器直接访问这个地址，就会跳转到华为的授权登录页面

image

点击“授权并登录”后，就会跳转到我们配置的“回调地址”中，并附带一个authorization_code参数（注，因为我们生成授权链接的时候没有带state参数，所以回调中也就没有这个参数）。

4.2 使用code获取accessToken

根据文档说明，我们编写以下代码获取token：

String code = "上一步获取的authorization_code";
HttpResponse response = HttpRequest.post("https://oauth-login.cloud.huawei.com/oauth2/v2/token")
    .form("grant_type", "authorization_code")
    .form("code", code)
    .form("client_id", "[创建产品时给的appid]")
    .form("client_secret", "[创建产品时给的secret]")
    .form("redirect_uri", "[上面填的回调地址]")
    .execute();
System.out.println(response.body());

请求成功后会返回以下内容

{
    "access_token": "accessToken",
    "expires_in": 3600,
    "refresh_token": "refreshToken",
    "scope": "https:\/\/www.huawei.com\/auth\/account\/base.profile",
    "token_type": "Bearer"
}

4.3 使用accessToken获取用户信息

到这一步又是一个麻烦，因为开放平台鉴权:https://developer.huawei.com/consumer/cn/devservice/doc/30101文档中只有获取授权地址和获取accessToken以及刷新token的api，但是并没有获取用户信息的接口说明，我翻遍了华为的api文档，也没有找到相关的信息（可能是我比较菜，没找到藏哪儿了）。当然， 这是难不倒我们的。

有朋友会问，官网都没提供文档说明，你怎么能搞出来？ （蜜汁微笑~~(￣▽￣)"）

虽然官网没有这方便的api，但是我在他官网发现了另一份SDK：华为开放平台JavaScript SDK:https://developer.huawei.com/consumer/cn/devservice/doc/30104，既然js能实现，那么我们可以从这儿入手，把sdk下载下来，研究一下他的jssdk怎么实现的，然后想办法翻译成Java语言。

SDK下载来后直接解压，是一个web工程，目录结构如下（已隐去非必要的文件）：

.
|-- WebContent
|   |-- WEB-INF
|   |   |           `-- lib
|   |   |           `-- fastjson-1.1.32.jar
|   |   `-- web.xml
|   |-- handleTransit.html
|   |-- index.html
|   `-- js
|       |-- NspClient.js
|       `-- jquery-1.10.2.js
`-- src
    `-- com
        `-- huawei
            `-- demo
                |-- GetAccessToken.java
                `-- HttpUtil.java

其中的java代码，我们可以直接忽略，没什么用。我们主要关注这三个文件：

  • NspClient.js 核心js代码，负责发送api请求
  • index.html 首页，负责演示授权登录
  • handleTransit.html 使用authorization_code获取token的，并把token存到cookie中，然后跳转刷新页面。

在源码中，我注意到在index.html中有一段代码：

var option = {
    respontype : "code",
    appid:"",
    handle_login_uri:"http://ip:port/NSPClient/handleTransit.html"
}

var nspp = new NspClient(option);

nspp.checkLogin(function() {
    // 调用接口
    nspp.api('OpenUP.User.getInfo', {
        callback : function(data) {
            if (!!data) {
                alert("userName:" + data.userName + ",userID:" + data.userID)
            }
        },
        onError : function(err) {
            if (!!err) {
                alert("error");
            }
        }
    });
});

根据代码字面意思，可以猜到，这个就是获取用户信息的接口，不过这儿有一点疑问：正常的oauth授权流程中，获取用户信息，必然会用到accesstoken，但是这里面却没有显示引用token的地方，考虑handleTransit.html文件中有把token存cookie的操作，所以在这儿看来引用token的操作应该是被封装到NspClient.js中。下一步我们就以nspp.api('OpenUP.User.getInfo', {})为入口，阅读NspClient.js的源码实现。

nspp.api()源码如下（by zhyd xx开头的是我添加的注释，方便各位理解）：

/**
 * api请求（向后台发请求的公共方法）
 *
 * @param name =
 *            api名称
 * @param Settings={
 *            param:{json格式参数}, dataType:
 *            ’POST/GET/JSONP/XPOST(同POST)’,callback:回调方法 }
 *
 * @desc JSONP方式采用JS方式调用网关，其它方式通过JSON方式
 */
NspClient.prototype.api = function (name, settings, apiUrl) {
    var self = this;
    // by zhyd 通过阅读下面的代码，发现这才是真正的请求api的地址，源码分析见下面【关于`url`】
    var url = this.url;
    var API = {}, paramData;
    paramData = settings.param;

    // 调用测试桩时使用
    // by zhyd 在`index.html`页面中，调用`nspp.api()`时，只传入了name和settings，并没有传入apiUrl，所以这个if代码块并不会执行，里面的内容我们直接忽略。
    if (apiUrl) {
        if (window.console) {
            window.console.warn('正在使用测试桩，接口名为:' + name);
        }
        url = apiUrl;
        if (settings.dataType === 'XPOST') {
            settings.dataType = 'JSONP';
        }
    }
    // by zhyd 入参settings中并没有传入param，所以这个for循环代码块也不会执行，里面的内容我们直接忽略。
    for (var i in paramData) {
        if (typeof paramData[i] === 'object') {
            paramData[i] = NSPHelper.jsonToString(paramData[i]);
        }
        API[i] = paramData[i];
    }

    //            if (!apiUrl && name && name.indexOf("OpenOther.System") < 0) {
    //                name = "OpenOther.Delegate." + name.replace(new RegExp("\\.", "g"), "_");
    //            }

    // by zhyd 关键！指定调用的api名称
    API.nsp_svc = name;

    var type = 'JSONP';
    // by zhyd 入参未传入dataType，所以type一定等于'JSONP'，下面的switch代码块，我们直接看case 'JSONP'下的即可。
    if (!!settings.dataType) {
        type = settings.dataType;
    }
    switch (type) {
        case 'JSONP':
            // 通过JSONP方式请求api【关于`getJSONP`】
            this.getJSONP(url, API, settings.callback, settings.onError);
            break;
        case 'XPOST':
            NspClient.xdr.send(url, "POST", API, settings.callback,
                settings.error);
            break;
        case 'POST':
        case 'GET':
        case 'post':
        case 'get':
            NspClient.xdr.send(url, settings.dataType, API,
                settings.callback, settings.error);
            break;
        default:
            this.getJSONP(url, API, settings.callback, settings.onError);
    }

};

ok，上面api的代码已经大致理解了，关键部分就那几处，分开解释。

  • 关于url

这个url是在创建NspClient时指定的，源码如下：

/**
 * NspClient Class
 *
 * @param {obj}
 *            option为类似如下配置参数: { appid: 开发平台在OpenGw的对应应用id ,
 *            access_token:xxx, debug:xxx }
 */
var NspClient = function (option) {
    this.handleLoginUri = option && option.handle_login_uri ? option.handle_login_uri
        : nspClientCfg.handle_login_uri;
    // 登录成功后，保存登录状态页面
    // by zhyd 这儿指定
    this.url = nspClientCfg.opengw_api_url;// OpenGw API接口地址
    this.loginUrl = nspClientCfg.login_url;// 登录页面地址
    this.urlGetToken = nspClientCfg.get_token_url;// 应用级API前获取token的接口地址
    this.authApi = 'open.auth.check';
    this.appid = option && option.appid ? option.appid
        : nspClientCfg.app_id;// 开发者联盟的appid
    this.secret = option && option.secret ? option.secret
        : nspClientCfg.serect;
    this.access_token = option && option.access_token ? option.access_token
        : '';
    this.respontype = option && option.respontype ? option.respontype
        : nspClientCfg.respontype;
};

我们再看nspClientCfg.opengw_api_url的内容

var gwAccess = {
    opengw_api_url: "https://api.vmall.com/rest.php",// OpenGw  API接口地址
    opengw_cross_url: "https://api.vmall.com/nspcross.html",
    login_url: "https://login.vmall.com/oauth2/authorize",// 登录页面地址
    get_token_url: "https://login.vmall.com/oauth2/token",// 应用级API前获取token的接口地址
    xdr_proxy_url: "/",
    respontype: "token"
};

到这儿我们就明白了，实际的获取用户的api接口是https://api.vmall.com/rest.php。

  • 关于getJSONP

源码如下

/**
 * 组装数据,发送jsonp请求
 *
 * @param {string}
 *            url 请求地址
 * @param {object}
 *            data 请求数据
 * @param {function}
 *            callback 成功回调函数
 * @return undefined
 */
NspClient.prototype.getJSONP = function (url, data, callback, onError) {
    var self = this;
    // by zhyd api请求参数，表示当前时间戳
    data.nsp_ts = new Date().getTime();
    // by zhyd 在这儿传入的token
    if (!data.access_token) {
        data.access_token = encodeURIComponent(this.access_token ? this.access_token
            : NSPHelper.getCookie('access_token'));
    }
    // by zhyd 下面这两个也是api请求参数，fmt表示是js请求，cb代表JSONP回调方法的名称
    data.nsp_fmt = 'JS';
    data.nsp_cb = '_jqjsp';

    /*
     * 使用jquery的jsonp可以简化代码，减少代码量，但无法获得nsp_status,暂时搁浅 $.ajax({ url :
     * url, data : data, dataType : "jsonp", jsonp : 'nsp_cb', success :
     * function(data, textStatus, jqXHR) { }, error : function(e) { if
     * (typeof onError == 'function') { onError(e); } else { if
     * (window.console) { console.warn("request failed!"); } } } });
     */
    ajax({
        url: url,
        data: data,
        dataType: "jsonp",
        // jsonpCallback:"_jqjsp",
        timeout: 30000,
        callbackParameter: "nsp_cb",
        success: function (data, nsp_status) {
            // by zhyd 这儿的回调处理我们直接忽略
        },
        error: function (e) {
            // by zhyd 这儿的异常处理我们直接忽略
        }
    });
};

ok，到这一步，我们算是全部理解了华为javascript sdk的获取用户信息的api操作流程，也正如上面猜的， accessToken就是在js内部做的处理。

那么接下来，我们就需要将这些代码整理翻译成java语言

 HttpResponse response = HttpRequest.post("https://api.vmall.com/rest.php")
    .form("nsp_ts", System.currentTimeMillis())
    .form("access_token", ["4.2 使用code获取accessToken"中获取的token])
    .form("nsp_fmt", "JS")
    .form("nsp_cb", "_jqjsp")
    .form("nsp_svc", "OpenUP.User.getInfo")
    .execute();
System.out.println(response.body());

打印结果为：

_jqjsp({"gender":1,"headPictureURL":"xxx","languageCode":"zh-CN","userID":"xxx","userName":"xxx","userState":1,"userValidStatus":1}, 0)

典型的JSONP格式，那么有没有办法去掉这个_jqjsp()？如果不去掉，我们还需要手动处理这些东西，才能得到一个真正的json内容，那么我们就尝试以下，还记得上面说的("nsp_cb", "_jqjsp")这个就是指定的callback的方法，那么我们直接去掉这个参数，试试行不行

image

果然！ 不得不说：WHNB!

五、通过JustAuth集成华为授权登录

参考JustAuth官方文档：https://docs.justauth.whnb.wang，根据快速开始的说明，我们需要引入依赖：

<dependency>
  <groupId>me.zhyd.oauth</groupId>
  <artifactId>JustAuth</artifactId>
  <version>1.10.0</version>
</dependency>

然后通过以下方式调用api进行授权

// 创建授权request
AuthRequest authRequest = new AuthGiteeRequest(AuthConfig.builder()
      .clientId("clientId")
      .clientSecret("clientSecret")
      .redirectUri("redirectUri")
      .build());
// 生成授权页面
authRequest.authorize();
// 授权登录后会返回code（auth_code（仅限支付宝））、state，1.8.0版本后，可以用AuthCallback类作为回调接口的参数
// 注：JustAuth默认保存state的时效为3分钟，3分钟内未使用则会自动清除过期的state
authRequest.login(callback);

当然，项目是有配套demo的，可以直接使用https://gitee.com/yadong.zhang/JustAuth-demo这个demo项目进行测试。

clone下来项目后，在RestAuthController#getAuthRequest(String)方法中找到case "huawei":，然后将上面我们申请应用时的那三个属性（appid,secret,redirectUri）配置到代码中：

case "huawei":
    authRequest = new AuthHuaweiRequest(AuthConfig.builder()
            .clientId("[创建产品时提供的appid]")
            .clientSecret("[创建产品时提供的secret]")
            .redirectUri("[上面配置的回调地址]")
            .build());
    break;

注，JustAuth-demo项目中的controller方法比较规范，是根据source（平台名）区别的具体执行request，所以，如果直接使用本例的话，需要在创建华为应用时指定redirectUri为http://127.0.0.1:8443/oauth/callback/huawei，当然，你也可以直接对JustAuth-demo项目进行改造。

然后启动项目，访问http://localhost:8443，点击最后的华为登录即可

正常的在华为授权页面登录成功后，会出现以下页面
image

点击“授权并登录”即可看到登录后的用户信息。

集成企业微信授权登录

参考：https://xkcoding.com/2019/08/06/use-justauth-integration-wechat-enterprise.html

关于JustAuth

JustAuth，史上最全的整合第三方登录的开源库。目前已支持Github、Gitee、微博、钉钉、百度、Coding、腾讯云开发者平台、OSChina、支付宝、QQ、微信、淘宝、Google、Facebook、抖音、领英、小米、微软、今日头条、Teambition、StackOverflow、Pinterest、人人、华为和企业微信等第三方平台的授权登录。 Login, so easy!

JustAuth，如你所见，它仅仅是一个第三方授权登录的工具类库，它可以让我们脱离繁琐的第三方登录SDK，让登录变得So easy!

项目开源地址：gitee | github

JustAuth的特点

废话不多说，就俩字：

  1. 全：已集成十多家第三方平台（国内外常用的基本都已包含），后续依然还有扩展计划！
  2. 简：API就是奔着最简单去设计的（见后面快速开始），尽量让您用起来没有障碍感！

JustAuth相关项目

demo

springboot插件

相关文章

其他开源作品

  • blog-hunter，一款简单好用并且支持多个平台的博客爬取工具
  • OneBlog，一个简洁美观、功能强大并且自适应的Java博客
  • JustAuth，史上最全的整合第三方登录的开源库。目前已支持Github、Gitee、微博、钉钉、百度、Coding、腾讯云开发者平台、OSChina、支付宝、QQ、微信、淘宝、Google、Facebook、抖音、领英、小米、微软、今日头条、Teambition、StackOverflow、Pinterest和人人等第三方平台的授权登录。 Login, so easy!
  • spingboot-shiro，Springboot + shiro权限管理。这或许是流程最详细、代码最干净、配置最简单的shiro上手项目了。
  • braum-spring-boot-starter，Braum可以很方便的帮助开发人员过滤、识别恶意请求

QQ群

  • JustAuth交流群 （230017570）：专业交流JustAuth
  • 开源总群 （190886500）：上面提到的开源项目都有，也有博客建设等方面的朋友。（注意，该群需付费进入，防止发垃圾广告、垃圾推广等人士，入群请慎重考虑！）

关注我的公众号

关注我的公众号，了解更多咨询！



正文到此结束
所属分类：开源软件
热门推荐
相关文章
关于我
微信公众号
张亚东博客
一个程序员的个人博客，心之所向，无所不能
本文目录
    标签云
    Linux Java Spring Spring Boot Maven Docker IDE uzip war Shell Flyat chrome 自动化测试 Git Task 爬虫 MySQL JS 正则 Tomcat FindBugs 版本控制 Nginx Apache 其他 阿里云优惠券 微信小程序 网易云音乐 阿里云服务器 阿里云优惠活动 ztree Cordova Android 开源 第三方登录 安全 websocket OneBlog 码一码 微信 yuicompressor 博客迁移 开源 hunter 开源软件 JustAuth
    近期评论
    网站信息
    • 文章总数：148 篇
    • 标签总数：46 个
    • 分类总数：11 个
    • 留言数量：964 条
    • 在线人数：1人
    • 运行天数：3,119天
    • 最后更新：2021年08月13日17点
    • 系统版本：v2.3.4