黄冈网站建设推荐seo查询排名软件
尝试了集中图片转pdf的方式，
（1）最终较为优秀的一种是使用jspdf将图片转为pdf，支持JPG/JPEG/PNG/BMP/TIF/TIFF图片格式转换，详见我的另一篇文章：
https://blog.csdn.net/Ann_52547/article/details/132214909?spm=1001.2014.3001.5502
（2）使用print-js插件，去看看
（3）pdfMake图片转pdf，支持JPG/JPEG/PNG图片格式转换，去看看
（4）html2canvas，转出来的图片模糊，需要处理啊，我没处理，去看看
（2）print-js图片转pdf
npm安装print-js依赖
main.js:
import print from 'print-js'
使用：
printJS({// blob链接 数组printable: ['blob:http//.....'],// 打印类型 目前为图片样式 可以根据上面的网址进行修改 type: 'pdf',// 二维码样式 可以自己进行修改imageStyle: 'margin:0px; padding:0px; width:40%; height:40%; display: block; margin: 0 auto; padding-top:12%'// 也可以设置以下参数 继承所有css样式 没试过image的 html的效果不错// targetStyles:['*']})
（3）pdfMake图片转pdf
安装pdfMake依赖
async convertToPDF(blob, id) {let this_ = thislet base64Data = await this.readFile(blob);const docDefinition = {content: [{ image: base64Data, fit: [190, 277], alignment: 'center' } //width: 400,]}const pdfDocGenerator = pdfMake.createPdf(docDefinition)pdfDocGenerator.getBlob(pdfBlob => {console.log("这是pdf的blob格式-----"pdfBlob);// 可以在这里使用blob，比如将其转换为Blob URLlet url = window.URL.createObjectURL(new Blob([pdfBlob], { type: 'application/pdf' }))});
},//blob转base64
readFile(file) {return new Promise((resolve, reject) => {const reader = new FileReader();reader.onload = function () {const contents = reader.result;resolve(contents);};reader.onerror = function (event) {reject(event.target.error);};reader.readAsDataURL(file);});
},
其他一些转化方法
//ArrayBuffer转换为Base64
arrayBufferToBase64(arrayBuffer) {const uint8Array = new Uint8Array(arrayBuffer);let binaryString = '';for (let i = 0; i < uint8Array.length; i++) {binaryString += String.fromCharCode(uint8Array[i]);}return btoa(binaryString);
},
（4）html2canvas图片转pdf
安装依赖
<div v-for="(item, index) in list" :key="index"><img :id="'imageContainer'+item.id" :src="item.imgurl" alt="" />
</div>
async imgToPdf(imgUrl, id) {// 将图片渲染为Canvas//因为img标签是循环展示图片的，通过id判断是哪个img标签const canvas = await html2canvas(window.document.getElementById('imageContainer'+id))// 获取Canvas的DataURLconst imageURL = canvas.toDataURL('image/png')//const imageURL = canvas.toDataURL(imgUrl)// 创建PDF实例并设置纸张大小const pdf = new jsPDF('p', 'px', 'a4')// 计算图片在PDF中的宽度和高度const pdfWidth = pdf.internal.pageSize.getWidth()const pdfHeight = (canvas.height * pdfWidth) / canvas.width// 将图片添加到PDF中pdf.addImage(imageURL, 'JPEG', 0, 0, pdfWidth, pdfHeight)pdf.save()const blob = new Blob([pdf], { type: 'application/PDF' })console.log("生成的pdf的blob文件---",blob)},