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%';
}
相关推荐
fruge14 分钟前
2025前端工程化与性能优化实战指南:从构建到监控的全链路方案
前端·性能优化
朱嘉鼎16 分钟前
C语言之可变参函数
c语言·开发语言
aesthetician1 小时前
Node.js v25 重磅发布!革新与飞跃:深入探索 JavaScript 运行时的未来
javascript·node.js·vim
北冥湖畔的燕雀3 小时前
C++泛型编程(函数模板以及类模板)
开发语言·c++
demi_meng5 小时前
reactNative 遇到的问题记录
javascript·react native·react.js
QX_hao5 小时前
【Go】--map和struct数据类型
开发语言·后端·golang
你好,我叫C小白5 小时前
C语言 循环结构(1)
c语言·开发语言·算法·while·do...while
千码君20165 小时前
React Native:从react的解构看编程众多语言中的解构
java·javascript·python·react native·react.js·解包·解构
Evand J6 小时前
【MATLAB例程】基于USBL和DVL的线性回归误差补偿,对USBL和DVL导航数据进行相互补偿,提高定位精度,附代码下载链接
开发语言·matlab·线性回归·水下定位·usbl·dvl
lijun_xiao20097 小时前
前端最新Vue2+Vue3基础入门到实战项目全套教程
前端