WeChat h5 side wx-open-launch-app jump app (Flutter side receives extinfo)

  1. Configure everything that needs to be configured through official documents, public account appId, WeChat open platform appId, and ensure that running wx.ready can return the correct result
    https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag. html#22

  2. On the WeChat open platform, add the configuration of js security domain name, which must be consistent with the configuration of the official account platform, otherwise it will report: launch:fail_check fail

  3. Add the label wx-open-launch-app on the h5 side, and add the handler for the success and failure of the jump

extinfo is used to pass parameters: 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. Open the page so far, click wx-open-launch-app, if it reports launch:fail, it means half of the completion
“launch:fail” The current scene does not support jumping, or the application is not installed on Android, or the user clicks confirmation on the pop-up window on iOS but the application is not installed
“launch:fail” When the domain name of the currently opened h5 page is different from that in wx.ready, an error will also be reported. For example: the link starts with http, and it will automatically switch to https when it is opened. At this time, the domain name to be verified by wx.ready should start with https. At this time, an error will also be reported. The solution: Open it with the same domain name. If it still prompts, just refresh the page on WeChat h5
  1. Introduce fluwx on the flutter side and register appId
    fluwx = Fluwx();//微信
    fluwx.registerApi(appId: "xxx");
  1. Handle extInfo, get it only once at startup
final String? extMsg = await fluwx.getExtMsg();//extMsg = sign?start_lat=&start_lng&
还原为标准的uri去处理
Uri initialUri = Uri.parse(extMsg);
  1. If you need to keep getting extInfo after startup... you have to register to get this event. Specifically, whether you can receive messages from WeChat multiple times, I haven't tried it.

In fluwx, the message from WeChat has been put into methodChannel through IWXAPIEventHandler,

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)
                }
            }
        }
    }

The following is the default single fetch

dart
  /// Get ext Message
  @override
  Future<String?> getExtMsg() {
    
    
    return methodChannel.invokeMethod('getExtMsg');
  }

If you need to receive extInfo. There are still some problems with fluwx for receiving micro-information above. The
final processing method

  1. Added a new Activity and implemented the IWXAPIEventHandler interface
  2. Get extInfo in the onReq method

In Activity, get flutterPlugin

kt
        val flutterEngine = FlutterEngine(this)
        plugin = flutterEngine.plugins.get(xxPlugin::class.java) as xxPlugin
        

Guess you like

Origin blog.csdn.net/zoeou/article/details/130892116