您好,登錄后才能下訂單哦!
這篇文章主要講解了“web前后端交互方式是什么”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“web前后端交互方式是什么”吧!
正如我們所知,一個完整的IT項目是由多個不同崗位共同完成的,包括UI設計、前端開發、后端開發、測試等。前端后端需要通過技術上交互實現聯通,那么web前后端交互技術都有哪些呢?
前端開發需要做的事情,只有兩個:1. 創建界面結構 2. 數據交互
數據交互其實又可以分為兩種:1. 給后臺技術 2. 從后臺那數據
數據交互的目的是什么?
取:將數據渲染到dom文檔中 給:提交數據到后臺后,后臺會繼續返回我們一個數據,拿到這個數據,然后渲染頁面.
1. 利用cookie
例如:前臺通過登錄來存儲cookie
后臺通過req.cookies()來獲取存儲的cookie信息
2. 利用Ajax
在學習NodeJS之前最常用的前后端交互大都利用ajax 和JQuery中已經封裝好的$.ajax、$.post、$.getJSON 通過創建一個XMLHttpRequest對象,來進行前后端交互。
在學NodeJS之后我們也利用依賴于$http服務自己搭建的_http來完成get、post和jsonp的方式來進行前后端交互;
3. jsonp
jsonp是前后端結合跨域方式,因為前段請求到數據需要在回調函數中使用,所以后端得將數據放回到回調函數中
jsonp屬于AJAX嗎? ajax是指通過使用xmlhttpquest對象進行異步數據交互的技術,jsonp是依靠scriptsrc屬性來獲取的,不屬于ajax
4. 服務端渲染
瀏覽器請求到的內容其實可以通過后端加工一下,將一會數據直接渲染好,再給瀏覽器就可以了
在php中實現服務端渲染:
在php語言文件中可以放入html代碼,訪問php文件的時候就相當于訪問這個對應的html文件,因為在php文件中,所以可以寫一些php的代碼來渲染數據
在Node中實現服務端渲染:
利用模板引擎,node在渲染模板的時候給模板傳入數據,在模板中就可以使用特定的語法來渲染dom了 例如:ejs,jade
注意:express里的路由是靠請求路徑劃分的,前一個自己搭的路由是根據請求類型劃分的。
5. webSocket 和 Socket.io
網上的兩個程序通過一個雙向的通信連接實現數據的交換,這個連接的一端成為一個scoket
通過建立socket雙向連接,就可以讓客戶端和服務端直接進行雙向通信
簡單的小案例:socket.io聊天的思路
1. 服務器端建立好服務端, var wss=require(“socket.io”)(server)
2. 創建客戶端的連接socket var wsc = io.connect(‘ws://’)
3. 客戶端連接 wsc.on(“connect”,function(e){})
4. 服務器端接收到客戶端連接的消息 wss.on(“connection”,function(socket){})
5. 客戶端發送消息的時候觸發 wsc.on(“meaasge”,function(msg){})
6. 客戶端接收到服務器端發送消息 wsc.on(“message”,function(e){})
感謝各位的閱讀,以上就是“web前后端交互方式是什么”的內容了,經過本文的學習后,相信大家對web前后端交互方式是什么這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。