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%';
}
相关推荐
badhope2 小时前
Mobile-Skills:移动端技能可视化的创新实践
开发语言·人工智能·git·智能手机·github
码云数智-园园3 小时前
微服务架构下的分布式事务:在一致性与可用性之间寻找平衡
开发语言
hpoenixf3 小时前
2026 年前端面试问什么
前端·面试
还是大剑师兰特3 小时前
Vue3 中的 defineExpose 完全指南
前端·javascript·vue.js
C++ 老炮儿的技术栈3 小时前
volatile使用场景
linux·服务器·c语言·开发语言·c++
hz_zhangrl3 小时前
CCF-GESP 等级考试 2026年3月认证C++一级真题解析
开发语言·c++·gesp·gesp2026年3月·gespc++一级
泯泷3 小时前
阶段一:从 0 看懂 JSVMP 架构,先在脑子里搭出一台最小 JSVM
前端·javascript·架构
Liu628883 小时前
C++中的工厂模式高级应用
开发语言·c++·算法
IT猿手4 小时前
基于控制障碍函数的多无人机编队动态避障控制方法研究,MATLAB代码
开发语言·matlab·无人机·openclaw·多无人机动态避障路径规划·无人机编队
AI科技星4 小时前
全尺度角速度统一:基于 v ≡ c 的纯推导与验证
c语言·开发语言·人工智能·opencv·算法·机器学习·数据挖掘