pdfjs转图片_使用jspdf将图像url转换为pdf

function convertImgToBase64(url)

{

var canvas = document.createElement('canvas');

var ctx = canvas.getContext('2d');

img = document.createElement('img'),

img.src = url;

canvas.height = img.height;

canvas.width = img.width;

var dataURL = canvas.toDataURL('image/jpeg')

alert(dataURL);

canvas = null;

return dataURL;

}

var imageurl = 'http://qph.is.quoracdn.net/main-qimg-ca033a73e2ea858908c44905d4c25f4b?convert_to_webp=true';

var som =convertImgToBase64(imageurl);

doc.addImage(som, 'JPEG', 15, 40, 180, 180);

doc.output('datauristring');

but nothing happens no pdf is generated ? I am getting the correct base64 code in alert box but image is not generated?

解决方案

Here is my solution for the same problem.

let logo = null;

getDataUri(imgUrl, function(dataUri) {

logo = dataUri;

console.log("logo=" + logo);

});

function getDataUri(url, cb)

{

var image = new Image();

image.setAttribute('crossOrigin', 'anonymous'); //getting images from external domain

image.onload = function () {

var canvas = document.createElement('canvas');

canvas.width = this.naturalWidth;

canvas.height = this.naturalHeight;

//next three lines for white background in case png has a transparent background

var ctx = canvas.getContext('2d');

ctx.fillStyle = '#fff'; /// set white fill style

ctx.fillRect(0, 0, canvas.width, canvas.height);

canvas.getContext('2d').drawImage(this, 0, 0);

cb(canvas.toDataURL('image/jpeg'));

};

image.src = url;

}

Then to generate the pdf

var doc = new jsPDF();

let left = 15;

let top = 8;

const imgWidth = 100;

const imgHeight = 100;

doc.addImage(logo, 'PNG', left, top, imgWidth, imgHeight);

doc.output('dataurlnewwindow'); //opens pdf in new tab