首页前端开发JavaScripthtml如何转pdf

html如何转pdf

时间2024-01-29 14:25:03发布访客分类JavaScript浏览221
导读:收集整理的这篇文章主要介绍了html如何转pdf,觉得挺不错的,现在分享给大家,也给大家做个参考。本篇文章给大家介绍htML转pDF的方式。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。1、准备资源IText.jar ww...
收集整理的这篇文章主要介绍了html如何转pdf,觉得挺不错的,现在分享给大家,也给大家做个参考。本篇文章给大家介绍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;
    sbytes.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的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

html

若转载请注明出处: html如何转pdf
本文地址: https://pptw.com/jishu/591197.html
input文本框如何实现添加提示文字,填写内容时消失 html怎么添加图片

游客 回复需填写必要信息