微信h5端wx-open-launch-app跳转app(Flutter端接收extinfo)

1. 通过官方文档把需要配置的都配好, 公众号appId,微信开放平台appId, 确保运行wx.ready能返回正确的结果
   https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html#22

2. 在微信开放平台,增加配置js安全域名,要跟公众号平台配置保致一致,否则会报: launch:fail_check fail

3. h5端增加标签wx-open-launch-app, 加上跳转成功和失败的handler

extinfo用来传递参数: sign?start_lat=&start_lng&

vue
  <wx-open-launch-app id="launch-btn" appid="xxx"  extinfo="sign?start_lat=&start_lng&"       
      @error="handleError" @launch="handleLaunch">
        <script type="text/wxtag-template">
          <style>.btn { padding: 12px }</style>
          <button class="btn">App内查看</button>
        </script>
      </wx-open-launch-app>
      
	const handleError = (e) => {
      console.log('handleError', e.detail)
      Toast(`打开失败: ${e.detail}, 下载app...`)
    }
    const handleLaunch = (e) => {
      console.log('handleLaunch', e.detail)
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

4. 至此打开页面, 点击wx-open-launch-app,如果报launch:fail,说明已经完成一半

5. flutter端引入fluwx,注册appId

    fluwx = Fluwx();//微信
    fluwx.registerApi(appId: "xxx");
1
2

6. 处理extInfo,仅启动时获取一次

final String? extMsg = await fluwx.getExtMsg();//extMsg = sign?start_lat=&start_lng&
还原为标准的uri去处理
Uri initialUri = Uri.parse(extMsg);
1
2
3

7. 如果在启动之后,还需要一直去获取到extInfo的话…就得去注册获取这个事件,具体能不能多次从微信接收消息,这个我没有去尝试.

fluwx里,已经把通过IWXAPIEventHandler把从微信过来的消息,放到methodChannel里,

kt
    override fun onReq(req: BaseReq?) {
        activityPluginBinding?.activity?.let { activity ->
            req?.let {
                if (FluwxConfigurations.interruptWeChatRequestByFluwx) {
                    when (req) {
                        is ShowMessageFromWX.Req -> handleShowMessageFromWX(req)
                        is LaunchFromWX.Req -> handleLaunchFromWX(req)
                        else -> {}
                    }
                } else {
                    FluwxRequestHandler.customOnReqDelegate?.invoke(req, activity)
                }
            }
        }
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

以下是默认的单次获取

dart
  /// Get ext Message
  @override
  Future<String?> getExtMsg() {
    return methodChannel.invokeMethod('getExtMsg');
  }
1
2
3
4
5
6

如果需要接收extInfo的话.以上接收微息的消息,使用fluwx还有点问题
最终的处理方式

1. 加了个新的Activity,并实现IWXAPIEventHandler接口
2. 在onReq方法中获取到extInfo