Charles是一款常用的HTTP代理工具，可以用來(lái)攔截并查看HTTP請(qǐng)求和響應(yīng)。與此同時(shí)，Charles也支持請(qǐng)求和響應(yīng)數(shù)據(jù)以不同的格式展示，包括JSON格式。

要在Charles中查看JSON格式的請(qǐng)求和響應(yīng)數(shù)據(jù)，我們需要在請(qǐng)求和響應(yīng)的頭信息中添加相應(yīng)的Content-Type字段，并將其設(shè)置為application/json。

/**
* 發(fā)起GET請(qǐng)求
*/
function sendRequest(){
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.example.com/users", true);
xhr.setRequestHeader("Content-Type", "application/json");        //設(shè)置請(qǐng)求頭信息
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
console.log(JSON.parse(xhr.responseText));             //解析JSON格式數(shù)據(jù)
}
}
xhr.send(null);
}

在上面的代碼中，我們通過(guò)XMLHttpRequest對(duì)象創(chuàng)建了一個(gè)GET請(qǐng)求，并在請(qǐng)求頭信息中設(shè)置了Content-Type字段為application/json。當(dāng)請(qǐng)求結(jié)束后，通過(guò)console.log輸出了響應(yīng)數(shù)據(jù)。

使用Charles查看JSON格式的請(qǐng)求和響應(yīng)數(shù)據(jù)可以更好地了解Web應(yīng)用程序的請(qǐng)求和響應(yīng)。而在編寫JavaScript代碼時(shí)，通過(guò)設(shè)置請(qǐng)求頭信息為application/json可以保證我們發(fā)送的數(shù)據(jù)被正確地解析和處理。