Cómo implementar el intercambio de páginas HTML5 en WeChat

Compartir WeChat puede parecer complicado a primera vista, pero en realidad es muy simple. Solo necesita llamar al WeChat jssdk publicado por WeChat y agregar algunas configuraciones para compartir páginas h5 en WeChat. La dirección del documento oficial es: https://mp.weixin.qq.com/wiki?t=resource/res_main&id. =mp1421141115

Encuentre el appid de una cuenta oficial existente, realice una solicitud al backend en función de este appid y URL, y obtenga los parámetros necesarios para la configuración: marca de tiempo, noncestr y firma.

Introduzca el archivo JS-SDK del sitio web oficial de WeChat a través de la etiqueta script

 <script src=https://res.wx.qq.com/open/js/jweixin-1.2.0.js type=text/javascript></script>

2. Configuración básica

 wx.config({ debug: false, // Si se habilita el modo de depuración appId: appid, //appid timestamp: timestamp, // timestamp nonceStr: noncestr, // cadena aleatoria firma: firma, // firma jsApiList: [ ' onMenuShareTimeline ', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone' ] // Lista de interfaces JS que se utilizarán})

3. uso

 wx.ready(function(){ // Compartir con amigos wx.onMenuShareAppMessage({ title: title, // Compartir título desc: desc, // Compartir enlace de descripción: link, // Compartir enlace imgUrl: imgUrl, // Compartir icono éxito: función () { doShareDone() }, cancelar: función () { doShareCancel() } }) // Compartir en Momentos wx.onMenuShareTimeline({ título: título, // Compartir título enlace: enlace, // Compartir enlace imgUrl: imgUrl, // Compartir ícono exitoso: función () { doShareDone() }, cancelar: función () { doShareCancel () } })}) 

 // Compartir función de devolución de llamada exitosa doShareDone () { console.log('Compartir exitosamente')} 

 //Cancelar la función de devolución de llamada para compartir doShareCancel () { console.log('Compartir cancelado')}

Cuando el campo de depuración en wx.config está configurado en verdadero, se puede realizar la depuración.

Para la depuración, debe utilizar las herramientas de desarrollo de WeChat, seleccionar el proyecto de la página web de la cuenta oficial e ingresar la dirección de la página.

El Apéndice 5 de la documentación de WeChat JS-SDK contiene soluciones para la mayoría de los problemas. Aquí enumero algunos que encontré y que no proporcionaron las soluciones anteriores.

1. TypeError no detectado: no se puede leer la propiedad 'config' de indefinido

Solución: la página html introdujo el SDK por separado y el componente unificado también introdujo el SDK nuevamente, lo que provocó problemas. Elimine uno de ellos.

2. TypeError no detectado (en promesa): no se puede leer la propiedad 'lista' de indefinido

Solución: Igual que el problema 1.

3. firma no válida

Solución: Si ninguno de los métodos en el documento resuelve este problema, hay otra manera. Primero configure la configuración más básica para que esté bien y luego configure la copia compartida con varios parámetros que necesite. Después de la configuración, se compartió correctamente. Puede ser un poco confuso decirlo, pero una simple comprensión es que siempre que la página tenga una configuración exitosa, puede continuar configurando otros recursos compartidos, incluso si la firma de esta configuración compartida no es válida.

Lo anterior es el contenido completo de este artículo. Espero que sea útil para el estudio de todos. También espero que todos apoyen VeVb Wulin Network.