在Vue项目根据图片url获取file对象并用axios上传
图片url转file对象
<script>
export default {
data() {
return {
ruleForm: {
coverUrl: "",
coverFile: ""
},
};
},
methods: {
imgUrlToFile(url) {
var self = this;
var imgLink = url;
var tempImage = new Image();
//如果图片url是网络url,要加下一句代码
tempImage.crossOrigin = "*";
tempImage.onload = function() {
var base64 = self.getBase64Image(tempImage);
var imgblob = self.base64toBlob(base64);
var filename = self.getFileName(self.ruleForm.coverUrl);
self.ruleForm.coverFile = self.blobToFile(imgblob, filename);
};
tempImage.src = imgLink;
},
getBase64Image(img) {
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d