WebSocket初探（socket

====================================================================

聊天室最基本的功能应该有系统通知，聊天内容等。系统通知针对所有socket连接，即是全局广播；聊天内容则是除当前socket用户的非全局广播。还可能存在系统与某个用户的单独消息互动，这则是单播。本文先不涉及room的概念，高手莫怪。

实现方式

======================================================================

socket服务端

---

主要代码如下：

var http = require(‘http’);

var express = require(‘express’);

var app = express();

var server = http.createServer(app)

var io = require(‘socket.io’)(server);

server.listen(app.get(‘port’), function() {

console.log('Express server listening on port ’ + app.get(‘port’));

});

// 监听socket连接

io.on(‘connection’, function (socket) {

// 当某用户连上聊天室socket服务时，给他打个招呼

sendToSingle(socket, {

event: ‘greet_from_server’,

data: 你好${socket.id}

})

// 对其他用户给出通知：某某某加入了聊天室

broadcastExceptSelf(socket, {

event: ‘new_user_join’,

data: {

user: socket.id

}

})

// 监听用户发的聊天内容

socket.on(‘chat’, function (data) {

// 然后广播给其他用户：某某某说了什么

broadcastExceptSelf(socket, {

event: ‘new_chat_content’,

data: {

user: socket.id,

content: data

}

})

});

// 监听socket连接断开

socket.on(‘disconnect’, (reason) => {

// 广播给其他用户：某某某退出了聊天室

broadcastExceptSelf(socket, {

event: ‘someone_exit’,

data: {

user: socket.id

}

})

});

});

// 给当前socket连接单独发消息

function sendToSingle(socket, param) {

socket.emit(‘singleMsg’, param);

}

// 对所有socket连接发消息

function broadcastAll(param) {

io.emit(‘broadcastAll’, param)

}

// 对除当前socket连接的其他所有socket连接发消息

function broadcastExceptSelf(socket, param) {

socket.broadcast.emit(‘broadcast’, param);

}

socket客户端

---

实现方式也比较简单

import io from ‘socket.io-client’;

// 创建和管理socket

createSocket() {

let self = this

this.socket = io(this.$store.state.config.API_ROOT);

this.socket.on(‘connect’, function(){

console.log(‘连上了’)

});

// 这里接收服务端发来的单独消息

this.socket.on(‘singleMsg’, function(msg){

console.log(msg)

switch (msg.event) {

// 如来自服务端的问候，虽然这里没写什么，但是可以据此做一些页面上的效果

case ‘greet_from_server’:

break

default:

break

}

})

// 目前还没用到，可拓展

this.socket.on(‘broadcastAll’, function(msg){

console.log(msg)

})

// 监听广播

this.socket.on(‘broadcast’, function(msg){

console.log(msg)

switch (msg.event) {

// 新用户加入聊天室

case ‘new_user_join’:

self.msgList.push({

time: new Date().toLocaleString(),

user: ‘系统通知’,

content: 用户 ${msg.data.user} 加入了聊天室......

})

break

// 用户退出聊天室

case ‘someone_exit’:

self.msgList.push({

time: new Date().toLocaleString(),

文末

逆水行舟不进则退，所以大家要有危机意识。

同样是干到35岁，普通人写业务代码划水，榜样们深度学习拓宽视野晋升管理。

这也是为什么大家都说35岁是程序员的门槛，很多人迈不过去，其实各行各业都是这样都会有个坎，公司永远都缺的高级人才，只用这样才能在大风大浪过后，依然闪耀不被公司淘汰不被社会淘汰。

为了帮助大家更好温习重点知识、更高效的准备面试，特别整理了《前端工程师核心知识笔记》电子稿文件。

内容包括html，css，JavaScript，ES6，计算机网络，浏览器，工程化，模块化，Node.js，框架，数据结构，性能优化，项目等等。

269页《前端大厂面试宝典》

包含了腾讯、字节跳动、小米、阿里、滴滴、美团、58、拼多多、360、新浪、搜狐等一线互联网公司面试被问到的题目，涵盖了初中级前端技术点。

前端面试题汇总