h5必须要跳转吗

一、app或小程序打开h5

1、webview实现

你可以把webview理解成一个无界面的浏览器。

ios端已经淘汰掉了UIWebView，现在要使用WKWebView容器，android一般使用系统自带的webview即可，小程序就是用自己的webview内核。

关于h5中如何判断所处的平台环境可以参考另一篇文章：传送门

代码示例（小程序）：

<web-view

src="{{url}}"

bindmessage="getMessage"

></web-view>

二、app打开小程序

1、微信开放平台sdk实现

需要已认证的微信开放平台账号

app需要接入微信开放平台OpenSDK

可跳转至任意小程序

跳转自家的小程序不受限制

跳转其他家的小程序之前需要先将app和小程序关联，最多关联3个小程序

具体细则参考官方文档：传送门

三、小程序打开app

1、app打开小程序后再跳回

小程序不能随便打开app，只能是跳回原app，也就是app是发起者。

主要是两种场景：一是app分享微信卡片，点击微信卡片打开小程序；二是app直接打开小程序。这两种场景下小程序可以打开原app。

只能手动点击页面标签按钮跳转

具体细则参考官方文档：传送门

代码示例：

<button

open-type="launchApp"

app-parameter="myParameters"

binderror="onLaunchAppError"

>打开APP</button>

四、微信内h5打开小程序

1、微信开放标签实现

需要已认证的微信公众平台账号

需要在公众平台后台绑定h5安全域名

h5需要引入微信js-sdk，配置wx.config，使用标签wx-open-launch-weapp

只能手动点击页面标签按钮跳转

可跳转至任意小程序

具体细则参考官方文档：传送门

代码示例：

<wx-open-launch-weapp

id="launch-btn"

username="gh_xxxxxxxx"

path="pages/home/index?user=123&action=abc"

>

<template>

<style>.btn { padding: 12px }</style>

<button class="btn">打开小程序</button>

</template>

</wx-open-launch-weapp>

2、小程序码实现

需要已认证的微信公众平台账号（小程序）

需要后端对接小程序官方api生成小程序码

前端展示小程序码，引导用户长按识别

小程序码可携带参数（scene）有长度限制，最大32个字符长度

只能跳转自家的小程序

具体细则参考官方文档：传送门

五、普通环境h5打开小程序

这里的普通环境是指除微信外的普通浏览器或其他app内的webview环境。

短信唤起小程序本质上也是普通h5唤起来实现。

1、小程序url schema实现

url schema是一种页面内跳转协议，通过定义自己的scheme协议，可以非常方便跳转app中的各个页面。

这也是最近一年小程序官方才推出的方式，使用方便，强烈建议。

具体细则参考官方文档：传送门

2、云开发静态托管h5实现

具体细则参考官方文档：传送门

3、小程序码实现

需要已认证的微信公众平台账号（小程序）

需要后端对接小程序官方api生成小程序码

前端展示小程序码海报，引导用户保存或下载海报后再通过微信扫一扫识别

小程序码可携带参数（scene）有长度限制，最大32个字符长度

只能跳转自家的小程序

具体细则参考官方文档：传送门

六、微信内h5打开app

微信环境里默认屏蔽了url schema等方式打开app的能力，除非你是白名单app，例如腾讯系的知乎、bilibili等，一般app只能另寻出路。

1、微信开放标签实现

需要已认证的微信公众平台账号和微信开放平台账号

需要在公众平台后台绑定h5安全域名

需要在开放平台后台登记h5域名和app的绑定关系

h5需要引入微信js-sdk，配置wx.config，使用标签wx-open-launch-app

只能手动点击页面标签按钮跳转

只能跳转h5域名绑定的app

可以实现跳转指定页面和携带参数

具体细则参考官方文档：传送门

代码示例：

<wx-open-launch-app

id="launch-btn"

appid="your-appid"

extinfo="your-extinfo"

>

<template>

<style>.btn { padding: 12px }</style>

<button class="btn">打开App</button>

</template>

</wx-open-launch-app>

2、应用宝微下载实现

应用宝微下载链接页面会自动判断运行平台，判断是安卓就跳转该app应用宝详情页，判断是ios就跳转该app苹果应用商店详情页，已安装app就会d窗提示打开。

