【笔记】 《js权威指南》- 第18章 脚本化HTTP - 18.2 JSONP - 18.3 Comet推
2016-04-20 10:33
381 查看
1.JSONP跨域请求:
2.Comet推:
兼容实现:
function getJSONP(url, callBack) { var cbnum = "cb" + getJSONP.counter++; var cbname = "getJSONP." + cbnum; if (url.indexOf("?") === -1) url += "?jsonp=" + cbnamme; else url += "&jsonp=" + cbname; var script = document.createElement("script"); getJSONP[cbnum] = function(response) { try { callback(response); } finally { delete getJONP[cbnum]; script.parentNode.removeChild[script]; } }; script.src = url; document.body.appendChild(script); } getJSONP.counter = 0;
2.Comet推:
var ticker = new EventSource("stockprices.php"); ticker.onmessage = function(e) { var type = e.type; var data = e.data; };
兼容实现:
if (window.EventSource === undefined) { window.EventSource = function(url) { var xhr; var evtsrc = this; var charsReceived = 0; var type = null; var data = ""; var eventName = "message"; var lastEventId = ""; var retrydelay = 1000; var aborted = false; xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { switch(xhr.readyState) { case 3: processData(); break; case 4: reconnect(); break; } }; connect(); function reconnect() { if (aborted) return; if (xhr.status >= 300) return; setTimeout(connect, retrydelay); }; function connect() { charsReceived = 0; type = null; xhr.open("GET", url); xhr.setRequestHeader("Cache-Control", "no-cache"); if (lastEventId) xhr.setRequestHeader("Last-Event-ID", lastEventId); xhr.send(); }; function processData() { if (!type) { type = xhr.getResponseHeader("Content-Type"); if (type !== "text/event-stream") { aborted = true; xhr.abort(); return; } } var chunk = xhr.responseText.substring(charsReceived); charsReceived = xhr.responseText.length; var lines = chunk.replace(/(\r\n|\r|\n)$/, "").split(/\r\n|\r|\n/); for (var i = 0; i < lines.lenght; i++) { var line = lines[i], pos = line.indexOf(":"), name, value=""; if (pos == 0) continue; if (pos > 0) { name = line.substring(0, pos); value = line.substring(pos+1); if (value.charAt(0) == " ") value = value.substring(1); } else name = line; switch(name) { case "event": eventName = value; break; case "data": data += value + "\n"; break; case "id": lastEventId = value; break; case "retry": retrydelay = parseInt(value) || 1000; break; default: break; } //空行发送 if (line === "") { if (evtsrc.onmessage && data !== "") { if (data.charAt(data.length - 1) == "\n") data = data.substring(0, data.length - 1); evtsrc.onmessage({type: eventName, data: data, origin: url}); } data = ""; continue; } } }; }; }
相关文章推荐
- Ajax
- $.ajax()方法详解
- jQuery ajax - ajax() 方法
- 解决Ajax悬停效果,无法遮蔽FLASH的问题
- 再谈Jquery Ajax方法传递到action(补充)
- Dom在ajax技术中的作用说明
- 使用Ajax实时检测"用户名、邮箱等"是否已经存在
- 探讨Ajax中同步与异步之间的区别
- vbs 解析json jsonp的方法
- ajax中data传参的两种方式分析
- 原生AJAX写法实例分析
- 探秘ajax跨域请求
- Ajax实现简单下拉选项效果【推荐】
- JQuery ajax返回JSON时的处理方式 (三种方式)
- Ajax中浏览器和服务器交互详解
- ajax实现点击不同的链接让返回的内容显示在特定div里
- ajax 动态传递jsp等页面使用id辨识传递对象
- ajax与传统web开发的异同点
- AJAX简单应用实例-弹出层
- nginx用反向代理机制解决跨域的问题