小程序预备课--初探小程序

Posted 2020-11-21 人间很值得

    最近公司在整一个小程序的项目，在此期间学习了下小程序的开发,在这跟大家分享下；

    进入今天的主题;本文将分为三个部分为大家讲解；第一部分是小程序跳转小程序，第二部分是小程序跳转H5，第三部分是H5跳转小程序；

    小程序之间互相跳转，使用wx.navigateToMiniProgram来实现，官方文档：https://mp.weixin.qq.com/debug/wxadoc/dev/api/navigateToMiniProgram.html

wx.navigateToMiniProgram({
  appId: \'\',//小程序id
  path: \'pages/index/index?id=123\',//小程序跳转路径
  extraData: {
    foo: \'bar\'
  },
  envVersion: \'develop\',
  success(res) {
    // 打开成功
  }
})

    你以为这样就完事了？当然不是！两个小程序之间的跳转是有条件的，打开同一公众号下关联的另一个小程序。如果没有关联同一个公众号，则无法成功打开另一小程序。

    在这里lz要插播一句，有关小程序关联的规则了：

    1.所有公众号都可以关联小程序。

    2.一个公众号可关联10个同主体的小程序，3个不同主体的小程序。

    3.一个小程序可关联3个公众号。

    4.公众号一个月可新增关联小程序13次，小程序一个月可新增关联5次。

    万事俱备，就可以愉快的跳转了；

    小程序跳转H5（用包裹H5更合适），这个之前是没有方法的，但是微信还是给我们一个惊喜，<web-view>，有没有感觉很熟悉；这个方法使用是很简单的，如下

<!-- wxml -->
<!-- 指向微信公众平台首页的web-view -->
<web-view src="https://mp.weixin.qq.com/"></web-view>

    只要填写答应的src就好了，确定？当然不是，这里注意点就是在微信小程序开发者后台会有个业务域名，我们应该配置下页面所对应的域名，这样我们的页面就能包裹在了小程序里面了；小程序API里还给了一系列的方法：

　　

lz遇到的需求是h5跳转到不同域名的落地页；按照之前的思路配置不同业务域名，但是这根本行不通，因为我们会有特别多的落地页，而且微信也只是提供了每个月业务域名修改次数限制，所以得另行他法。这里lz的做法是用iframe去嵌套每个落地页，还真能行得通·~具体做法是：

包裹的h5在跳转时利用wx.miniProgram.navigateTo跳转到一个redirect小程序页面这里用<web-view>包裹嵌套iframe的配置业务域名的页面；这样就能够解决问题了。

    H5跳转小程序，看到这你肯定会差异，这怎么可能，其实是可以通过讨巧的办法进行的，通过我们的好朋友-公众号去实现，我们可以拿到公众号推文消息的url，先从H5直接跳转过去，然后就可以从推文消息进去了；(公众号的图文消息，菜单栏都是可以绑定跳转到小程序的)

　初探小程序，后续更新开发部分，菜鸟一枚，一起探讨交流；