2017-11-10 204 views
0

我正在使用Nodejs,expressjs,sqlite3。發送數據到前端expressjs

我已成功地從數據庫和路由使用expressjs得到我的數據,這是所有在叫server.js

現在,我想送/使用我在前端提取的數據的js文件。

我想有一個全局變量,並使用在其他的js文件的全局變量,但沒有奏效。經過一番研究,我大部分時間都看到AJAX。我是否需要使用AJAX將數據從後端發送到前端?

的想法是基於用戶選擇什麼樣的產品,更新的前端。我在服務器js中獲取產品數據,我不知道如何將其發送到前端以填寫表並根據數據庫上的數據更改產品名稱。

另外,我應該繼續,看看是否保存/使用全局變量的作品我的數據? 謝謝。

回答

0

應該創建RESTful API中做你想做什麼。這意味着你必須使用AJAX,並且你不能使用全局變量。

+0

感謝您的回答。有沒有辦法使用AJAX重定向頁面?例如。當一個表格中的元素被點擊時,轉到不同的視圖並根據該特定項目的數據(這是我的產品)修改元素/屬性值。 – asker

+0

是的,假設你的網站是'www.yoursite.com',網頁是'/ products',你可以從這個頁面重定向到一個頁面'/ product/id_product',其中'id_product'可以是你的主鍵在產品的sqlite3表中使用。 –

0

AJAX是請求從後端數據,而不觸發重新加載整個頁面的好方法。但是它增加了一層複雜性,它聽起來不像你需要的。由於您使用的是快遞,因此您可以訪問templating engine開箱即可處理此問題。

快遞響應對象有一個render方法,您可以指定要使用的模板,並將數據發送給模板。一些僞代碼適用於您:

// server.js 
app.get('someroute',(req,res,next)=>{ 
    //get data from DB, returns promise 
    return db.getData().then((data)=>{ 
     return res.render('myTableTemplate',data); 
    }); 
}); 

在模板文件中,您將使用JSON數據適當地填充表。

如果使用一個客戶端JS庫(反應,VUE,角等)可以跳過res.render(...)和簡單地res.json(data)

+0

我爲我的意見使用html。如何選擇要與我的數據映射哪個元素/屬性?另外,如何更改視圖以顯示具體項目的詳細信息?例如。當一個表格中的元素被點擊時,轉到不同的視圖並根據該特定項目的數據(這是我的產品)修改元素/屬性值。 – asker

+0

以下是我的: app.render(「/productDetail.html",rows,function(err,html){ console.log(rows); res.sendFile(path.join(__ dirname +'/ projectDetail。 html')); });假設我想要將產品名稱映射到rows.productName。我該怎麼做才能在主頁中選擇該產品時看到正確的產品名稱。 //document.getElementById('pname')= rows.productName;例如 – asker

+0

將數據映射到表的語法高度依賴於您使用的模板引擎。這應該在你的路線之前定義。像'app.set('engine','ejs')'。您不在render函數回調中執行res.sendFile。渲染將根據數據創建html併發送給客戶端。 – Splitty