Express是一個流行的Node.js框架,它提供了易于使用的API來幫助構(gòu)建Web應(yīng)用程序。其中一項強大的功能是通過AJAX返回JSON數(shù)據(jù)。以下是如何在Express中使用AJAX返回JSON數(shù)據(jù)的示例。
//在app.js中引入express const express = require('express') const app = express() //設(shè)置Express應(yīng)用程序以使用JSON格式解析請求體 app.use(express.json()) //設(shè)置靜態(tài)文件夾進行客戶端文件訪問 app.use(express.static('public')) //路由-返回JSON數(shù)據(jù) app.get('/jsondata', (req, res) =>{ //設(shè)置JSON數(shù)據(jù) const data = { name: '張三', age: 27, city: '上海' } //通過res對象以JSON格式發(fā)送數(shù)據(jù) res.json(data) }) //監(jiān)聽端口 app.listen(3000, () =>{ console.log('服務(wù)器已啟動!') })
在上面的代碼中,我們首先導(dǎo)入了Express模塊,并創(chuàng)建了一個新的應(yīng)用程序。接下來,我們設(shè)置Express應(yīng)用程序以使用JSON格式解析請求體,并允許客戶端訪問靜態(tài)文件夾。然后,我們?yōu)槁酚陕窂健?jsondata”創(chuàng)建一個GET請求處理程序。在該處理程序中,我們設(shè)置了一個JSON對象,并使用res對象將其以JSON格式發(fā)送回客戶端。最后,我們將應(yīng)用程序監(jiān)聽在3000端口上。
此外,我們還需要客戶端代碼來處理返回的JSON數(shù)據(jù)。以下是一個基本示例:
//通過AJAX請求獲取JSON數(shù)據(jù) fetch('/jsondata') .then(response =>response.json()) .then(data =>console.log(data)) .catch(error =>console.error(error))
在這個客戶端代碼中,我們使用了Fetch API來發(fā)送AJAX請求并獲取JSON數(shù)據(jù)。在請求成功后,我們通過.then()方法解析響應(yīng)并將結(jié)果輸出到控制臺。如果請求失敗了,我們將通過.catch()方法捕獲錯誤并將其輸出到控制臺。