hello,我是肖大侠😎
历经含辛茹苦，总算是把一个勉强能聊天的聊天室部署上服务器了…
还没快乐几天，服务器给搞挂了好几次😤
没方法，基本顾不上思考性能问题，只能先临时敞开了，
后果因为一些起因，这一扔就是半年，最近我又筹备重新部署一次的时候发现齐全遗记不会了，😭
踩了很多坑，却没有做什么记录，当初给我的感觉就是…白做了，除了有一些含糊的印象，根本忘了哪些问题该怎么解决了，😵😵😵
所以这次就从头开始，从新做一遍部署一遍，做一个残缺的记录✌
这次记录次要分为两个局部：
第一局部次要就是一些基础知识，以及应用vue和python的flask框架在本地实现一个超繁难版本的在线聊天室
第二局部就要用python的Django框架实现一个残缺性能的聊天室，并且须要部署在服务器上
那就废话不多说，先温习一下什么是webSocket
==最初再再提一嘴，如果有小伙伴打算跟着我一起做，所有依赖的版本最好跟我的统一，至于为什么…都是血泪的教训😰，很多时候你会发现自己的配置完全正确，找不到问题在哪，然而就不能实现通信，那就是依赖版本的问题，在本地这个问题还不显著，上了服务器就是一堆报错==
从TCP/IP四层模型到http协定再到webSocket协定
首先咱们都相熟http协定。
http协定是基于tcp通信的工作在应用层的协定
webSocket也是一种协定，也基于tcp，也工作在应用层
上图展现了tcp/Ip四层模型的根本内容
现今的web服务，大体上都是客户端，也就是用户应用的浏览器首先和服务器建设TCP连贯，执行申请，确认，建设连贯三个步骤，即赫赫有名的”三次握手”😍
建设TCP连贯之后，其实客户端和服务端曾经能够收发数据了，然而网络上这么多设施，你用一种形式发送数据，他人又用另一种形式发送数据，这就无奈解决了，因而应用层的一些协定应运而生，标准大家应用同样的格局来收发数据
http就是一个十分典型的应用层协定
当浏览器须要从服务端获取数据渲染页面的时候，即收回一次http申请。http通过tcp建设一个牢靠的传输通道，发送申请到服务器上。服务器接管到申请随即响应申请，返回数据到浏览器，
重点来了，当客户端，即用户的浏览器拿到本次申请的数据之后，http协定会立刻将之前建设的tcp连贯断开，一次申请过程是很短的，
==所以，http连贯是一种短连贯，无状态的连贯==
真的就只是这样吗？不不不不，http1.1之后，默认设置长链接keep-alive为true，此时，http是一个长连贯的状态，浏览器与服务端建设tcp通道之后，浏览器能够发动屡次申请，服务端同时响应屡次申请，返回相应的数据，
而不是像之前所说的，每次申请实现都会立刻敞开tcp信道。
至此，如果咱们只依赖http协定来实现一个聊天室，你会发现仍然是有限度的，😡😡😡
聊天和平时浏览网页不同，在同一时间可能会有多集体同时发送音讯，这些音讯发送到服务器之后，又须要立刻推送给聊天室中的其余用户
认真看上述的http简介，你会发现基于http协定永远只能浏览器去发送申请，服务器能力做响应，不同的用户发消息当然能够看做一次申请，将音讯发送到服务器上，
那服务器如何将这些音讯推送给用户呢？除非用户再次被动发送申请，来获取服务器上的最新数据
总不能做一个刷新按钮，让用户通过一直点击来更新音讯吧？
于是你可能想到写一个循环或者定时器，让浏览器每隔一秒或几秒就发送一次申请，来更新数据，这样做当然能够，
事实上有一些网站为了实现服务器推送，应用的都是这种轮询技术，
但咱们也能很显著的感觉到这样做是不妥的，这样一直发送申请的形式导致大量有效数据在浏览器与服务端之间通信，造成带宽的节约，
以后也有一些新的技术去实现轮询，例如Comet，但这些新的技术仍然防止不了浏览器与服务端之间的大量有效通信。😩😩😩
http1.1的这种通信形式，被称为半双工通信。
1、单工通信：数据永远只被容许在一个方向上传输，即永远只能由一方来发送数据，另一方接收数据
2、半双工通信：数据被容许在两个方向上传输，但同一时间内，只能有一方发送数据，另一方接收数据
3、全双工通信：数据在任何工夫都被容许在两个方向上传输，单方都能够随时收发数据
聊天室聊天显然是一种全双工的通信形式，应用半双工的http协定尽管也能够实现，但咱们有更好的货色，那就是webSocket协定。
==webSocket是一个工作在应用层的，建设在tcp协定之上的全双工通信协议==
⭐⭐⭐⭐⭐重要的阐明⭐⭐⭐⭐⭐
咱们应用webSocket协定来实现实时通信，是因为webSocket反对长连贯，反对全双工的个性，而不是仅仅是为了找一个长连贯全双工通信协议抉择了它。目前web服务反对全双工的协定十分多，包含http协定，http2.0本质上曾经反对了全双工通信，但http2.0并不适宜来开发聊天室
注：tcp协定是一个全双工的通信协议
webSocket简介
上文曾经提到，WebSocket是一种在单个TCP连贯上进行全双工通信的协定。
WebSocket使得客户端和服务器之间的数据交换变得更加简略，容许服务端被动向客户端推送数据。在WebSocket API中，浏览器和服务器只须要实现一次握手，两者之间就间接能够创立持久性的连贯，并进行双向数据传输。
webSocket有如下特点：
1、较少的管制开销。在连贯创立后，服务器和客户端之间替换数据时，用于协定管制的数据包头部绝对较小。在不蕴含扩大的状况下，对于服务器到客户端的内容，此头部大小只有2至10字节（和数据包长度无关）；对于客户端到服务器的内容，此头部还须要加上额定的4字节的掩码。绝对于HTTP申请每次都要携带残缺的头部，此项开销显著缩小了。
2、更强的实时性。因为协定是全双工的，所以服务器能够随时被动给客户端下发数据。绝对于HTTP申请须要期待客户端发动申请服务端能力响应，提早显著更少；即便是和Comet等相似的长轮询比拟，其也能在短时间内更屡次地传递数据。
3、放弃连贯状态。与HTTP不同的是，Websocket须要先创立连贯，这就使得其成为一种有状态的协定，之后通信时能够省略局部状态信息。而HTTP申请可能须要在每个申请都携带状态信息（如身份认证等）。
4、更好的二进制反对。Websocket定义了二进制帧，绝对HTTP，能够更轻松地解决二进制内容。
5、能够反对扩大。Websocket定义了扩大，用户能够扩大协定、实现局部自定义的子协定。如局部浏览器反对压缩等。
6、更好的压缩成果。绝对于HTTP压缩，Websocket在适当的扩大反对下，能够沿用之前内容的上下文，在传递相似的数据时，能够显著地进步压缩率。
😁以上常识均来自百度百科😁
所以webSocket到底是什么呢？它其实和http是兄弟关系，webSocket就是基于http1.1做的。
之前也说了，http是基于tcp工作在应用层的，webSocket也是基于tcp工作的应用层的，那http作为老大哥，曾经实现了tcp通道的建设，那我webSocket作为小弟，天然就没有必要再去建设tcp通道了，
webSocket个别是先通过http进行三次握手建设连贯，连贯建设之后，再通知服务器，我这不是http通信，而是webSocket通信，等于是做了一次降级
通过一通花里胡哨的操作之后，webSocket连贯胜利！此时浏览器和服务器之间处于一个能够相互收发音讯的状态。
尽管webSocket建设连贯的过程是借助http协定的，但连贯建设之后，收发申请就不再应用http协定了。
除此之外，有web开发教训的同学可能分明http协定有一个十分十分头疼的货色，那就是同源策略，跨域问题，
然而webSocket自身是没有跨域限度的（美滋滋儿✨✨✨）
webSocket是真正的全双工通信，建设连贯之后客户端与服务端齐全平等，相较于旧的轮询技术，极大的节约了资源。
最初，置信你也看到tcp/ip四层模型中存在一个socket形象层，这其实就是tcp/ip协定提供的一组api，它把TCP/IP层简单的操作形象为几个简略的接口供应用层调用已实现过程在网络中通信。
那webSocket和socket是什么关系？简略来说，
1、webSocket是协定，但socket并不是
2、webSocket工作在应用层，soket是传输层与应用层之间的的一个形象层，程序员在应用层应用soket api进行编程，它并不是协定
Socket是应用层与TCP/IP协定族通信的两头软件形象层，它是一组接口。在设计模式中，Socket其实就是一个门面模式，它把简单的TCP/IP协定族暗藏在Socket接口前面，对用户来说，一组简略的接口就是全副，让Socket去组织数据，以合乎指定的协定。
3、简而言之，http和socket是啥关系，webSocket和socket就是啥关系。
框架简介
1、Vue (读音 /vjuː/，相似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为能够自底向上逐层利用。Vue 的外围库只关注视图层，不仅易于上手，还便于与第三方库或既有我的项目整合。另一方面，当与现代化的工具链以及各种反对类库联合应用时，Vue 也齐全可能为简单的单页利用提供驱动。
Vue.js 能够说是MVVM 架构的最佳实际，是一个JavaScriptMVVM库，是一套构建用户界面的渐进式框架。专一于 MVVM 中的 ViewModel，不仅做到了数据双向绑定，而且也是一款绝对比拟轻量级的JS 库，API 简洁
2、Flask是一个应用 Python 编写的轻量级 Web 利用框架。其 WSGI 工具箱采纳 Werkzeug ，模板引擎则应用 Jinja2 。Flask应用 BSD 受权。
Flask也被称为 “microframework” ，因为它应用简略的外围，用 extension 减少其余性能。Flask没有默认应用的数据库、窗体验证工具。
3、Django是一个凋谢源代码的Web利用框架，由Python写成。采纳了MTV的框架模式，即模型M，视图V和模版T。它最后是被开发来用于治理劳伦斯出版团体旗下的一些以新闻内容为主的网站的，即是CMS（内容管理系统）软件。并于2005年7月在BSD许可证下公布。这套框架是以比利时的吉普赛爵士吉他手Django Reinhardt来命名的。
其实也没啥好说的，间接照搬百度百科了。
vue置信做前端的都晓得，flask和django是python的web框架，没了😂😂😂😂😂
那这次就先写到这吧，😃😃
拜拜~✋
哦对了，本地环境的聊天室我放在gitee上啦，焦急的小伙伴能够先看一下代码，
不过这个货色做的比拟急比拟仓促，所以代码写的很俊俏，多多包涵😣😣
传送门 web在线聊天室-本地flask版
发表回复