Promisifying XMLHttpRequest - ECMAScript 6 Tutorial
Wed Sep 30 2020 07:46:18 GMT+0000 (UTC)
Saved by
@vishnu
#javascript
let request = obj => {
return new Promise((resolve, reject) => {
let xhr = new XMLHttpRequest();
xhr.open(obj.method || "GET", obj.url);
if (obj.headers) {
Object.keys(obj.headers).forEach(key => {
xhr.setRequestHeader(key, obj.headers[key]);
});
}
xhr.onload = () => {
if (xhr.status >= 200 && xhr.status < 300) {
resolve(xhr.response);
} else {
reject(xhr.statusText);
}
};
xhr.onerror = () => reject(xhr.statusText);
xhr.send(obj.body);
});
};
request({url: "employees.json"})
.then(data => {
let employees = JSON.parse(data);
let html = "";
employees.forEach(employee => {
html += `
<div>
<img src='${employee.picture}'/>
<div>
${employee.firstName} ${employee.lastName}
<p>${employee.phone}</p>
</div>
</div>`;
});
document.getElementById("list").innerHTML = html;
})
.catch(error => {
console.log(error);
});
content_copyCOPY
http://ccoenraets.github.io/es6-tutorial-data/promisify/
Comments