使用XHR对请求和响应的进度进行监控 ✅

const xhr = new XMLHttpRequest();
xhr.addEventListener('readystatechange', () => {
	if (xhr.readyState === xhr.DONE) {
		console.log('ok!')
	}
})

// 监听请求的进度
xhr.upload.addEventListener('progress', (e) => {
	// 每传递一定数据触发一次progress事件
	// loaded：已传递的数据
	// total：总共有多少数据
	console.log(e.loaded, e.total)
})

// 监听响应的进度
xhr.addEventListener('progress', (e) => {
	// 逻辑与监听请求的进度一致
	console.log(e.loaded, e.total)
})

XHR真好用嘿嘿。