当前位置:网站首页>解决 excel 文件上传时更改选中的文件出现错误net::ERR_UPLOAD_FILE_CHANGED
解决 excel 文件上传时更改选中的文件出现错误net::ERR_UPLOAD_FILE_CHANGED
2022-07-02 22:06:00 【墨语轩】
业务场景:在业务中先选中要上传的 excel,然后再回到 excel 文件夹打开该文件,修改该文件然后保存,回到页面中点击上传(这种需求我也是第一次遇到,只能说一句牛逼)
原因:文件修改内容后file的本地文件已经丢失
解决:
1.上传beforeUpload时将file转成base64(bese64与本地的文件状态已经无关了),再转成file。(这是比较麻烦的,可以先问下后台能不能改,通过blob或者arraybuffer获取数据)
保存base64格式
const reader1 = new FileReader();
reader1.readAsDataURL(file);
reader1.onload = e => {
this.base64Excel = e.target.result;
};
base64转file方法:
base64ConvertFile (urlData, filename) { // 64转file
var arr = urlData.split(',');
var type = arr[0].match(/:(.*?);/)[1];
var fileExt = type.split('/')[1];
var bstr = atob(arr[1]);
var n = bstr.length;
var u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([ u8arr ], filename, {
type: type
});
},
最后把转出来的file通过formdata上传
let excel = new FormData();
let form = this.base64ConvertFile(this.base64Excel, this.excelFile.name);
excel.append('file', form);
2.点击上传时给出文件修改的提示
this.file.slice( 0, 1 ) // only the first byte
.arrayBuffer() // try to read
.then( () => {
// 文件没改变,在这里可以发请求了
console.log( 'should be fine' );
axios({.........})
} )
.catch( (err) => {
// 文件有问题,在这里终止掉
console.log( 'failed to read' );
this.file = null; // 把缓存的file清空
} );方案 1 上传的是修改之前的 excel 文件,看具体业务能不能接受
方案2 是在方案一不能接受的情况下的最优解,提示让把 input 中的文件删掉重新选择就可以了
参考链接:
解决excel文件上传时更改选中的文件出现错误net::ERR_UPLOAD_FILE_CHANGED
边栏推荐
- Socket套接字C/S端流程
- Pointer and string
- Kubernetes resource object introduction and common commands (4)
- Infrastructure is code: a change is coming
- An overview of the development of affective computing and understanding research
- 附加:【登录信息存储】与【登录状态校验】;(包括:总结了到目前为止,有关【登录信息存储】与【登录状态校验】的所有内容;)
- Market Research - current market situation and future development trend of marine wet exhaust hose
- [shutter] shutter gesture interaction (small ball following the movement of fingers)
- Struct, bit segment, enumeration, union
- U++ learning notes - relaxation
猜你喜欢

scrcpy这款软件解决了和同事分享手机屏幕的问题| 社区征文

Radis:Linux上安装Redis(步骤)

#include errors detected. Please update your includePath.

腾讯三面:进程写文件过程中,进程崩溃了,文件数据会丢吗?

The book "new programmer 002" is officially on the market! From "new database era" to "software defined car"

What "real skills" should a million year old cloud native developer master? Alibaba, Tencent, meituan and byte decrypt together

SimpleITK使用——3. 常见操作

附加:【登录信息存储】与【登录状态校验】;(包括:总结了到目前为止,有关【登录信息存储】与【登录状态校验】的所有内容;)

C语言,实现三子棋小游戏

Developers share | HLS and skillfully use Axi_ Customize the master bus interface instructions and improve the data bandwidth - area exchange speed
随机推荐
Task and privilege level protection
PHP implements querying the data matching the date of birth according to the entered age
sql service 截取字符串
Pointer and string
影视随摘
Dynamic memory allocation (malloc calloc realloc free)
对象与对象变量
It's not easy to say I love you | use the minimum web API to upload files (swagger support) # yyds dry inventory #
Market Research - current market situation and future development trend of aircraft audio control panel system
[shutter] shutter resource file use (import resource pictures | use image resources)
Servicemesh mainly solves three pain points
Oracle cursor
Methods of adding styles to native JS
Phpcms realizes the direct Alipay payment function of orders
Hanoi Tower problem
Build your own website (22)
An overview of the development of affective computing and understanding research
[leetcode] sword finger offer 04 Search in two-dimensional array
Market Research - current market situation and future development trend of marine wet exhaust hose
[QT] QT multithreading development - reentrancy and thread safety