FinClip为企业提供小程序生态圈技术产品,开发者可在FinClip小程序开发帮助中心找到相关FinClip小程序指引

# 微信登录功能介绍

FinClip 中提供了支持小程序复用微信登录的能力,您需要登录 FinClip 管理后台,分别点击【小程序-详情-第三方管理-关联微信小程序登录】,在其中输入微信小程序原始 ID,小程序中需要上传的对应授权页后,进行绑定即可。

请注意

本功能需要您将授权页上传至微信小程序中,点击这里 (opens new window) 获取小程序授权页面资源。

# 1. 功能介绍

本微信登录功能采用了 小程序登录常见问题 中的方案三,您需要在您已有微信小程序中进行定义修改,从而使得 FinClip 小程序具备微信登录的能力,具体流程图如下所示。

image.png

# 2. 微信登录功能实现说明

如上图所示,本功能的实现方式如下:

  • FinClip 小程序调用接口(wx.login, wx.getUserProfilewx.getPhoneNumber);
  • App 端注入接口(wx.login, wx.getUserProfilewx.getPhoneNumber);
  • App端引入 wx 端 openSDK,获取管理后台配置的微信登录小程序相关信息;
  • 执行 WXLaunchMiniProgram 方法打开微信登录小程序的授权页面;
  • 小程序根据 App 的参数执行相关的微信接口获取信息,并返回 App;
  • App 把接口数据回传给 FinClip 小程序。

# 3. 微信登录配置说明

  • 准备一个具备登录能力的微信小程序;
  • 这里 (opens new window)获取授权页面;
  • 由于wx.getPhoneNumber Api需要服务端解密接口,所以需要您自行修改这里的接口;
  • 前往微信公众平台上架微信登录小程序(也可集成在已有的微信小程序里);
  • 前往 FinClip 管理后台【小程序管理-我的小程序-第三方管理】进行配置;
  • App 端实现相关的微信接口(wx.login, wx.getUserProfilewx.getPhoneNumber);
  • 上架相关小程序,进行调试。

# iOS 示例代码

// 注入登录方法
    [[FATClient sharedClient] registerExtensionApi:@"login" handler:^(FATAppletInfo *appletInfo, id param, FATExtensionApiCallback callback) {
        NSString *wxid = appletInfo.wechatLoginInfo[@"wechatOriginId"];
        NSString *path = appletInfo.wechatLoginInfo[@"profileUrl"];
        BOOL canWXLogin = [WXApi isWXAppInstalled] && [wxid length] > 0 && [path length] > 0;
        if (!canWXLogin) {
            callback(FATExtensionCodeFailure, @{@"errMsg" : @"login:fail"});
            return;
        }
        self.callback = callback;
        WXLaunchMiniProgramReq *req = [WXLaunchMiniProgramReq object];
        req.userName = wxid;
        req.path = path;
        req.miniProgramType = WXMiniProgramTypeRelease;
        [WXApi sendReq:req completion:^(BOOL success) {
            NSLog(@"打开微信:%d", success);
        }];
    }];
        
//微信结果回调
- (void)onResp:(BaseResp *)resp {
    FATExtensionCode code = FATExtensionCodeSuccess;
    if (resp.errCode != WXSuccess) {
        code = FATExtensionCodeFailure;
    }
    if ([resp isKindOfClass:[WXLaunchMiniProgramResp class]]) {//打开小程序
        NSString *extMsg = ((WXLaunchMiniProgramResp *)resp).extMsg;
        if (extMsg.length <= 0) {
            self.callback(FATExtensionCodeFailure, nil);
        }
        else {
            self.callback(code, [self dictionaryWithJsonString:extMsg]);
        
        }
    }
}

//字符串转成字典
- (NSDictionary *)dictionaryWithJsonString:(NSString *)jsonString {
    if (jsonString == nil) return nil;

    NSData *jsonData = [jsonString dataUsingEncoding:NSUTF8StringEncoding];
    NSError *err;
    NSDictionary *dic = [NSJSONSerialization JSONObjectWithData:jsonData  options:NSJSONReadingMutableContainers error:&err];
    if(err) {
        NSLog(@"json解析失败:%@",err);
        return nil;
    }
    return dic;
}

# Android 示例代码

class WxModule(context: Context) : AppletApi(context) {
    private var globalWechatLoginCallback: ICallback? = null

    override fun invoke(appId: String, event: String, param: JSONObject, callback: ICallback) {
        val finAppInfo = appletApiManager.getAppletInfo(appId)
        if (finAppInfo == null) {
            callback.onFail()
            return
        }
        val wechatLoginInfo = finAppInfo.wechatLoginInfo
        if (wechatLoginInfo == null || TextUtils.isEmpty(wechatLoginInfo.wechatOriginId)) {
            callback.onFail()
            return
        }
        globalWechatLoginCallback = callback
        val req = WXLaunchMiniProgram.Req()
        req.userName = wechatLoginInfo.wechatOriginId // 填小程序原始id
        req.path = wechatLoginInfo.profileUrl ?: "" //拉起小程序页面的可带参路径,不填默认拉起小程序首页
        req.miniprogramType = WXLaunchMiniProgram.Req.MINIPTOGRAM_TYPE_RELEASE// 可选打开 开发版,体验版和正式版
        val done = WXAPiHandler.wxApi?.sendReq(req)
    }

    override fun apis(): Array<String> {
        return arrayOf("login")
    }

}

// 微信回调
override fun onResp(resp: BaseResp) {
   if(resp is WXLaunchMiniProgram.Resp && !TextUtils.isEmpty(resp.extMsg)){
         val json=JSONObject()
         json.put("result",resp.extMsg)
         globalWechatLoginCallback?.onSuccess(json)
     }else{
         globalWechatLoginCallback?.onFail()
     }
}

# 4. 其他说明

若您需要使用帮助,可使用 FinClip 中的工单功能,或加入开发者社群获得更多帮助与支持。

您也可以查看我们的官方 DEMO 项目(iOS (opens new window)Android (opens new window)),获得更多代码示例。

© 2022 FinClip with ❤

👋🏻 嘿,你好!

「FinClip」是一套基于云原生框架设计的小程序容器。能够让任何移动应用在集成小程序SDK之后,获得可用、安全的小程序运行能力。

>> 点我免费注册体验

查看产品文档
了解与 FinClip 相关的一切信息

产品博客 👈  了解产品更新与核心功能介绍
资源下载 👈  获取小程序 SDK 与开发工具
文档中心 👈  查询 FinClip 小程序开发指南与答疑

商务咨询热线
预约 FinClip 产品介绍,咨询商务报价或私有化部署事宜

400-066-00210755-86967467

获取产品帮助
联系 FinClip 技术顾问,获取产品资料或加入开发者社群

联系线上
人工客服

或 👉  点击这里,提交咨询工单