JS async await fetch 捕获后端500错误详细信息

客户端异步请求抛出的500友好错误信息,处理起来很困难,需要把后端代码逐个检查下。

若是抛出500错误详细信息,就可以快速把问题处理掉。

如果是响应的是文本,就用 response.text() 方法,JSON 就用 response.json() 方法。

javascript 复制代码
async function bigFileUpload_click(sef) {
	const chunk_size = 1024*1024; // 1MB per chunk
	const file = sef.files[0];
	const fileSize = file.size;
	const totalChunks = Math.ceil(fileSize/chunk_size); // 向上取整
	const progressBar = $$('#progressBar');
	
	console.log(  file.name );return;
	
	for (let chunkIndex = 0; chunkIndex < totalChunks; chunkIndex++) {
		const start = chunkIndex * chunk_size;
		const end = Math.min(fileSize, start+chunk_size);
		const chunk = file.slice(start, end);
		const formData = new FormData();
		formData.append('act', 'bigFileUpload_click');
		formData.append('file', chunk);
		formData.append('fileName', file.name);
		formData.append('chunkIndex', chunkIndex);
		formData.append('totalChunks', totalChunks);
		
		progressBar.innerHTML = Math.ceil(chunkIndex/fileSize*100);
 
		await fetch(location.pathname,{
			method: 'POST',
			body: formData
		})
			.then(response => {
				if (response.status !== 200) {
					console.log('response:', response, response.text());
				}
			})
			.catch(error => {
				console.error('Error:', error)
			});
		;
	}
	
	progressBar.innerHTML = '100%';
}
相关推荐
不正经学生3 小时前
C语言预处理详解:编译器真正动手之前的那些事
c语言·开发语言·算法·面试·bug
门思科技4 小时前
LoRaWAN 设备类别:Class A、B、C 对比与选型指南
c语言·开发语言·php
ℋᙚᵐⁱᒻᵉ鲸落6 小时前
移动端滑动手势冲突:overflow: auto导致外层横向滑动失效
前端·javascript·css·vue.js·html
恋恋西风6 小时前
C++ 理解 std::thread 在单核和多核上的行为差异
开发语言·c++
Brilliantwxx6 小时前
【Linux】 进程(9)程序与进程地址空间(基础+进阶+面试题)
linux·运维·服务器·开发语言·c++
BizzZ_7 小时前
C++(22)——类型转换和IO流
开发语言·c++
默_笙7 小时前
🎃 前端学了 Next.js,后端该学啥?NestJS 就是 Node 版的蜜雪冰城
前端·javascript
小范同学_7 小时前
JDK1.7 与 JDK1.8 HashMap 底层原理对比 + 数组并发扩容死循环详解
java·开发语言
geovindu8 小时前
CSharp: 万年历
开发语言·后端·c#·.net
我找到地球的支点啦8 小时前
Matlab系列(009) 一CRC循环冗余校验详解
开发语言·数据结构·算法·matlab·信息与通信