vue koa2即时聊天，实时推送比特币价格，爬取电影网站 -凯发k8官方网

技术栈

vue vuex vue-router socket.io koa2 mongodb pm2自动化部署 图灵机器人 [npm script打包，cdn同步，服务器上传一个命令全搞定]

功能清单

登陆注册

获取聊天记录（包含前端分页优化）

发送文字，表情，文件消息

创建群组，添加群组，群组搜索

修改个人信息，群组信息

图片裁剪压缩上传

私聊

图灵机器人接入

定时任务爬取电影和btc等数字货币的价格并使用socket.io实时推送给所有客户端

前端一键打包同步到七牛cdn并上传到服务器的实现

server端的pm2自动部署

效果演示chrome下f12或者手机扫描下面的二维码

后端的代码暂时不开放出来，因为涉及到很多个人的配置数据，如果实在需要可以加微信 msc199312 （需要付费0.0！），毕竟这个小项目断断续续也做了几个星期，也还花了些心思，而且涉及的知识点也都还是很广很实用的，还望理解，其实主要原因还是穷[泪奔]

部分代码

客户端 main.js

import vue from 'vue' import app from './app' import router from './router' import vuelazyload from 'vue-lazyload' import store from '@/store' import io from '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' import config from '@/assets/js/config' import filters from '@/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'),// the default is ['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 初始化 const socket = io.connect(config.socketbase) vue.prototype.$socket = socket vue.prototype.$socketemiter = (name, data) => {store.commit('isloading', true)return new promise((resolve) => {socket.emit(name, data, res => {console.log(`${name}>>>`, res)store.commit('isloading', false)if (res.status === 1) {resolve(res.data)} else {opentoast({msg: res.message,duration: 1500})}})}) }/* eslint-disable no-new */ const app = new vue({el: '#app',router,store,template: '',components: { app } })

server端 app.js

const koa = require('koa') const { resolve } = require('path') const glob = require('glob') const { connectdatabase, initallschema, initdefaultuser } = require('./database/init') const config = require('./config')const usemiddlewares = app => {glob.sync(resolve(__dirname, './middlewares', '**/*.js')).foreach(item => {require(item)(app)}) }(async () => {console.log('数据库初始化...')await connectdatabase()initallschema()await initdefaultuser()const app = new koa()console.log('挂载socket.io...')const server = require('http').server(app.callback())const io = require('socket.io').listen(server)require('./socket')(io)// 暴露出io可在其他地方做推送功能module.exports.io = ioconsole.log('挂载中间件...')usemiddlewares(app)console.log('初始化定时任务...')// 多了进行一下封装？require('./tools/crawlmovie')require('./tools/crawlcoin')server.listen(config.server.port, () => {console.log('正在监听' config.server.port '端口...')})})()

部分运行截图

最后贴上git地址欢迎给个star

总结

以上是凯发k8官方网为你收集整理的vue koa2即时聊天，实时推送比特币价格，爬取电影网站的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得凯发k8官方网网站内容还不错，欢迎将凯发k8官方网推荐给好友。