当前位置: 首页 > Web前端 > HTML5

Vue+koa2即时聊天,实时推送比特币价格,爬取电影网站

时间:2023-04-05 01:07:44 HTML5

技术栈vue+vuex+vue-router+socket.io+koa2+mongodb+pm2自动部署+图灵机器人+【npm脚本打包,cdn同步,服务器上传一条命令全部搞定】功能列表登录注册获取聊天记录(包括前端页面优化)发送文字、表情、文件消息、创建群组、添加群组、群组搜索、修改个人信息、群组信息、图片裁剪、压缩、上传私聊、图灵机器人、获取定时任务、爬取数字货币例如电影和BTC使用socket.io将价格实时推送给所有客户端。前端打包同步到七牛CDN上传到服务器,实现服务器端pm2的自动部署效果。chrome下F12或手机扫描下方二维码演示。后台代码暂时不开放,因为涉及到很多个人配置数据。如果确实需要可以加微信MSC199312(需要0.0手续费!),毕竟这个小项目断断续续做了几周,费了点心思,涉及的知识点还是很广的实用,希望大家理解。其实主要是穷[泪]部分代码客户端main.jsimportVuefrom'vue'importAppfrom'./App'importrouterfrom'./router'importVueLazyloadfrom'vue-lazyload'importstorefrom'@/store'importiofrom'socket.io-client'import'@/assets/js/remChange'import'@/assets/js/request'//import{wxConfig,updateShare}from'@/assets/js/wxenv'import'@/assets/css/common.scss'import'swiper/dist/css/swiper.min.css'importconfigfrom'@/assets/js/config'importfiltersfrom'@/assets/js/filters'import{openToast}from'@/assets/js/tools'Vue.config.productionTip=false//初始化全局过滤器Object.keys(filters).forEach(item=>{Vue.filter(item,filters[item])})//延迟加载Vue.use(VueLazyload,{attempt:1,//preLoad:1.3,error:require('./assets/images/404.png'),loading:require('./assets/images/loading-img2.gif'),//默认为['scroll','wheel','mousewheel','resize','animationend','transitionend']listenEvents:['scroll']})Vue.prototype.$config=configrouter.beforeEach((to,from,next)=>{//如果没有路由匹配if(to.matched.length===0){//如果上层不匹配路由,则跳转到登录页面,如果上层可以匹配,则转到上层路由from.name?next({name:from.name}):next('/')}else{//路由切换时改变页面标题document.querySelector('title').innerHTML=to.name//统计代码if(to.path)_czc.push(['_trackPageview','/#'+to.fullPath],'')next()}})//路由变化重新配置微信分享router.afterEach(to=>{//wxConfig(()=>updateShare())})//socket.io初始化constsocket=io.connect(config.socketBase)Vue.prototype.$socket=socketVue.prototype.$socketEmiter=(name,data)=>{store.commit('isLoading',true)returnnewPromise((resolve)=>{socket.emit(name,data,res=>{console.log(`${name}>>>`,res)存储。commit('isLoading',false)if(res.status===1){resolve(res.data)}else{openToast({msg:res.message,duration:1500})}})})}/*eslint-disableno-new*/constapp=newVue({el:'#app',router,store,template:'',components:{App}})server端app.jsconstKoa=require('koa')const{resolve}=require('path')constglob=require('glob')const{connectDatabase,initAllSchema,initDefaultUser}=require('./database/init')constconfig=require('./config')constuseMiddlewares=app=>{glob.sync(resolve(__dirname,'./middlewares','**/*.js')).forEach(item=>{require(item)(app)})}(async()=>{console.log('数据库初始化...')awaitconnectDatabase()initAllSchema()awaitinitDefaultUser()constapp=newKoa()console.log('mountingsocket.io...')constserver=require('http').Server(app.callback())constio=require('socket.io').listen(server)require('./socket')(io)//在其他地方暴露io做推送功能module.exports.io=ioconsole.log('Mountmiddleware...')useMiddlewares(app)console.log('初始化定时任务...')//封装更多?require('./tools/crawlMovie')require('./tools/crawlCoin')server.listen(config.server.PORT,()=>{console.log('Listening'+config.server.PORT+'端口...')})})()粘贴git地址欢迎给star部分运行截图