java canvas保存_前台js(canvas)生成图片,通过后台java进行保存

前言:

本来我的目的是要通过前台一个按钮点击后生成一个pdf文件保存到电脑,然后我是用的jspdf做的,但是这玩意(js)只能通过浏览器下载的方式保存到电脑,但是需求是直接保存到本地不通过浏览器下载,这就很尴尬了,咱知道js是基本无法这样操作的,就算强行要操作便是打开activeXObject这种不兼容又有安全问题的东西,所以只好另辟蹊径,用java来搞了。

思路:

1.原来生成pdf的方式是通过html5canvas的一种方法,将页面某部分截图成图片,然后添加到jspdf对象(关于jspdf大家可以看上一篇博文)。

2.但是现在不能用js,所以我们只保留canvas图片,然后将图片数据传往后台java,至于传送方法就不多讲,ajax,mvc什么的随便,这里我用的是ajax的dwr框架。

3.java接收后,对图片数据进行转码,保存到本地图片。

4.对本地图片操作添加到pdf对象。

源码:

(js部分)

function pdfTest(){

html2canvas($('#bestfizz'), {

onrendered: function(canvas){

var dataURL = canvas.toDataURL('images/png');//获取图片数据URL,获取后是data:image/png;base64,iVBORw0KGgoA..后面一堆..

var imageDataB64 = dataURL.substring(22);//这里我们需要将上面获取

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值