Introducción:
La cantidad de usuarios de WeChat ha superado los mil millones (más del 80% de la gente en China usa WeChat), y los applets de WeChat también son populares entre los usuarios. Si su sitio web tiene un terminal móvil H5, puede empaquetar directamente el sitio web móvil H5 en un subprograma de WeChat. Excepto que la función de pago de WeChat no se puede utilizar, otras funciones de uso compartido similares no son diferentes de un subprograma real. De esta manera, se puede ahorrar el tiempo y el costo de desarrollar un subprograma de WeChat.
Pasos del tutorial:
Requisitos previos: el nombre de dominio del sitio web de H5 debe ser https, como https://m.18ka.net/ , que comienza con https, no http
1. Inicie sesión en la plataforma pública de WeChat , registre un programa pequeño, no conozca Baidu por sí mismo, obtenga AppID (ID de programa pequeño)
2. Cree un mini programa en la herramienta de desarrollo de WeChat y complete el AppID del mini programa previamente registrado
Tres, modificar la configuración de app.json
- Abra el archivo app.json y deje solo la línea "páginas / índice / índice" en el elemento de páginas
- Complete el nombre del subprograma en el navigationBarTitleText del elemento de la ventana
→ →
4. Abra el archivo /pages/index/index.wxml, elimine todos los códigos que contiene y agregue la siguiente línea de código
<web-view src="https://m.18ka.net"></web-view>Https://m.18ka.net en el código es el nombre de dominio de su sitio web H5
Cinco, prueba
1. Haga clic en Detalles → Configuración local → marque [No verificar el nombre de dominio legal] para realizar la prueba, como se muestra en la siguiente figura:
2. Si el Mini Programa se lanza oficialmente, debe agregar el nombre de dominio H5 como un nombre de dominio comercial en el Mini Centro de administración del programa WeChat, como se muestra en la siguiente figura:
Inicie sesión en la plataforma pública WeChat → gestión de desarrollo → configuración de desarrollo → nombre de dominio del servidor:
Seis, js juzga si la URL html5 actual se está ejecutando en el subprograma WeChat
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script>
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
//ios的ua中无miniProgram，但都有MicroMessenger（表示是微信浏览器）
wx.miniProgram.getEnv((res)=>{
if (res.miniprogram) {
alert("在小程序里");
} else {
alert("不在小程序里");
}
})
}else{
alert('不在微信里');
}
</script>