在这个示例中,我们创建了一个Vue组件,其中包含一个按钮用于触发Blob的获取和转换。当按钮被点击时,会发起一个Axios请求来获取Blob对象,并通过blobToBase64方法将其转换为Base64编码的字符串。转换完成后,Base64字符串会被存储在组件的data属性中,并在模板中显示。
formData.append('media',fileIn.originFileobj) const blobData = formData.get('media')// 获取 Blob值 blobToBase64(blobData,base64string=>{ localstorage.setItem('myBlobKey',base64string) }) this.$router.push({path:"/B",query:{...}})//跳转到B页面 需要带啥参数自己写哦}, } } } </...
atob() 方法可用于解码base-64 编码的字符串,再通过Blob将Uint8Array数组转换成pdf类型的文件对象 // content是base64格式viewPdf(content){console.log("content",content);constblob=this.base64ToBlob(content);if(window.navigator&&window.navigator.msSaveOrOpenBlob){window.navigator.msSaveOrOpenBlob(blob);...
注意:今天在使用Vue进行文件上传的代码编写时,发现报错:Error in v-on handler: "TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'."` 显然,是传入的file对象出了问题,根据报错提示,我们应该传入一个Blob对象。也就是说,file不是Blob对象 我们使用console.log...
Error in v-on handler: "TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'." ` 显然,是传入的file对象出了问题,根据报错提示,我们应该传入一个Blob对象。也就是说,file不是Blob对象 我们使用console.log(file)进行调试输出: ...
Vue Blob流与Java后端的接收方案 在现代Web应用中,前端框架如Vue.js与后端服务常常需要进行复杂的数据交互。本文将探讨如何通过Blob流在Vue与Java后端之间传输文件,具体包括Blob的生成、转化为Base64编码并发送到后端,以及Java后端的接收与处理逻辑。 1. 背景 ...
Blob转Base64函数 blobToBase64(blob) { return new Promise((resolve, reject) => { const fileReader = new FileReader(); fileReader.onload = (e) => { resolve(e.target.result); }; fileReader.readAsDataURL(blob); fileReader.onerror = () => { reject(new Error('blobToBase64 error')); }...
downloadFile(blob, fileName) }, 2、调用 //调用公共方法(写在methods里面不需要,直接调用就行) import util from '@/utils/base64ToFile' downloadView(con) { // con是后台返回的base64码 util.downloadFileByByte(con, '错误信息汇总表.xlsx') } ...
实现base64图片压缩函数 代码语言:javascript 代码运行次数:0 运行 AI代码解释 // 参数: base64地址,压缩比例,回调函数(返回压缩后图片的blob和base64)compressPic:function(base64,scale,callback){constthat=this;let_img=newImage();_img.src=base64;_img.onload=function(){let_canvas=document.createElement(...
7、到第 2 步var img = this.getObjectURL(this.imgs[i]),此时,获取到的 img 为blob:http:xxxxxxxx格式的图片,用image.onload转成base64图片,发送后端,但是,这里的this,指向的是这个function()函数,不是全局,且image.onload = function(),其本身无法携带任何参数,所以,需要改成es6的箭头函数image.onload =...