更新:
我正在将头像作为头像上传到nodejs-mongo服务器。第一次编译该项目时似乎可以正常工作,但是在我尝试第二次更改图片之后,它的工作方式如下:
上传图片2和图片2预期会显示。
上载picture3和picture2。 (应该显示picture3)。
上传picture4和picture3。 (应该显示picture4)。
它保持这种方式,在屏幕上显示以前上传的图片。
我已经尝试使用ngZone和observables进行了解释,here,但是行为是相同的。
我的代码:
profile.components.ts
user: any;
userupdater = new BehaviorSubject < string > (this.user);
file2Base64result;
//CODE
async file2Base64(archivo) {
const file = archivo.target.files[0];
this.file2Base64result = "";
this.file2Base64result = await new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
let user: UserI = {
id: 0,
name: "",
password: "",
email: "",
avatar: this.file2Base64result
};
this.authService.updateAvatar(user).subscribe(
res => {
},
err => {},
() => {
this.user = JSON.parse(localStorage.getItem("currentUser")); //I believe the problem could be here
this.userupdater.next(this.user);
Swal.close();
})
}
profile.component.html的相关部分
<img class="avatarimage" src="{{ user.avatar }}" />
auth.service.ts
updateAvatar(user: UserI): Observable < JwtResponseI > {
let currentu = < UserI > JSON.parse(localStorage.getItem("currentUser"));
/* console.log("currentu: "+JSON.stringify(currentu)); */
if (user.avatar) currentu.avatar = user.avatar;
return this.httpClient.post < JwtResponseI > (`${this.AUTH_SERVER}/updateavatar`,
currentu).pipe(tap(
(res: JwtResponseI) => {
if (res) {
let currentU = {
name: res.dataUser.name,
email: res.dataUser.email,
role: res.dataUser.role,
id: res.dataUser.id,
avatar: res.dataUser.avatar,
signature: res.dataUser.signature
};
//guardar token
this.saveToken(res.dataUser.accessToken, res.dataUser.expiresIn, currentU);
}
}, error => {
console.log(error);
},
() => {}
));
}
private saveToken(token:string, expiresIn:string, CurrentUser):void{
this.isLoggedIn = this.token;
const expiresAt = moment().add(localStorage.getItem('EXPIRES_IN'),'second');
localStorage.removeItem("ACCESS_TOKEN");
localStorage.removeItem("EXPIRES_IN");
localStorage.removeItem("currentUser");
localStorage.setItem("ACCESS_TOKEN", token);
localStorage.setItem("EXPIRES_IN", JSON.stringify(expiresAt.valueOf()));
this.token = token;
this.expiresin = JSON.stringify(expiresAt.valueOf());
localStorage.setItem("currentUser", JSON.stringify(CurrentUser));
this.token = token;
}
在后端,相关代码:
exports.updateavatar = (req, res, next) => {
/* console.log("request:xxxxxxxxxx "+JSON.stringify(req.body)); */
console.log("request:id " + JSON.stringify(req.body.id));
var ObjectId = require('mongoose').Types.ObjectId;
var elementid = new ObjectId(req.body.id);
User.findByIdAndUpdate({
_id: elementid
}, {
$set: req.body
}, (err, user) => {
if (err) {
console.log("Error en findByIdandUpdate: " + err);
return res.status(500).send('No se encuentra el usuario.');
}
if (!user) {
res.status(409).send({
message: 'Esta ID de usuario no existe.'
});
} else {
const expiresIn = 14 * 60 * 60;
const accessToken = jwt.sign({
id: user.id
},
SECRET_KEY, {
expiresIn: expiresIn
});
const dataUser = {
id: user.id,
name: user.name,
email: user.email,
accessToken: accessToken,
expiresIn: expiresIn,
role: user.role,
avatar: user.avatar,
signature: user.signature
}
res.send({
dataUser
});
}
});
}
exports.createUser = (req, res, next) => {
console.log("request:xxxxxxxxxx " + JSON.stringify(req.body));
const newUser = {
name: req.body.name,
email: req.body.email,
password: bcrypt.hashSync(req.body.password),
role: req.body.role,
avatar: req.body.avatar,
signature: req.body.signature
}
User.create(newUser, (err, user) => {
if (err && err.code === 11000) {
return res.status(409).send("El email ya está en uso.");
}
if (err) {
console.log(err);
return res.status(500).send("No se ha podido crear el usuario");
}
const expiresIn = 14 * 60 * 60;
const accessToken = jwt.sign({
id: user.id
},
SECRET_KEY, {
expiresIn: expiresIn
});
const dataUser = {
id: user.id,
name: user.name,
email: user.email,
accessToken: accessToken,
expiresIn: expiresIn,
role: user.role,
avatar: user.avatar,
signature: user.signature
}
//response
res.send({
dataUser
})
})
}
答案 0 :(得分:0)
mongo函数findbyIdandupdated需要一个类似{new:true}的参数,因此它将返回更新的对象。否则返回上一个。