微信小程序开发能力汇总

汇总列表

外部跳微信小程序

  • [x] H5链接跳小程序
  • [x] App跳小程序
  • [x] 短信跳小程序
  • [x] 微信扫码跳小程序
  • [x] 微信公众号跳小程序

小程序跳外部

  • [x] 小程序跳H5链接
  • [x] 小程序跳APP
  • [ ] 小程序跳小程序
  • [x] 小程序分享到微信

H5链接跳小程序

开放标签

跳转小程序:wx-open-launch-weapp

用于页面中提供一个可跳转指定小程序的按钮。使用此标签后,用户需在网页内点击标签按钮方可跳转小程序。H5通过开放标签打开小程序的场景值为1167。

开放对象

  • 已认证的服务号,服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。
  • 已认证的非个人主体的小程序,使用小程序云开发的静态网站托管绑定的域名下的网页,可以使用此标签跳转任意合法合规的小程序。

代码用例

<wx-open-launch-weapp
 id="launch-btn"
 username="gh_xxxxxxxx"
 path="pages/home/index?user=123&action=abc"
>
 <script type="text/wxtag-template">
 <style>.btn { padding: 12px }</style>
 <button class="btn">打开小程序</button>
 </script>
</wx-open-launch-weapp>
<script>
 var btn = document.getElementById('launch-btn');
 btn.addEventListener('launch', function (e) {
 console.log('success');
 });
 btn.addEventListener('error', function (e) {
 console.log('fail', e.detail);
 });
</script>

静态网站H5跳小程序

非个人主体并且已认证的(微信认证) 小程序,使用云开发静态网站托管的网页,可以免鉴权跳转任意合法合规的小程序。即可以在微信内部浏览器的 H5 跳转小程序,也可以在微信外部浏览器或其他部分 App (如企业微信、QQ 等)跳转微信小程序。参考链接

参考链接

App跳小程序

1、App主动分享小程序卡片

  • 配置小程序原始id
  • 配置小程序页面路径
  • 配置小程序消息title、desc、图片等信息
WXMiniProgramObject miniProgramObj = new WXMiniProgramObject();
miniProgramObj.webpageUrl = "http://www.qq.com"; // 兼容低版本的网页链接
miniProgramObj.miniprogramType = WXMiniProgramObject.MINIPTOGRAM_TYPE_RELEASE;// 正式版:0,测试版:1,体验版:2
miniProgramObj.userName = "gh_d43f693ca31f"; // 小程序原始id
miniProgramObj.path = "/pages/media"; //小程序页面路径;对于小游戏,可以只传入 query 部分,来实现传参效果,如:传入 "?foo=bar"
WXMediaMessage msg = new WXMediaMessage(miniProgramObj);
msg.title = "小程序消息Title"; // 小程序消息title
msg.description = "小程序消息Desc"; // 小程序消息desc
msg.thumbData = getThumb(); // 小程序消息封面图片,小于128k
SendMessageToWX.Req req = new SendMessageToWX.Req();
req.transaction = buildTransaction("miniProgram");
req.message = msg;
req.scene = SendMessageToWX.Req.WXSceneSession; // 目前只支持会话
api.sendReq(req);

2、App拉起小程序功能

  • 对于已通过认证的开放平台账号,其移动应用可以跳转至任何合法的小程序,且不限制跳转的小程序数量。
  • 对于未通过认证的开放平台账号,其移动应用仅可以跳转至同一开放平台账号下小程序。
  • 若移动应用未上架,则最多只能跳转小程序100次/天,用于满足调试需求。
String appId = "wxd930ea5d5a258f4f"; // 填移动应用(App)的 AppId,非小程序的 AppID
IWXAPI api = WXAPIFactory.createWXAPI(context, appId);
WXLaunchMiniProgram.Req req = new WXLaunchMiniProgram.Req();
req.userName = "gh_d43f693ca31f"; // 填小程序原始id
req.path = path; ////拉起小程序页面的可带参路径,不填默认拉起小程序首页,对于小游戏,可以只传入 query 部分,来实现传参效果,如:传入 "?foo=bar"。
req.miniprogramType = WXLaunchMiniProgram.Req.MINIPTOGRAM_TYPE_RELEASE;// 可选打开 开发版,体验版和正式版
api.sendReq(req);

参考链接

短信跳小程序

短信跳小程序境内非个人主体的认证的小程序,开通静态网站后,可以免鉴权下发支持跳转到相应小程序的短信。短信中会包含支持在微信内或微信外打开的静态网站链接,用户打开页面后可一键跳转至你的小程序。

微信扫码跳小程序

为方便小程序开发者更便捷地推广小程序,兼容线下已有的二维码,微信公众平台开放扫描普通链接二维码跳转小程序能力。

配置二维码规则

测试环境生成扫码链接后,需在小程序后管配置下扫码链接,方可进入体验版;生产环境无需每次都配置。

配置成功后用测试链接二维码扫码即可跳转到小程序,小程序onLoad options.q可确定为扫码场景,并获取到对应参数。

onLoad: function (options) {
 if (options.q) {
 // 扫码进来的
 ...
 }
}

微信公众号跳小程序

  • 小程序后管、公众号后管都须做依赖关联

小程序跳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)
 }
})

小程序分享到微信

onShareAppMessage(Object object)

分享分2种:页面内转发按钮、右上角转发菜单。二者都定义标题、转发路径、自定义图片。

/**
 * 用户点击右上角分享
*/
onShareAppMessage() {
 const { defaultShareTitle, query, defaultShareImg } = GlobalData;
 return {
 title: defaultShareTitle,
 path: `pages/lauch/index?${queryString.stringfy(query)}`,
 imageUrl: defaultShareImg,
 };
},
作者:baldwin

%s 个评论

要回复文章请先登录注册