How to solve the problem of invalid upload of the same file twice

A recent problem encountered in the project, the scene is:

After the file is uploaded for the first time, after modifying the content of the file and uploading the file again without refreshing the page, the error shown in the figure below will appear. (Refreshing the page can upload normally, and changing to another file can also upload normally)

【Phenomenon】

net::ERR_UPLOAD_FILE_CHANGED 

【problem causes】

The file name of the previous two times has not changed, and the onchange event of the input has not been triggered.

【solution】

In the interface callback, just set the value of the input to empty.

// 假如input的ID是file
document.getElementById('file').value = '';

 Of course, if you have other methods, you can also leave a message in the comment area!

==============================================================================

Problem scenario:

        Two Input input boxes, one type=text (value fileName), one type=file (id=file, assign value to another input box)

. . . I am back again. The above method will create a new problem for my current business scenario. I send two consecutive requests, and the file name of the second request cannot be obtained (because the value of the file will be cleared after the first request, As a result, the file cannot get the value in the second request).

After thinking about it, there is no good solution for the time being. The current solution is to save the file, namely:

const file = document.getElementById('file').files[0]

Then judge when sending the request:

  • Condition 1: Whether fileName has a value
  • Condition 2: document.getElementById('file').value is empty (including empty string)

If both conditions are met, it means that the value of the file is manually cleared, and the uploaded file has not changed. At this time, the value saved last time is taken directly from the file, otherwise, the latest one is taken.

If you have any other solutions, I hope you can leave a message to add, thank you very much! ! !

Guess you like

Origin blog.csdn.net/weixin_38629529/article/details/127128972