杰网资源 Design By www.escxy.com
使用技术
itext.jar : 将byte文件输入流转换为图片，pdf等
html2canvas.js ：将html页面区域截图为base64编码的图片资源
java+js
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;
4 前端截图，访问后端接口，保存截图文件到本地为pdf或者其他格式的文件。
有兴趣的同学可以把后端改为下载文件到本地
5 项目源码地址
https://github.com/zhangjy520/learn_java/tree/master/boot
杰网资源 Design By www.escxy.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
杰网资源 Design By www.escxy.com
暂无评论...
《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒 经典版》的玩家都可以获得奖励。