在Web開發(fā)中,我們經(jīng)常需要從服務(wù)器端獲取數(shù)據(jù),并使用該數(shù)據(jù)來更新頁面。最常見的情況是通過AJAX方式請(qǐng)求數(shù)據(jù),服務(wù)器端返回JSON數(shù)據(jù)格式。
在JavaScript中,我們可以使用XMLHttpRequest對(duì)象來發(fā)起AJAX請(qǐng)求。以下是一個(gè)簡(jiǎn)單的示例:
let xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { let response = JSON.parse(xhr.response); console.log(response); } } xhr.open('GET', '/api/data', true); xhr.setRequestHeader('Content-Type', 'application/json'); xhr.send();
在上述示例中,通過調(diào)用xhr對(duì)象的open方法指定請(qǐng)求方式、請(qǐng)求地址和是否異步。然后使用setRequestHeader方法設(shè)置請(qǐng)求頭信息,告訴服務(wù)器返回JSON數(shù)據(jù)。最后使用send方法發(fā)起請(qǐng)求。
在服務(wù)器端,我們需要將返回的數(shù)據(jù)使用JSON格式進(jìn)行編碼。以下是一個(gè)簡(jiǎn)單的示例:
let data = { name: '張三', age: 30, sex: '男' }; let response = JSON.stringify(data); res.send(response);
在上述示例中,我們將data對(duì)象使用JSON.stringify方法進(jìn)行編碼,并返回給客戶端。客戶端將得到一個(gè)字符串類型的JSON數(shù)據(jù)。
最后,客戶端需要使用JSON.parse方法將返回的JSON數(shù)據(jù)進(jìn)行解碼,得到JavaScript對(duì)象,進(jìn)而使用其中的數(shù)據(jù)更新頁面。
總的來說,使用GET方式獲取JSON數(shù)據(jù)是一個(gè)常見的Web開發(fā)場(chǎng)景,也是學(xué)習(xí)AJAX的重要一步。