dsx_wechat
- Este es un cliente WeChat de imitación de Vue
- Dirección del proyecto Github: https://github.com/GGwujun/Dsx_wechat
- Una aplicación web que imita WeChat, tiene chat real y otras funciones, y se implementa separando el front-end y el back-end. El front-end se basa en el marco Vue 2.0, el back-end se basa en Node.js + Express + MongoDB y la función de chat y la función de agregar amigos se implementan a través de Websocket.
- Bienvenido a seguir mi cuenta pública:
- Pila de tecnología front-end: vue 2.0, vue-cli, vuex, vue-router, webpack 2.x, pug, sass, babel, etc.;
- Pila de tecnología back-end: Node.js, Express, express-session, WebSocket(ws), MongoDB, mongoose, ES6, etc.
Introducción
- He estado aprendiendo Vue por un tiempo, pero la empresa no usa Vue. Para practicar Vue, también hice varios proyectos personales, grandes y pequeños, e imité la versión para PC de WeChat porque sockit.io no se puede actualizar. , la experiencia en la PC no es buena, debes iniciar sesión nuevamente después de actualizar antes de poder enviar mensajes a tus amigos.
- El más utilizado en la empresa es ionic, un marco de interfaz de usuario parcial centrado en aplicaciones web móviles, que también utiliza el marco angularjs. Cordova se usó para empaquetar, y luego pensé en usar Vue para crear un cliente WeChat y empaquetarlo con Cordova.
- En la actualidad, el hardware de los teléfonos móviles ya es muy bueno. La experiencia de la aplicación del paquete Cordova básico sigue siendo muy fluida. Las aplicaciones de una sola página con Vue básicamente pueden convertirse en aplicaciones nativas.
- La parte del front-end se construye y empaqueta usando vue-cli y se codifica con el depósito de la familia vue (vue, vuex, vue-router).
- Utilice axios para realizar solicitudes de recursos
- El backend se desarrolla utilizando la arquitectura express de Node.js. Actualmente no hay muchas interfaces, pero se actualizarán continuamente.
Servidor
- Desarrollado usando Nodejs + Express
- Realice el registro, iniciar sesión, cerrar sesión, ver amigos, página de inicio personal, agregar amigos, chat individual y chat grupal
- Dirección del proyecto Github: https://github.com/GGwujun/chatserve
Avance
Descargar apk
Haga clic aquí para descargar e instalar la apk. Actualmente, solo es compatible con sistemas Android (5.0 o superior) (debido a que el proyecto aún está en desarrollo, es posible que algunas funciones no sean las más recientes o no estén disponibles temporalmente).
Los nuevos usuarios deben ingresar registrando una cuenta y los usuarios registrados pueden iniciar sesión directamente. Actualmente, la cuenta no admite mensajes sin conexión ni permite agregar usuarios sin conexión como amigos (las funciones relacionadas con la mensajería instantánea deben garantizar que la otra parte esté en línea)
uso local
Suponiendo que haya instalado Node.js , clone el repositorio directamente en su área local, instale todos los complementos e inicie el servidor. Se recomienda utilizar Google Chrome y verlo en modo de depuración móvil (http://localhost:8808/).
# clone
git clone https://github.com/GGwujun/Dsx_wechat.git
# 进入到目录 安装所有依赖包 国内建议使用cnpm
cd Dsx_wechat
npm install
# 开启本地服务器 监听8808端口
npm run dev
Consejos
- Es imposible registrarse u obtener datos porque la interfaz de backend que configuré es mi servidor. Puede descargar el código de backend usted mismo e implementarlo en su propio servidor, pero generalmente es accesible.
- Si desea crear su propio servidor, además de instalar dependencias relacionadas con los nodos, también necesita instalar la base de datos MongoDB.
función
El proyecto ha implementado soporte de servidor backend con funcionalidad de chat real. Por favor transfiera la parte backend aquí
- Estilo de diseño de interfaz de cliente WeChat de alta imitación, con animaciones push, pop, modal, descarte y otras animaciones de transición;
- Las funciones de registro, inicio de sesión y cierre de sesión pueden recordar el estado de inicio de sesión y evitar inicios de sesión múltiples;
- Función de sala de chat, todos los usuarios en línea pueden tener un chat grupal;
- Para agregar un amigo, debe asegurarse de que la otra parte esté en línea antes de poder agregar un amigo correctamente;
- Los usuarios pueden chatear de forma privada. Actualmente, la otra parte debe estar en línea antes de poder chatear normalmente;
- Actualmente, solo se admite el chat de solo texto.
Más funciones continuarán...
Si crees que este proyecto es bueno, ¡ estrella y compártelo!
