Posts

1. AWS EC2 不支持WebSocket 直达解决方案 英文版 简单说一下思路：WebSocket底层基于TCP协议的，如果你的服务器基于HTTP协议暴露80端口，那WebSocket肯定无法连接。你只要将HTTP协议修改成TCP协议就可以了。 然后是安全组的配置： 同样如果使用了NGINX作为反向代理，那么NGINX也需要做配置的。 // https://gist.githubusercontent.com/unshift/324be6a8dc9e880d4d670de0dc97a8ce/raw/29507ed6b3c9394ecd7842f9d3228827cffd1c58/elasticbeanstalk_websockets files: "/etc/nginx/conf.d/01_websockets.conf" : mode: "000644" owner: root group: root content : | upstream nodejs { server 127.0.0.1:8081; keepalive 256; } server { listen 8080; location / { proxy_pass http://nodejs; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_http_version 1.1; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } } "/opt/elasticbeanstalk/hooks/appdeploy/enact/41_remove_eb_nginx_confg.sh": mode: "000755" owner: root group: root content : | mv /etc/nginx/conf.d/00_elastic_beanstalk_proxy.conf /etc/nginx/conf.d/00_elastic_beanstalk_proxy.conf.old 2. NGINX做反向代理是需要注意的问题 如果排除所有问题后，那剩下的问题可以考虑出在反向代理上，一下有几点是可以考虑的。 ...

0 阅前须知 本文并不是教程，只是实现方案 我只是从WEB端考虑这个问题，实际还需要后端sip服务器的配合 jsSIP有个非常不错的在线demo, 可以去哪里玩耍，很好玩呢 try jssip 1. 技术简介 WebRTC: WebRTC，名称源自网页即时通信（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的API。它于2011年6月1日开源并在Google、Mozilla、Opera支持下被纳入万维网联盟的W3C推荐标准 SIP: 会话发起协议（Session Initiation Protocol，缩写SIP）是一个由IETF MMUSIC工作组开发的协议，作为标准被提议用于创建，修改和终止包括视频，语音，即时通信，在线游戏和虚拟现实等多种多媒体元素在内的交互式用户会话。2000年11月，SIP被正式批准成为3GPP信号协议之一，并成为IMS体系结构的一个永久单元。SIP与H.323一样，是用于VoIP最主要的信令协议之一。 一般来说，要么使用实体话机，要么在系统上安装基于sip的客户端程序。实体话机硬件成本高，基于sip的客户端往往兼容性差，无法跨平台，易被杀毒软件查杀。 而WebRTC或许是更好的解决方案，只要一个浏览器就可以实时语音视频通话，这是很不错的解决方案。WebSocket可以用来传递sip信令，而WebRTC用来实时传输语音视频流。 2. 前端WebRTC实现方案 其实我们不需要去自己处理WebRTC的相关方法，或者去处理视频或者媒体流。市面上已经有不错的模块可供选择。 2.1 jsSIP jsSIP是JavaScript SIP 库 功能特点如下： 可以在浏览器或者Nodejs中运行 使用WebSocket传递SIP协议 视频音频实时消息使用WebRTC 非常轻量 100%纯JavaScript 使用简单并且具有强大的Api 服务端支持 OverSIP, Kamailio, Asterisk, OfficeSIP，reSIProcate，Frafos ABC SBC，TekSIP 是RFC 7118 and OverSIP的作者写的 下面是使用JsSIP打电话的例子，非常简单吧 // Create our JsSIP instance and run it: var socket = new JsSIP.WebSocketInterface('wss://sip.myhost.com'); var configuration = { sockets : [ socket ], uri : 'sip:alice@example.com', password : 'superpassword' }; var ua = new JsSIP.UA(configuration); ua.start(); // Register callbacks to desired call events var eventHandlers = { 'progress': function(e) { console.log('call is in progress'); }, 'failed': function(e) { console.log('call failed with cause: '+ e.data.cause); }, 'ended': function(e) { console.log('call ended with cause: '+ e.data.cause); }, 'confirmed': function(e) { console.log('call confirmed'); } }; var options = { 'eventHandlers' : eventHandlers, 'mediaConstraints' : { 'audio': true, 'video': true } }; var session = ua.call('sip:bob@example.com', options); 2.2 SIP.js sip.js项目实际是fork自jsSIP的，这里主要介绍它的服务端支持情况。其他接口自己自行查阅 ...

