前端代码:
if(this.getFileType(file.type) == "video"){
let windowURL = window.URL || window.webkitURL;
let videoURL = windowURL.createObjectURL(file);
let player = document.createElement("video");
player.src = videoURL;
player.autoplay = "autoplay";
let canvas = document.createElement("canvas");
canvas.width = 700;
canvas.height = 400;
player.addEventListener('play', () => {
canvas.getContext('2d').drawImage(player, 0, 0, 700, 400);
player.pause();
setTimeout(()=>{
let formData = new FormData();
formData.append("base64Data", canvas.toDataURL('image/png'));
formData.append("timestamp", new Date().getTime());
formData.append("site_code", sessionStorage.getItem("siteCode"));
formData.append("sobey_token", sessionStorage.getItem("sobeyToken"));
ApiFileTGetCoverUrl(formData).then((res) => {
if(res.code == 200){
this.$message.success("获取视频封面图片成功");
this.uploadForm.file_cover_url = res.data.file_cover_url;
this.uploadForm.file_cover_path = res.data.file_cover_path;
}else{
Promise.reject("获取视频封面图片过程中服务器发生错误,可能原因为未配置存储");
}
});
},100);
}, false);
}
后端代码:
router.post('/getCoverUrl', async (ctx, next) => {
try{
let result = await checkLoginState.check(ctx);
if(result.status){
// 获取存储地址
let { base64Data,timestamp,site_code,sobey_token } = ctx.request.fields;
let res = await axios.get();
let rootDir = res.data.nas[0].path.replace("\\\\static.com\\hivedata", "\\mnt").replace(/\\/g, "/");
let dateObject = new Date();
let year = dateObject.getFullYear();
let month = dateObject.getMonth()+1;
let date = dateObject.getDate();
let filename = 'image_' + timestamp + '.' + 'png';
base64Data = base64Data.replace(/^data:image\/\w+;base64,/, "");
let pictureBuff = Buffer.from(base64Data, 'base64');
//将图片数据写入文件
fs.writeFile(`${uploadPath}/${filename}`, pictureBuff, (err) => {
if (err) {
console.log("视频封面保存失败");
}else{
// 移动文件
mkdirsSync(`${rootDir}/AiToolsCover`);
mkdirsSync(`${rootDir}/AiToolsCover/${year}`);
mkdirsSync(`${rootDir}/AiToolsCover/${year}/${month}`);
mkdirsSync(`${rootDir}/AiToolsCover/${year}/${month}/${date}`);
let readStream = fs.createReadStream(`${uploadPath}/${filename}`);
let writeStream = fs.createWriteStream(`${rootDir}AiToolsCover/${year}/${month}/${date}/${filename}`);
readStream.pipe(writeStream);
readStream.on('end', () => {
fs.unlinkSync(`${uploadPath}/${filename}`);
});
console.log(`文件移动: ${uploadPath}/${filename} -> ${rootDir}AiToolsCover/${year}/${month}/${date}/${filename}`);
}
});
let returnCoverURL = `${rootDir}AiToolsCover/${year}/${month}/${date}/${'image_' + timestamp + '.' + 'png'}`;
ctx.body = {
code: 200,
message: "获取视频封面地址成功",
data: {
file_cover_path: returnCoverURL.replace(/\//g, "\\").replace("\\mnt", "\\\\static.com\\hivedata"),
file_cover_url: `http://10.20.56.42:9001${returnCoverURL.replace("/mnt", "")}`,
}
}
}else{
util.res(ctx, 1002, result.data);
}
}catch(err){
console.log(err);
ctx.body = {
code: 8888,
message: err,
data: null,
};
}
});