資訊專欄INFORMATION COLUMN
摘要：使用方法服務(wù)器接收其它類型的事件服務(wù)器端中在傳輸數(shù)據(jù)時將頭中的設(shè)置為使用方法屬性使用二進(jìn)制的數(shù)據(jù)類型連接服務(wù)器選擇的下屬協(xié)議只讀鏈接狀態(tài)只讀未發(fā)送至服務(wù)器的字節(jié)數(shù)只讀服務(wù)器選擇的擴(kuò)展只讀關(guān)閉前的回調(diào)函數(shù)連接失敗后的回調(diào)函數(shù)從服務(wù)器接受到
EventSource
使用方法
var evtSource = new EventSource(url); // 服務(wù)器URL
接收
evtSource.onmessage = function(e) {
var newElement = document.createElement("li");
newElement.innerHTML = "message: " + e.data;
document.body.appendChild(newElement);
}
其它類型的事件
evtSource.addEventListener("ping", function(e) {
var newElement = document.createElement("li");
var obj = JSON.parse(e.data);
newElement.innerHTML = "ping at " + obj.time;
document.body.appendChild(newElement);
}, false);
web code demo
server code demo
使用方法
var ws = new WebSocket("ws://localhost:8080", [protocols]);
屬性
ws.binaryType //使用二進(jìn)制的數(shù)據(jù)類型連接
ws.protocol //服務(wù)器選擇的下屬協(xié)議只讀
ws.readyState //鏈接狀態(tài)只讀
ws.bufferedAmount //未發(fā)送至服務(wù)器的字節(jié)數(shù)只讀
ws.extensions //服務(wù)器選擇的擴(kuò)展只讀
ws.onclose //關(guān)閉前的回調(diào)函數(shù)
ws.onerror //連接失敗后的回調(diào)函數(shù)
ws.onmessage //從服務(wù)器接受到信息時的回調(diào)函數(shù)
ws.onopen //連接成功后的回調(diào)函數(shù)
ws.url //WebSocket的絕對路徑
方法
ws.close([code[, reason]]) //關(guān)閉當(dāng)前鏈接
ws.send(data) //發(fā)送數(shù)據(jù)
工具
Socket.io //基于長輪詢/WebSocketNode.js庫,包括客戶端
ws //WebSocket客戶端和服務(wù)器 Node.js庫
Ajax
簡介
新技術(shù)的一種集合
其中包括:HTML or XHTML, Cascading Style Sheets, JavaScript, The Document Object Model, XML, XSLT, 以及最重要的 XMLHttpRequest object
XMLHttpRequest (XHR)
可以用來獲取任何類型的數(shù)據(jù),還支持ftp協(xié)議
使用方法
var req = new XMLHttpRequest();
req.onload = (e)=>{}; // ES6語法
req.onreadystatechange = (e)=>{/*req.readyState*//*req.status*/}
req.onerror = (e)=>{};
req.open(protocol, url, async);
req.setRequestHeader(); // 設(shè)置請求頭
req.send([params]); //POST時可以填寫params String,GET使用url形式傳遞數(shù)據(jù)
//POST可以傳輸json,對數(shù)據(jù)沒有限制等.GET只能以key-value形式傳遞數(shù)據(jù),使用&符連接
2018-11-9 17:33
WebRTC(我所理解的并不屬于前后端通訊方式,屬于p2p通訊)
使用方法
const rtc = new RTCPeerConnection()
更多例子
Google I/O PPT
工具
adapter.js
了解更多請參考WebRtc
文章更新中...
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/99230.html
摘要：總結(jié)我覺得，以后基于的全棧式開發(fā)的模式將會越來越流行，這也會引領(lǐng)前端步入工程化時代。歡迎繼續(xù)關(guān)注本博的更新中間層實(shí)踐一基于的全棧式開發(fā)中間層實(shí)踐二搭建項(xiàng)目框架中間層實(shí)踐三配置中間層實(shí)踐四模板引擎中間層實(shí)踐五中間層的邏輯處理 版權(quán)聲明：更多文章請?jiān)L問我的個人站Keyon Y，轉(zhuǎn)載請注明出處。 前言 近期公司有個新項(xiàng)目，由于后端人手不足，我果斷的提議用node中間層的方案，得到了老大的支持...
摘要：作為開發(fā)同學(xué)的小伙伴客戶端的瀏覽器，有點(diǎn)小調(diào)皮還做了一個同源策略的限制，當(dāng)我們的數(shù)據(jù)請求遇到不同源的情況下跨域，我們就得嘗試其它的通信方法，不能一條道走到黑。 showImg(https://segmentfault.com/img/bVburZO?w=600&h=450); Web2.0以來，Ajax的出世，解決了傳統(tǒng)表單提交頁面跳轉(zhuǎn)，閃爍白屏等問題。使得Web頁面可以實(shí)現(xiàn)局部更新，...
摘要：例外當(dāng)涉及到同源策略時，有兩個主要的例外授信范圍兩個相互之間高度互信的域名，如公司域名，不遵守同源策略的限制。端口未將端口號加入到同源策略的組成部分之中，因此和屬于同源并且不受任何限制。 原文鏈接：http://www.devsai.com/2016/11/24/talk-CORS/ 同源策略（same origin policy） 1995年，同源政策由 Netscape 公司引入瀏...
摘要：表單最原始的是如何通信的基本通信原理瀏覽器可以發(fā)出請求與接收響應(yīng)，實(shí)現(xiàn)在頁面不刷新的情況下和服務(wù)端進(jìn)行數(shù)據(jù)交互。響應(yīng)的狀態(tài)為或者。 1、什么是瀏覽器的同源政策限制？ 端口，域名，協(xié)議 ，只要一個不一樣就跨域 2、前后端如何通信？ 常見通信的幾種方式 Ajax : 短連接Websocket : 長連接，雙向的。CORS fetch()Form表單（最原始的） Ajax是如何通信的 ...
閱讀 3386·2021-11-12 10:36
閱讀 2554·2021-11-02 14:43
閱讀 2205·2019-08-30 14:23
閱讀 3519·2019-08-30 13:08
閱讀 976·2019-08-28 18:09
閱讀 3214·2019-08-26 12:22
閱讀 3226·2019-08-23 18:24
閱讀 2073·2019-08-23 18:17