简易服务器：在命令执行的所在路径启动一个http服务器，然后你可以通过浏览器访问该路径下的所有文件。 在局域网内传文件，或者自己测试使用都是非常方便的。 1. 基于python 1.1. 基于Python2 python -m SimpleHTTPServer port > python -m SimpleHTTPServer 8099 Serving HTTP on 0.0.0.0 port 8099 ... 127.0.0.1 - - [24/Oct/2017 11:07:56] "GET / HTTP/1.1" 200 - 1.2. 基于python3 python3 -m http.server port > python3 -m http.server 8099 Serving HTTP on 0.0.0.0 port 8099 (http://0.0.0.0:8099/) ... 127.0.0.1 - - [24/Oct/2017 11:05:06] "GET / HTTP/1.1" 200 - 127.0.0.1 - - [24/Oct/2017 11:05:06] code 404, message File not found 127.0.0.1 - - [24/Oct/2017 11:05:06] "GET /favicon.ico HTTP/1.1" 404 - 2. 基于nodejs 首先你要安装nodejs ...

本例子是参考webrtc-tutorial-simple-video-chat做的。 这个教程应该主要是去宣传ScaleDrone的sdk, 他们的服务是收费的，但是免费的也可以用，就是有些次数限制。 本栗子的地址 本栗子的pages地址 因为使用的是ScaleDrone的js sdk, 后期很可能服务不稳定之类的 1. 准备 使用最新版谷歌浏览器（62版） 视频聊天中 一个是windows, 一个是mac stun服务器使用谷歌的，trun使用ScaleDrone的sdk，这样我就不用管服务端了。 2. 先上效果图 3. 再上在线例子点击此处 4. 源码分析 // 产生随机数 if (!location.hash) { location.hash = Math.floor(Math.random() * 0xFFFFFF).toString(16); } // 获取房间号 var roomHash = location.hash.substring(1); // 放置你自己的频道id, 这是我注册了ScaleDrone 官网后，创建的channel // 你也可以自己创建 var drone = new ScaleDrone('87fYv4ncOoa0Cjne'); // 房间名必须以 'observable-'开头 var roomName = 'observable-' + roomHash; var configuration = { iceServers: [{ urls: 'stun:stun.l.google.com:19302' // 使用谷歌的stun服务 }] }; var room; var pc; function onSuccess() {} function onError(error) { console.error(error); } drone.on('open', function(error){ if (error) { return console.error(error);} room = drone.subscribe(roomName); room.on('open', function(error){ if (error) {onError(error);} }); // 已经链接到房间后，就会收到一个 members 数组，代表房间里的成员 // 这时候信令服务已经就绪 room.on('members', function(members){ console.log('MEMBERS', members); // 如果你是第二个链接到房间的人，就会创建offer var isOfferer = members.length === 2; startWebRTC(isOfferer); }); }); // 通过Scaledrone发送信令消息 function sendMessage(message) { drone.publish({ room: roomName, message }); } function startWebRTC(isOfferer) { pc = new RTCPeerConnection(configuration); // 当本地ICE Agent需要通过信号服务器发送信息到其他端时 // 会触发icecandidate事件回调 pc.onicecandidate = function(event){ if (event.candidate) { sendMessage({ 'candidate': event.candidate }); } }; // 如果用户是第二个进入的人，就在negotiationneeded 事件后创建sdp if (isOfferer) { // onnegotiationneeded 在要求sesssion协商时发生 pc.onnegotiationneeded = function() { // 创建本地sdp描述 SDP (Session Description Protocol) session描述协议 pc.createOffer().then(localDescCreated).catch(onError); }; } // 当远程数据流到达时，将数据流装载到video中 pc.onaddstream = function(event){ remoteVideo.srcObject = event.stream; }; // 获取本地媒体流 navigator.mediaDevices.getUserMedia({ audio: true, video: true, }).then( function(stream) { // 将本地捕获的视频流装载到本地video中 localVideo.srcObject = stream; // 将本地流加入RTCPeerConnection 实例中 发送到其他端 pc.addStream(stream); }, onError); // 从Scaledrone监听信令数据 room.on('data', function(message, client){ // 消息是我自己发送的，则不处理 if (client.id === drone.clientId) { return; } if (message.sdp) { // 设置远程sdp, 在offer 或者 answer后 pc.setRemoteDescription(new RTCSessionDescription(message.sdp), function(){ // 当收到offer 后就接听 if (pc.remoteDescription.type === 'offer') { pc.createAnswer().then(localDescCreated).catch(onError); } }, onError); } else if (message.candidate) { // 增加新的 ICE canidatet 到本地的链接中 pc.addIceCandidate( new RTCIceCandidate(message.candidate), onSuccess, onError ); } }); } function localDescCreated(desc) { pc.setLocalDescription(desc, function(){ sendMessage({ 'sdp': pc.localDescription }); },onError); } 5. WebRTC简介 5.1. 介绍 WebRTC 是一个开源项目，用于Web浏览器之间进行实时音频视频通讯，数据传递。 WebRTC有几个JavaScript APIS。 点击链接去查看demo。 ...

本文来自于公司内部的一个分享。 在文档方面，对内的一些接口文档主要是用swagger来写的。虽然可以在线测试，比较方便。但是也存在着一些更新不及时，swgger文档无法导出成文件的问题。 在对外提供的文档方面：我主要负责做一个浏览器端的一个js sdk。文档还算可以github地址，所以想把一些写文档的心得分享给大家。 1. 衡量好文档的唯一标准是什么？ Martin(Bob大叔)曾在《代码整洁之道》一书打趣地说：当你的代码在做 Code Review 时，审查者要是愤怒地吼道： “What the fuck is this shit?” “Dude, What the fuck！” 等言辞激烈的词语时，那说明你写的代码是 Bad Code，如果审查者只是漫不经心的吐出几个 “What the fuck?”， 那说明你写的是 Good Code。衡量代码质量的唯一标准就是每分钟骂出“WTF” 的频率。 衡量文档的标准也是如此。 2. 好文档的特点 简洁：一句话可以说完的事情，就不要分两句话来说。并不是文档越厚越好，太厚的文档大多没人看。 准确: 字段类型，默认值，备注，是否必填等属性说明。 逻辑性: 文档如何划分？ 利于查看。 demo胜千言: 好的demo胜过各种字段说明，可以复制下来直接使用。 读者心: 从读者的角度考虑, 方法尽量简洁。可以传递一个参数搞定的事情，绝对不要让用户去传两个参数。 及时更新: 不更新的文档比bug更严重。 向后兼容: 不要随意废弃已有的接口或者某个字段，除非你考虑到这样做的后果。 建立文档词汇表：每个概念只有一个名字，不要随意起名字，名不正则言不顺。 格式统一：例如时间格式。我曾见过2017-09-12 09:32:23, 或2017.09.12 09:32:23或2017.09.12 09:32:23。变量名user_name, userName。 使用专业词语：不要过于口语化 3. 总结: 写出好文档要有以下四点 逻辑性：便于查找 专业性: 值得信赖，质量保证 责任心：及时更新，准确性，向后兼容 读者心：你了解的东西，别人可能并不清楚。从读者的角度去考虑，他们需要什么，而不是一味去强调你能提供什么。 4. 写文档的工具 markdown: 方便快捷，可以导出各种格式的文件 swagger: 功能强大，需要部署，不方便传递文件 5. markdown 工具推荐 蚂蚁笔记 这是我正使用的。 全平台（mac windows ios）有客户端，和浏览器端 笔记可以直接公布为博客 支持独立域名 标签很好用 支持思维导图 支持历史记录 cmd-markdown 有道云笔记 6. 文档之外 公司有个同事，我曾问他使用什么搜索一些技术文档，他说用百度。作为一个翻墙老司机，我惊诧的问他：你为什么不用谷歌去搜索。他说他不会翻墙。我只能呵呵一笑。 ...

1. 问题现象 使用netstat -ntp命令时发现，Recv-Q 1692012 异常偏高（正常情况下，该值应该是0），导致应用占用过多的内存。 tcp 1692012 0 172.17.72.4:48444 10.254.149.149:58080 ESTABLISHED 27/node 问题原因：代理的转发时，没有删除逐跳首部 2. 什么是Hop-by-hop 逐跳首部？ http首部可以分为两种 端到端首部 End-to-end: 端到端首部代理在转发时必须携带的 逐跳首部 Hop-by-hop: 逐跳首部只对单次转发有效，代理在转发时，必须删除这些首部 逐跳首部有以下几个, 这些首部在代理进行转发前必须删除 Connetion Keep-Alive Proxy-Authenticate Proxy-Authortization Trailer TE Transfer-Encodeing Upgrade 3. 什么是哑代理？ 很多老的或简单的代理都是盲中继(blind relay),它们只是将字节从一个连接转发到另一个连接中去,不对Connection首部进行特殊的处理。 (1)在图4-15a中 Web客户端向代理发送了一条报文,其中包含了Connection:Keep-Alive首部,如果可能的话请求建立一条keep-alive连接。客户端等待响应,以确定对方是否认可它对keep-alive信道的请求。 (2) 哑代理收到了这条HTTP请求,但它并不理解 Connection首部(只是将其作为一个扩展首部对待)。代理不知道keep-alive是什么意思,因此只是沿着转发链路将报文一字不漏地发送给服务器(图4-15b)。但Connection首部是个逐跳首部,只适用于单条传输链路,不应该沿着传输链路向下传输。接下来,就要发生一些很糟糕的事情了。 (3) 在图4-15b中,经过中继的HTTP请求抵达了Web服务器。当Web服务器收到经过代理转发的Connection: Keep-Alive首部时,会误以为代理(对服务器来说,这个代理看起来就和所有其他客户端一样)希望进行keep-alive对话!对Web服务器来说这没什么问题——它同意进行keep-alive对话,并在图4-15c中回送了一个Connection: Keep-Alive响应首部。所以,此时W eb服务器认为它在与代理进行keep-alive对话,会遵循keep-alive的规则。但代理却对keep-alive一无所知。不妙。 (4) 在图4-15d中,哑代理将Web服务器的响应报文回送给客户端,并将来自Web服务器的Connection: Keep-Alive首部一起传送过去。客户端看到这个首部,就会认为代理同意进行keep-alive对话。所以,此时客户端和服务器都认为它们在进行keep-alive对话,但与它们进行对话的代理却对keep-alive一无所知。 (5) 由于代理对keep-alive一无所知,所以会将收到的所有数据都回送给客户端,然后等待源端服务器关闭连接。但源端服务器会认为代理已经显式地请求它将连接保持在打开状态了,所以不会去关闭连接。这样,代理就会挂在那里等待连接的关闭。 (6) 客户端在图4-15d中收到了回送的响应报文时,会立即转向下一条请求,在keep-alive连接上向代理发送另一条请求(参见图4-15e)。而代理并不认为同一条连接上会有其他请求到来,请求被忽略,浏览器就在这里转圈,不会有任何进展了。 (7) 这种错误的通信方式会使浏览器一直处于挂起状态,直到客户端或服务器将连接超时,并将其关闭为止。 –《HTTP权威指南》 这是HTTP权威指南中，关于HTTP哑代理的描述。这里这里说了哑代理会造成的一个问题。 这种错误的通信方式会使浏览器一直处于挂起状态,直到客户端或服务器将连接超时,并将其关闭为止。 实际上，我认为哑代理还是造成以下问题的原因 TCP链接高Recv-Q tcp链接不断开，导致服务器内存过高，内存泄露 节点iowait高 在我们自己的代理的代码中，我有发现，在代理进行转发时，只删除了headers.host, 并没有删除headers.Connection等逐跳首部的字段 delete req.headers.host var option = { url: url, headers: req.headers } var proxy = request(option) req.pipe(proxy) proxy.pipe(res) 4. 解决方案 解决方案有两个， 我推荐使用第二个方案，具体方法参考Express 代理中间件的写法 ...

1. HTTPS域向HTTP域发送请求会被浏览器直接拒绝，HTTP向HTTPS则不会 例如在github pages页面，这是一个https页面，如果在这个页面向http发送请求，那么会直接被浏览器拒绝，并在控制台输出下面的报错信息。 jquery-1.11.3.min.js:5 Mixed Content: The page at 'https://wangduanduan.github.io/ddddddd/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://cccccc/log/conf?token=welljoint'. This request has been blocked; the content must be served over HTTPS. 如果你在做第三方集成的系统，如果他们是在浏览器中直接调用你提供的接口，那么最好你使用https协议，这样无论对方是https还是http都可以访问。（相信我，这个很重要，我曾经经历过上线后遇到这个问题，然后连夜申请证书，把http升级到https的痛苦经历） 2. HTTPS的默认端口是443，而不是443 如果443端口已经被其他服务占用了，那么使用其他任何没有被占用的端口都可以用作HTTPS服务，只不过在请求的时候需要加上端口号罢了。 3. 如何快速隐藏一个DOM元素 选中一个元素，然后按h,这时候就会在选中的DOM元素上加上__web-inspector-hide-shortcut__类，这个类会让元素隐藏。谷歌和火狐上都可以，IE上没有试过行不行。

1. 内容概要 CSTA协议与标准概述 CSTA OpenScape 语音架构概述 2. CSTA协议标准 2.1. 什么是CSTA ? CSTA：电脑支持通讯程序(Computer Supported TelecommunicationsApplications) 基本的呼叫模型在1992建立，后来随着行业发展，呼叫模型也被加强和扩展，例如新的协议等等 CSTA是一个应用层接口，用来监控呼叫，设备和网络 CSTA创建了一个通讯程序的抽象层: CSTA并不依赖任何底层的信令协议 E.g.H.323,SIP,Analog,T1,ISDN,etc. CSTA并不要求用户必须使用某些设备 E.g.intelligentendpoints,low-function/stimulusdevices,SIPSignalingmodels-3PCC vs. Peer/Peer 适用不同的操作模式 第三方呼叫控制 一方呼叫控制 CSTA的设计目标是为了提高各种CSTA实现之间的移植性 规范化呼叫模型和行为 完成服务、事件定义 规范化标准 3. CSTA 标准的进化史 阶段1 (发布于 June ’92) 40 特性, 66 页 (服务定义) 专注于呼叫控制 阶段2 (发布于 Dec. ’94) 77 特性, 145 页 (服务定义) I/O & 语音单元服务, 更多呼叫控制服务 阶段3 - CSTA Phase II Features & versit CTI Technology 发布于 Dec. ‘98 136 特性, 650 页 (服务定义) 作为ISO 标准发布于 July 2000 发布 CSTA XML (ECMA-323) June 2004 发布 “Using CSTA with Voice Browsers” (TR/85) Dec. 02 发布 CSTA WSDL (ECMA-348) June 2004 June 2004: 发布对象模型 TR/88 ...