我从Node.js服务器收到的响应始终是1个响应。按下该“上传”按钮后,我将始终收到应该收到的回复。
启动节点服务器后,响应为空。在过去四个小时内一直在尝试无数次尝试,但我无法解决。
我从bodyParser切换到一个名为express-busboy的库来上传文件,因为我不必重新编写整个代码。应用程序中的其他所有内容仍然可以正常运行,因此我开始认为问题可能与库中的文件上传部分有关。
这是我的节点代码,很抱歉,阅读起来可能有点乏味,但是我在这里真的迷失了,这是阻止我前进的唯一原因。
这是我的后端代码。
import * as fse from 'fs-extra';
export default class PhotoController{
private postError = [];
private postSuccess = [];
public postPhotos = (req, res) => {
const fileArray = Array.isArray(req.files.file) ? req.files.file : new Array(req.files.file);
const body = new Array(req.body);
const item = body[0].item;
const staticFileDest = `C:\\Users\\JP\\Desktop\\MiMApp\\MiMBackEnd\\movedUploads`;
for (let i = 0; i < fileArray.length; i++){
const removeDest = `./uploads/${fileArray[i].uuid}`;
const newName = Array.isArray(body[0].newName)? body[0].newName[i] : body[0].newName;
const srcFile = `./${fileArray[i].file}`;
const moveDest = `${staticFileDest}\\${item}\\${newName}`;
fse.pathExists(moveDest)
.then(exists => {
if (exists){
this.postError.push(`Fichier ${newName} existe deja.`);
this.removeSrcFile(removeDest);
} else {
fse.move(srcFile, moveDest)
.then( () => {
const commentToAdd = Array.isArray(body[0].comment) ? body[0].comment[i] : body[0].comment;
const commentPath = moveDest.replace(/\.[^/.]+$/, "").concat('.txt');
this.postSuccess.push(`Fichier ${newName} à été ajouté dans l'item : ${item}`);
this.removeSrcFile(removeDest);
fse.writeFile(commentPath, commentToAdd)
.then(() => {this.postSuccess.push(`Le commentaire à été ajouté pour ${newName}`)})
.catch(() => {this.postError.push(`Le commentaire pour ${newName} existe deja.`)});
})
.catch(() => {
this.postError.push(`Le fichier ${newName} n'a pas été rajouté correctement.`);
this.removeSrcFile(removeDest);
this.removeSrcFile(moveDest);
});
}
});
}
this.sendResponse(res);
this.resetErrors();
};
private removeSrcFile(file){
fse.remove(file)
.then(() => {})
.catch(() => {this.postError.push(`${file} n'a pas pu être éffacé.`)});
}
private resetErrors(){
this.postError = [];
this.postSuccess = [];
}
private sendResponse(res){
if (this.postError.length > 0){
res.send({success : this.postSuccess, errors : this.postError});
} else {
res.send({success: this.postSuccess});
}
}
}
前端:
onUpload()
{
const filesToUpload = new FormData();
for (const values of this.selectedFile){
filesToUpload.append('file', values.file);
filesToUpload.append('newName', values.name);
filesToUpload.append('comment', values.comment ? values.comment : 'Aucun commentaire.');
}
filesToUpload.append('item', this.itemNumber);
this.photoService.postPictures(filesToUpload)
.subscribe(
res => {
if (res){
this.postResponse = res;
} else {
this.openUnexpectedModal();
}
},
err => {
this.openUnexpectedModal();
},
() => {
this.openResponseModal();
}
)
}
服务:
export class PhotoService {
constructor(private http: HttpClient, private config: Config) {}
public postPictures = (datas): Observable<any> => {
return this.http.post(`${this.config.apiAddress}/postPictures`, datas)
.pipe(
map(data => {return data})
);
}
}
我提交时的第一反应:
{"success":[]}
如果我再次提交:
{"success":["Fichier 15012019-YEDwo.jpg à été ajouté dans l'item : 55","Le commentaire à été ajouté pour 15012019-YEDwo.jpg"]}
答案 0 :(得分:1)
您执行了一个异步函数,但是发送函数this.sendResponse(res);
被同步触发了。
fse.move(srcFile, moveDest)
.then( () => {
...
}
这意味着fse.move
运行时,您已经发送了请求,而this.postSuccess
只是在private postSuccess = [];
处初始化的一个空数组。 fse.move
第二次完成,这就是为什么您的响应中充满了数据。