需要已认证的腾讯开放平台账号

app需要接入应用宝平台并上架

需要在开放平台后台配置应用宝微下载，生成一个网页链接

h5只需要跳转该网页链接即可

可跳转至任意app

如需获得跳转app指定页面的能力，需要额外申请，根据应用资质进行审批

具体细则参考官方文档：传送门

代码示例：

<a

href="https://a.app.qq.com/o/simple.jsp?pkgname=com.test.testapp"

>打开App</a>

3、右上角提示用浏览器打开

微信环境页面内引导用户点击右上角省略号用浏览器打开页面，然后通过普通浏览器h5打开app的方式（见下面）实现

很多微信内h5页面的技术限制都可以通过这一交互方式来处理。

判断微信环境的代码示例：

const ua = window.navigator.userAgent.toLowerCase()

const isWechat = (() =>{

return /MicroMessenger/i.test(ua)

})()

七、普通环境h5打开app

这里的普通环境是指除微信外的普通浏览器或其他app内的webview环境。

1、url schema实现

url schema是一种页面内跳转协议，通过定义自己的scheme协议，可以非常方便跳转app中的各个页面。

安卓和ios平台都支持

需要浏览器或webview环境支持url schema协议向外跳转

要跳转的app端需要配置一个url schema地址，提供给h5

h5页面只需要以跳转普通网页的方式跳转该url schema地址即可

可以实现跳转指定页面和携带参数

如果用户未安装要跳转的a

验证码长度过短是说APP发的验证码可能是六位的，你只输入了四位。

验证码（CAPTCHA）是“Completely Automated Public Turing test to tell Computers and Humans Apart”（全自动区分计算机和人类的图灵测试）的缩写，是一种区分用户是计算机还是人的公共全自动程序。

验证码这个词最早是在2002年由卡内基梅隆大学的路易斯·冯·安、Manuel Blum、Nicholas J.Hopper以及IBM的John Langford所提出。卡内基梅隆大学曾试图申请此词使其成为注册商标， 但该申请于2008年4月21日被拒绝。

storage【缓存数据】

以键值对key, data的形式存储数据，单个 key 允许存储的最大数据长度为 【1MB】，所有数据存储空间最大为【10M】。

属性 类型 默认值 必填 说明

key string 是 本地缓存中指定的 key

data any 是 需要存储的内容。只支持原生类型、Date、及能够通过JSON.stringify序列化的对象。

不带Sync的为异步，【带Sync的为同步，需要做异常处理，防止阻塞主程序。】

分别为set存储、get得到一个、getInfo得到所有，remove移除一个、clear清除所有

隔离策略

同一个微信用户，同一个小程序 storage 上限为 10MB。storage 以用户维度隔离，同一台设备上，A 用户无法读取到 B 用户的数据；不同小程序之间也无法互相读写数据。

插件隔离策略

同一小程序使用不同插件：不同插件之间，插件与小程序之间 storage 不互通。

不同小程序使用同一插件：同一插件 storage 不互通。

清理策略：

本地缓存的清理时机跟代码包一样，只有在代码包被清理的时候本地缓存才会被清理。

二.save File【缓存文件】

本地文件存储的大小限制为 【10M】

三，database服务端数据库【存储数据】存储数据至服务器端。

四.upload File,【上传文件】存储文件至服务器端。

云函数uploadFile文件名命名限制

不能为空

不能以/开头

不能出现连续/

编码长度最大为850个字节

推荐使用大小写英文字母、数字，即[a-z，A-Z，0-9]和符号 -，!，_，.，* 及其组合

不支持 ASCII 控制字符中的字符上(↑)，字符下(↓)，字符右(→)，字符左(←)，分别对应 CAN(24)，EM(25)，SUB(26)，ESC(27)

如果用户上传的文件或文件夹的名字带有中文，在访问和请求这个文件或文件夹时，中文部分将按照 URL Encode 规则转化为百分号编码。

不建议使用的特殊字符: ` ^ " \ { } [ ] ~ % # \ ><及 ASCII 128-255 十进制

可能需特殊处理后再使用的特殊字符: ， : = &$ @ + ?（空格）及ASCII 字符范围：00-1F 十六进制（0-31 十进制）以及7F（127 十进制）

---