Use socket. IO +vue to build a web chat application

2022-07-28 0 By

Open Source Picks is where we share the best projects in the Github, Gitee and other open source communities, including technical, learning, practical and interesting content.HasChat is a web chat application that uses socket. IO +vue.HasChat is a communication and chat web application that uses Vue3 + Vite + TypeScript + Naive UI + sock. IO on the front end and Express.js on the back end.The author’s open source purpose is to give beginners in the field some guidance, whether you are front-end or back-end, you can have a little inspiration in the field of communication chat.Function login, random access user login send email verification code register send emoji + text combination of rich text send picture content, view the big picture Enter send message,Enter + CTRL Newline Input content Message Reminder Unread message mark Record Historical session Record Historical chat Content Prepare for installation and deployment environment Node.js >= 12.0.0Mysql >= 5.7.0(mysql version only need to download the project front-end) https://gitee.com/howcode/has-chat.git backend mysql version the main git clone – bhttps://gitee.com/howcode/has-chat-service.git backend json version of git clone – b masterhttps://gitee.com/howcode/has-chat-service.git launched project mysql configuration (json version skip) in mysql versions, find the SQL files under the directory store, run the SQL file:Const db = mysql.createconnection ({host: “”, // host address (default: localhost) user:””, // username password: “”, // password database: “” // database}) email configuration (json version skipped) Find the config.js file: emailConfig: {// email configuration host:”Smtp.qq.com “,// email server here I use QQ mailbox port: 465,// email uses the port secure: true,// whether to use the default port 465 auth: {user:””, // Sender email address pass: “” // SMTP verification code}} Start project/service back-end node app.js front-end NPM run dev So that the project can run normally.This project uses Apache2.0 open source agreement, more content you can go to read.Source address: https://gitee.com/howcode/has-chat