写点什么

关于业务转化息息相关的小程序能力

作者:Geek_2305a8
  • 2023-12-18
    广东
  • 本文字数:2007 字

    阅读完需:约 7 分钟

以下为大家盘点一下,在日常工作中常常用到的,和营销与业务转化息息相关的小程序能力。避免篇幅太长,这个系列将分成一二两期呈现。作为小程序开发,日常很大的一部分工作就是满足业务部门的需求,配合业务应用落地、营销活动。


小程序跳外部功能列表:小程序跳 H5 链接小程序跳 APP 小程序运行在外部 App 小程序分享到微信添加小程序到桌面小程序跳 H5 链接微信小程序跳转 h5 链接通常使用 web-view 当容器,来打开 h5 链接。


方法一:使用微信内置浏览器跳转


小程序内置了微信浏览器组件,可以通过打开一个新的 web-view 页面来实现小程序跳转 H5。具体实现步骤如下:1.在小程序中创建一个按钮或其他交互元素,并为其绑定点击事件。2.在点击事件的回调函数中,使用 wx.navigateToMiniProgram 方法打开一个新的小程序页面,并设置跳转的 H5 页面链接。3.在跳转的 H5 页面中,用户可以浏览更多内容或进行其他操作。


方法二:使用小程序自带的 web-view 组件跳转


小程序提供了一个 web-view 组件,可以在小程序内部打开一个 web 页面。具体实现步骤如下:1.在小程序页面中添加一个 web-view 组件,并设置 src 属性为跳转的 H5 页面链接。2.用户点击小程序页面上的按钮或其他交互元素时,web-view 组件会加载并显示跳转的 H5 页面。


参考文档:


使用 web-view


小程序跳 APP 使用 button 组件的 open-type=launchApp


<button open-type="launchApp" app-parameter="wechat" binderror="launchAppError">打开 APP</button>Page({launchAppError (e) {console.log(e.detail.errMsg)}})


小程序运行在外部 App 小程序脱离微信在其他 APP 中运行通常是通过在 app 内嵌小程序容器来实现。


借用小程序容器技术可以将已开发完成的成熟小程序直接搬到自己的 App 中运行。小程序容器技术主要是将小程序运行沙箱封装成一个 SDK,只需要在你的 App 里面集成,就能加载运行现有的小程序了。我自己常用的是FinClip SDK, 主要是该技术完全遵循微信小程序的开发标准与规范。也就是说,现有的微信小程序可以不改一行代码,直接放进自己的 App 里面。


参考文档:


iOS 集成文档


Android 集成文档


分享小程序到微信内嵌到 app 中的小程序也可以分享回微信,要实现小程序分享功能,总体思路是先获取到分享小程序所需要的相关信息,然后把获取到的信息转换为分享接口的参数,最后再调用分享接口把小程序分享到对应平台。具体实现方案主要有两种:


1、实现小程序抽象业务回调接口 IAppletHandler 的 shareAppMessage 方法,并将 IAppletHandler 实例传入 SDK。


2、当点击小程序更多菜单中的“转发”时,会调用 IAppletHandler 实例的 shareAppMessage 方法,shareAppMessage 方法中有小程序信息、小程序页面截图等参数,获取到小程序相关参数之后,便可调用第三方分享 SDK 实现分享。


shareAppMessage 方法如下:


/**


  • 转发小程序

  • @param appInfo 小程序信息,是一串 json,包含了小程序 id、小程序名称、小程序图标、用户 id、转发的数据内容等信息。

  • [appInfo]的内容格式如下:

  • {

  • }

  • [appInfo]中各字段的说明:

  • appId 小程序 ID

  • appTitle 小程序名称

  • appAvatar 小程序头像

  • appType 小程序类型,其中 trial 表示体验版,temporary 表示临时版,review 表示审核版,release 表示线上版,development 表示开发版

  • userId 用户 ID

  • cryptInfo 小程序加密信息

  • params 附带的其它参数,由小程序自己透传

  • @param bitmap 小程序封面图片。如果[appInfo].params.imageUrl 字段为 http、https 的链接地址,那么小程序封面图片

  • 就取[appInfo].params.imageUrl 对应的图片,否则小程序的封面图片取[bitmap]。

  • @param callback 转发小程序结果回调。*/fun shareAppMessage(appInfo: String, bitmap: Bitmap?, callback: IAppletCallback)通过调用 IAppletApiManager 的 setAppletHandler(appletHandler: IAppletHandler)方法传入 IAppletHandler 实例,如下:


FinAppClient.INSTANCE.getAppletApiManager().setAppletHandler(new IAppletHandler() {@Overridepublic void shareAppMessage(@NotNull String appInfo,@org.jetbrains.annotations.Nullable Bitmap bitmap,@NotNull IAppletCallback callback) {// 实现分享小程序的逻辑…………………………………………………………………………………………………………}});2、通过自定义接口来实现。在自定义接口的 invoke 方法中接收小程序传递过来的参数,然后调用第三方分享 SDK 实现小程序分享。


添加小程序到桌面内嵌到 app 中的小程序同样可以添加到桌面,添加到桌面的能力其实是由 App 实现的,设置方式如下。


iOS 设置方法


初始化 SDK 时,通过 UI 配置项进行配置,如下:


FATUIConfig *uiConfig = [[FATUIConfig alloc] init];// 屏蔽更多菜单中的“添加到桌面”按钮// 默认值为 YES 隐藏 uiConfig.hideAddToDesktopMenu = NO;Android 设置方法初始化 SDK 时,通过 UI 配置项进行配置,如下:


FinAppConfig.UIConfig uiConfig = new FinAppConfig.UIConfig();// 是否隐藏更多菜单中的"添加到桌面"按钮// 默认值为 true 隐藏 uiConfig.setHideAddToDesktopMenu(false);

用户头像

Geek_2305a8

关注

还未添加个人签名 2023-11-01 加入

还未添加个人简介

评论

发布
暂无评论
关于业务转化息息相关的小程序能力_Geek_2305a8_InfoQ写作社区