Registro de desarrollo del mini programa WeChat
Estoy tratando de desarrollar un applet de WeChat por primera vez y planeo escribir una publicación de blog para registrar las dificultades, ideas y contenido de la programación de Baidu en el proceso de desarrollo con el mayor detalle posible como referencia.
primer día
Antecedentes de desarrollo
Participe en el desarrollo con otro colega recién contratado. Soy responsable del subprograma de WeChat de front-end, y el back-end usa su propio lenguaje Lua (se pueden implementar java normal, serie springboot o serie jsp-servlet), y los datos se transmiten a través de json en el medio.
Enlace de proyecto completado
https://gitee.com/lyuhuyuteru/weixin/tree/master/%E6%8E%A5%E9%BE%99%E7%AE%A1%E7%90%86%E5%B0%8F%E7%A8 % 8B% E5% BA% 8F
Número de prueba de registro, número de subprograma
https://mp.weixin.qq.com/
Abra el sitio web oficial de la plataforma pública WeChat, busque el pequeño programa y haga clic para registrarse para
descargar la herramienta de desarrollo. La versión cuando el autor escribe el artículo es 1.03.2010240, que
se puede ver en la gestión de desarrollo.AppID y AppSecret
Una vez completada la instalación, abra el programa
y cree un nuevo proyecto después de abrir . El AppID se puede completar antes del registro o se puede usar el número de prueba. No importa si se usa la función de desarrollo en la nube o no.
Salto de página, intercepción de inicio de sesión
Haga clic para ingresar al proyecto recién creado, app.js (este archivo es una parte común del programa), index (esta es la página de inicio) para
crear una nueva interfaz de inicio de sesión de loginPage, haga clic con el botón derecho para crear una nueva carpeta y cree una nueva página loginPage debajo de la carpeta. Se generarán automáticamente cuatro archivos. Es wxml, wxss, js, json para
abrir app.js, agregue el código en la posición de la figura, el
código es para hacer que la página salte al interfaz de inicio de sesión cuando el usuario no ha iniciado sesión
Compruebe si la página está declarada en la página de la aplicación.Json Página de
inicio Código wxml Código
Js
Código
CSS Código Json
Componente de importación de componentes
Icono de
página de inicio de importación
Estructura del directorio de archivos
│ app.js
│ app.json
│ app.wxss
│ project.config.json
│ sitemap.json
│
├─components
│ ├─cell
│ │ cell.js
│ │ cell.json
│ │ cell.wxml
│ │ cell.wxss
│ │
│ ├─cells
│ │ cells.js
│ │ cells.json
│ │ cells.wxml
│ │ cells.wxss
│ │
│ ├─icon
│ │ icon.js
│ │ icon.json
│ │ icon.wxml
│ │ icon.wxss
│ │
│ ├─import
│ │ │ base64.js
│ │ │ common.wxss
│ │ │ CustomPage.js
│ │ │
│ │ └─behaviors
│ │ theme.js
│ │
│ └─weui-wxss
│ └─dist
│ └─style
│ │ weui.wxss
│ │
│ └─icon
│ weui-icon.wxss
│
├─images
│ icon_nav_feedback.png
│ icon_nav_form.png
│ icon_nav_special.png
│ icon_nav_z-index.png
│ jielong.jpg
│ tabbar_icon_chat_active.png
│ tabbar_icon_setting_active.png
│
├─pages
│ ├─icons
│ │ icons.js
│ │ icons.json
│ │ icons.wxml
│ │ icons.wxss
│ │
│ ├─index
│ │ index.js
│ │ index.json
│ │ index.wxml
│ │ index.wxss
│ │
│ ├─loginPage
│ │ loginPage.js
│ │ loginPage.json
│ │ loginPage.wxml
│ │ loginPage.wxss
│ │
│ └─logs
│ logs.js
│ logs.json
│ logs.wxml
│ logs.wxss
│
└─utils
util.js
efecto
Habilidades fuera de tema
Para continuar con el proceso de autorización de depuración, la autorización puede cancelarse configurando
el
formato json de debug json can Stager nodejs json por el servidor json
para lograr la separación de la parte delantera y trasera del programa
en detalle de aquí en adelante operación de aprendizaje de enlaces
https://blog.csdn.net/weixin_44612322/article/details/102960647
ejemplo de json
{
"data": [{
"username": "ldh",
"password": "123"
}]
}
conversión de svg para
obtener el código de etiqueta svg
, cambie el nombre del sufijo svg después de
crear un nuevo txt , abra el navegador y podrá ver el png
