本篇文章给大家介绍html转pdf的方式。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
1、准备资源
itext.jar
www.baidu.com
html2canvas.js
www.baidu.com
2、前端代码：
//进行截图操作，document.queryselector("body") 为要截图的区域 function test() { html2canvas(document.queryselector("body"), { onrendered: function (canvas) { var dataurl = canvas.todataurl('image/png'); var formdata = new formdata(); //模拟表单对象 formdata.append("imgdata", convertbase64urltoblob(dataurl)); //写入数据 var xhr = new xmlhttprequest(); //数据传输方法 xhr.open("post", "http://localhost:8080/pdf"); //配置传输方式及地址 xhr.send(formdata); xhr.onreadystatechange = function () { //回调函数 }; } }); } //格式化图片base64编码转换为byte文件流 function convertbase64urltoblob(urldata){ //去掉url的头，并转换为byte var bytes=window.atob(urldata.split(',')[1]); //处理异常,将ascii码小于0的转换为大于0 var ab = new arraybuffer(bytes.length); var ia = new uint8array(ab); for (var s = 0;s<bytes.length;s++){ ia[s] = bytes.charcodeat(s); } return new blob( [ab] , {type : 'image/png'}); } <body onclick="test()">//调用截图方法即可
3、后端代码：
@requestmapping(value = "/pdf",method = requestmethod.post) public void test(multiparthttpservletrequest request, httpservletresponse response) throws ioexception { string filepath = "d:\\blog\\exportpdf2.pdf"; string imagepath = "d:\\blog\\exportimg2.png"; document document = new document(); try{ map getmap = request.getfilemap(); multipartfile mfile = (multipartfile) getmap.get("imgdata"); //获取数据 inputstream file = mfile.getinputstream(); byte[] filebyte = filecopyutils.copytobytearray(file); fileimageoutputstream imageoutput = new fileimageoutputstream(new file(imagepath));//打开输入流 imageoutput.write(filebyte, 0, filebyte.length);//生成本地图片文件 imageoutput.close(); pdfwriter.getinstance(document, new fileoutputstream(filepath)); //itextpdf文件 document.open(); document.add(new paragraph("just test ...")); image image = image.getinstance(imagepath); //itext-pdf-image float heigth = image.getheight(); float width = image.getwidth(); int percent = getpercent2(heigth, width); //按比例缩小图片 image.setalignment(image.middle); image.scalepercent(percent+3); document.add(image); document.close(); }catch (documentexception de) { system.err.println(de.getmessage()); } catch (exception e) { e.printstacktrace(); } } private static int getpercent2(float h, float w) { int p = 0; float p2 = 0.0f; p2 = 530 / w * 100; p = math.round(p2); return p; }
4、包名
import com.itextpdf.text.document;import com.itextpdf.text.documentexception;import com.itextpdf.text.image;import com.itextpdf.text.paragraph;import com.itextpdf.text.pdf.pdfwriter;import org.springframework.boot.springapplication;import org.springframework.boot.autoconfigure.springbootapplication;import org.springframework.stereotype.controller;import org.springframework.util.filecopyutils;import org.springframework.web.bind.annotation.requestmapping;import org.springframework.web.bind.annotation.requestmethod;import org.springframework.web.multipart.multipartfile;import org.springframework.web.multipart.multiparthttpservletrequest;import javax.imageio.stream.fileimageoutputstream;import javax.servlet.http.httpservletresponse;import java.io.file;import java.io.fileoutputstream;import java.io.ioexception;import java.io.inputstream;import java.util.map;
5、项目源码地址
https://github.com/zhangjy520/learn_java/tree/master/boot
推荐学习：html视频教程
以上就是html如何转pdf的详细内容。