Node之簡單的前後端互動 例項講解

2022-10-08 10:36:07 字數 1442 閱讀 7310

node是前端必學的一門技能,我們都知道node是用的js做後端,在學習node之前我們有必要明白node是如何實現前後端互動的。

這裡寫了乙個簡單的通過原生ajax與node實現的乙個互動,剛剛學node的朋友可以看一看。一方面理解服務端與客戶端是如何互動的,一方面更熟悉node開發。

先貼**:(有興趣的可以copy到本地自己run一下)

主頁面的html

index.html:

接下來是伺服器端的**,執行方式是在node環境下輸入命令:nodqdfkicrgake server.js

引入的qs模組用於解析json

req.on('data', callback);  // 監聽客戶端的資料,一旦有資料傳送過來就執行**函式

req.on('end', callback); // 資料接收完畢

res  // 響應

客戶端的js(功能就是負責一些dom操作以及傳送ajax請求)

client.js:

let btn1 = document.getelementbyid('btn1');

let btn2 = document.getelementbyid('btn2');

let content = document.getelementbyid('content');

btn1.addeqdfkicrgakventlistener('click', function() );

btn2.addeventlistener('click', function() );

// 封裝的ajax方法

function ajax(method, url, val) else

} };

xhr.open(method, url, true);

if(val)

xhr.setrequestheader('content-type', '');

xhr.send(val);

}這個簡單的互動就是這樣的,其實我們在第一次學習後端語言的時候第一件事就是寫乙個前後端互動程式,這樣會幫助我們更好的理解前後端的分工。

run方法:

先將server.js執行起來,然後開啟html來請求響應。

本文標題: node之簡單的前後端互動(例項講解)

本文位址:

表單 node(實現前後端資料互動)

前台 placeholder 使用者名稱 type password name password placeholder 密碼 type submit value 提交 form body html node後台 const express require express 獲取express模組 c...

前後端是如何互動的

ios,h5,安卓等前端開發的如何跟後台進行互動?應該怎麼去規避一些不該屬於自己的任務而被後台強加於自己?在開發中,url主要由後台來寫的,寫好之後提供給前端開發人員,如果後台在查詢資料,需要借助查詢條件才能查詢到前端需要的資料時,這時後台會要求前端提供相關的查詢引數,這裡的查詢引數也就是url請求...

前後端資料互動的方式

1 利用cookie物件 cookie是伺服器儲存在客戶端裡的一小部分資料,使用cookie也有前提,就是客戶端允許使用cookie並作出相應設定。後台 cookie cookie new cookie name hello response.addcookie cookie 前台 cookie c...