js生成word中图片处理方法

首先功能是要求前台导出word,但是前后台是分离的,图片存在后台,所以就存在跨域问题。

导出文字都是没有问题的(jquery.wordexport.js),但是导出图片就存在问题了:

图片是以链接形式存到word中,这样如果是需要vpn的网站就会存在生成的word在没有vpn的情况下打不开,有vpn的情况下必须启用编辑才能加载出来图片。

解决办法:将图片转换成Data URL格式,再导出。

详细代码如下所示:

function changeImgToDataurl(){
 var charImg = document.all("exportdom").getElementsByTagName("img");
 var imgURLs = "";
 for (var i = 0; i < charImg.length; i++) {
   var imgURL = charImg[i].currentSrc;
   getBase64(imgURL,charImg[i]);
 }
}
function getBase64(url,charImg){
  var Img = new Image();
  Img.crossOrigin = "Anonymous";//跨域必须使用,且后台也得设置允许跨域
  dataURL='';
  Img.src=url;
  Img.onload=function(){ //要先确保图片完整获取到,这是个异步事件
   var canvas = document.createElement("canvas"), //创建canvas元素
   width=Img.width, //确保canvas的尺寸和图片一样
   height=Img.height;
   canvas.width=width;
   canvas.height=height;
   canvas.getContext("2d").drawImage(Img,0,0,width,height); //将图片绘制到canvas中
   dataURL=canvas.toDataURL('image/jpg'); //转换图片为dataURL
   condataurl?condataurl(dataURL,charImg):null; //调用回调函数
  };
}
function condataurl(dataURL,charImg){
 charImg.src=dataURL;
 //console.log(charImg);
}

以上这篇js生成word中图片处理方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • js生成word中图片处理方法

    首先功能是要求前台导出word,但是前后台是分离的,图片存在后台,所以就存在跨域问题. 导出文字都是没有问题的(jquery.wordexport.js),但是导出图片就存在问题了: 图片是以链接形式存到word中,这样如果是需要vpn的网站就会存在生成的word在没有vpn的情况下打不开,有vpn的情况下必须启用编辑才能加载出来图片. 解决办法:将图片转换成Data URL格式,再导出. 详细代码如下所示: function changeImgToDataurl(){ var charImg

  • 使用PHPWord生成word文档的方法详解

    本文实例讲述了使用PHPWord生成word文档的方法.分享给大家供大家参考,具体如下: 有时我们需要把网页内容保存为Word文档格式,以供其他人员查看和编辑.PHPWord是一个用纯PHP编写的库,使用PHPWord可以轻松处理word文档内容,生成你想要的word文档. 下载源码 安装 我们使用Composer 来安装PHPWord. composer require phpoffice/phpword 如何使用 自动加载 安装好phpword后,新建一个php文档,引入autoload.p

  • js基于qrcode.js生成二维码的方法【附demo插件源码下载】

    本文实例讲述了js基于qrcode.js生成二维码的方法.分享给大家供大家参考,具体如下: 调用qrcode.js文件代码: <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"/> <script src="js/qrcode.js"></script> <style> #qr

  • Python提取Word中图片的实现步骤

    目录 1.思路 2.具体实现 2.1导入相关库 2.2定义函数 2.3重命名word文件,将后缀名docx改为zip 2.4zip还原为docx文件,并获得图片的列表 2.5将图片复制到需要保存的文件夹中 2.6删除tmp缓冲文件夹中的文件,用以存储下一次的文件 2.7运行程序 3效果预览 3.1源word 3.2提取的图片 4附:doc转docx 1.思路 在网上查找了半天,基本都是提取word中文字的,没有找到可以把word中的图片提取出来的方法.一个巧合的情况下,发现将word的后缀名改为

  • JS去除字符串中空格的方法

    本文实例讲述了JS去除字符串中空格的方法.分享给大家供大家参考,具体如下: 去掉字符串中的所有空格,不仅仅包含前后空格: text = text.replace(/\s/ig,''); 去掉前后空格: 第一种方法: 使用trim() function Trim(m){ while((m.length>0)&&(m.charAt(0)==' ')) m = m.substring(1, m.length); while((m.length>0)&&(m.charA

  • js改变Iframe中Src的方法

    本文实例讲述了js改变Iframe中Src的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title></title> <meta name="GENERATOR" content="Microsoft Visual Studio .N

  • jQuery及JS实现循环中暂停的方法

    本文实例讲述了jQuery及JS实现循环中暂停的方法.分享给大家供大家参考.具体分析如下: 问题: jquery对数组进行循环,如果要求每次循环的时候暂停2秒钟,在使用jQuery的.earch循环的时候,无论怎么设置,都不会暂停. setTimeout也只是在第一次执行的时候暂停. 原因猜测: js开始执行多线程? 改进: 改为setInterval来控制循环,达到数组最大值的时候,clearInterval取消循环. 以下是jQuery代码: <script type="text/ja

  • 详解js私有作用域中创建特权方法

    本文实例分享了js私有作用域中创建特权方法,供大家参考,具体内容如下 特权方法就是有权访问私有变量和私有函数的公有方法: function MyObject(){ var privateVariable = 10; function privateFunction(){ return false; } this.publicMethod = function(){ privateVariable ++; return privateFunction(); }; } var x = new MyO

  • C#编程获取资源文件中图片的方法

    本文实例讲述了C#编程获取资源文件中图片的方法.分享给大家供大家参考.具体实现方法如下: using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Reflection; using System.Drawing; namespace CL { public class RES { /// <summary> /// 定义一个资源文件名 资源文件名 = 工

  • 详解C#编程获取资源文件中图片的方法

    详解C#编程获取资源文件中图片的方法 本文主要介绍C#编程获取资源文件中图片的方法,涉及C#针对项目中资源文件操作的相关技巧,以供借鉴参考.具体内容如下: 例子: using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Reflection; using System.Drawing; namespace CL { public class RES { /

随机推荐