4月9日讲座websocket-秀田堂主.pptx

Websocket讲座（高级版） HTML5研究小组 秀野堂主 附件： 900多M的cygwin node+socket.io js下操作mysql 我做的案例 聊天室 远程服务器监控 联机作图 前端伤不起 老子几年前进了互联网圈！！！！！！！成了前端工程师，名字是不是很拉风，有木有！！！！！！！！ 尼玛跟老子讲前台代码简单！！！出入高级写字楼，薪水高！！！！！！！！！！！！！！！！ 入行才2K起啊！！！！2K在帝都都够毛用啊！！！！ 尼玛简单个毛线啊！！ HTML、XHTML、XML、json...有木有！！！ CSS要写一堆兼容代码有木有！！！！图片素材要合并有木有！！！ JavaScript、OOP、什么线程、请求、异步、优化！！内存泄漏！！有木有啊有木有！！！！！！ 尼玛说你呢！！！就你张嘴傻乐的！！！！ 不用IE6会死啊！！！！升级下浏览器会死啊！！！！ 还有IE6/7/8/9！！！！！！！神马Firefox、Chrome、Safari！！！神马Android、iPhone、iPad！！！ 全尼玛是浮云啊！！浮云啊！！！ 为毛这么多浏览器！！还要都兼容啊！！！！坑爹呢啊！！！  尼玛天天赶项目要加班啊！！！！ 加班比吃饭还正常啊！！！！ 最恶心的是辛辛苦苦写的代码啊！！！ 尼玛上线了还要改啊！！！ 最后改的面目全非啊！！！！！！ 技术更新比翻书还快啊！！ 神马HTML5、CSS3啊！！！！！！ 离线、圆角、动画、视频、音频尼玛想让前端把活都揽了啊！！！！！！！！ 尼玛英文能力还要好啊！！！ 要不看不懂大老外写的博客啊！！！ 尼玛哥又不是英语专业的啊！！！！！ 尼玛产品出BUG了先查前端代码啊！！！ 是不是前台的问题都丢给前端啊！！ 哥是超人吗！！？尼玛提供的数据就是那个操行，哥能去改服务器啊！！！ 尼玛当初不是说你说这么改的吗 最后尼玛又让哥改回去！！！！！！！！！！ 坑爹啊！！！ 总之 做前端的尼玛你伤不起啊啊啊啊啊啊！！！！！  后台开发只扔一堆数据就不管了啊！！！！！！！！ 设计哥扔下PSD就完事了啊！！！ 尼玛哥要高保真还原啊！！！尼玛领导要1px对齐啊！！！ 尼玛残品哥要这样那样的动态效果啊！！！ 尼玛都是要做死啊！！ 为毛做后台开发就高级啊！！！ 前端开发就没技术含量啊！！！ 残品哥很淡定的说：这个很好搞嘛！！ 好搞你妹啊！你以为哥是拿意念写代码的啊！！ 哥要一行一行写几千行代码啊！！！  Ws与xhr的区别 互联网 Or 局域网 Or 其它网络结构 http server Upgrade-handshake 双工，持续，快速，事件 IE6、7、8、9 broswer Chrome Safrai、Opera 其它穿着马甲的IE broswer xhr xhr xhr ws ws ws xhr 猥琐（websocket）的模型与计算图 broswer Ws-server Ws://ip:端口 握手 （开始状态判断） 帧通信 ws头尾加密 一个WEB客户端只建立一个TCP连接 服务端可以推送数据到web客户端 头部轻，数据传送量少 通信量的计算公式 设： 每天接受1万个IP 每个IP每次浏览10次 每次浏览产生100K的数据 每个http头1K 每个ws头1.01K 计算： 在http请求下，每个点击都需要http头+内容 通信量：(100+1)K*10000*10=10,100,000K 服务器连接数量： CPU与内容消耗： 在ws下，一次连接，全程使用 通信量：(100+1)K*10000*10=10,100,000K 服务器连接数量： CPU与内容消耗： 用11句话来概括websocket 我习惯上称之为ws协议（猥琐协议） 这是帧通信 他是http协议的增强升级。又称为http 1.1 双向双工 可持续性的独立通信事件 毫秒级通信，高实时 基于浏览器 目前还是draft状态 在proxy环境下有麻烦 Ws(猥琐)协议是基于事件编程，有动作就有响应 你可以根据websocket协议（猥琐协议）写出私有猥琐服务器 写一个websocket应用是很容易的 条件： 架设好websocket服务器 在支持websocket的浏览器发出ws请求 注意： 注意跟踪连接的状态 注意通信中使用的是stream还是string 使用事件 node,sock.io与websocket的关系 broswer v8 js node os hardware Node.js