Я пытаюсь создать файл PDF с помощью JavaScript, используя jsPDF. У меня есть небольшая тестовая страница. По сути, у меня есть кнопка загрузки PDF, которая берет изображение base64 из диапазона и использует его для файла imgData. Затем я пытаюсь addImage преобразовать данные изображения в pdf, а затем сохранить их. Кажется, все работает, он создает PDF и предлагает загрузить. Однако, когда я пытаюсь просмотреть PDF-файл с помощью xpdf или Foxit Reader, мне говорят, что PDF-файл поврежден. Я неправильно создал этот PDF-файл? Моя веб-страница довольно длинная, поэтому я поместил ее в Pastebin.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="js/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery-ui-1.8.17.custom.min.js"></script>
<script type="text/javascript" src="../jspdf.js"></script>
<script type="text/javascript" src="../libs/FileSaver.js/FileSaver.js"></script>
<script type="text/javascript" src="../libs/BlobBuilder.js/BlobBuilder.js"></script>
<script type="text/javascript" src="../jspdf.plugin.addimage.js"></script>
<script type="text/javascript" src="../jspdf.plugin.standard_fonts_metrics.js"></script>
<script type="text/javascript" src="../jspdf.plugin.split_text_to_size.js"></script>
<script type="text/javascript" src="../jspdf.plugin.from_html.js"></script>
<script type="text/javascript" src="js/basic.js"></script>
<title>Sup!</title>
<script>
function changeCan() {
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,128,128);
}
function changeCan3() {
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle="#FFFFFF";
ctx.fillRect(0,0,128,128);
var image = new Image();
image.src = document.getElementById("3span").innerHTML;
ctx.drawImage(image,0,0);
}
function changeCan4() {
var imgData = document.getElementById("3span").innerHTML;
window.alert(imgData.length);
var doc = new jsPDF();
doc.addImage(imgData, 'JPEG', 15, 40, 128, 128);
doc.save('Test.pdf');
}
</script>
</head>
<body>
Yo!<hr>
<canvas id="myCanvas" width="128" height="128"></canvas><hr>
<button type="button" onClick="changeCan()">Change Me To Red!</button>
<button type="button" onClick="changeCan3()">Change Me To Span!</button>
<button type="button" onClick="changeCan4()">Download Me!</button>
<hr>
<span id="3span" style="display:none;">B64 DATA HERE</span>
</body>
</html>
3spanDIV innerHTML содержитdata:image/jpeg;base64,. Это требуется/необходимо? Просто мысль, я не знаю эту библиотеку jsPDF, но мне интересно, она мне скоро понадобится :) - person JScoobyCed schedule 21.01.2013data:image/jpeg;base64,кажется необходимой для другой части тестовой страницы, с которой я дурачился, которая меняла холст на графику смеющегося человека. Также на веб-странице jsPDF jspdf.com пример с изображением кошки показывает заголовокdata:image/jpeg;base64,, если хотите. @JScoobyCed Так что я не совсем уверен, нужен он или нет, я могу попытаться быстро удалить его и создать другой PDF-файл! - person 0xhughes schedule 21.01.2013getJpegSize could not find the size of the image [Break On This Error] throw new Error('getJpegSize could not find the size of the image');Я посмотрел код в .js файле из его библиотеки и толком не могу сказать что именно он делает. Захват определенных символов, получение длины и выполнение некоторых математических операций с этой информацией. - person 0xhughes schedule 21.01.2013[object Uint8Array]. Так что я думаю, что это не повреждено, а что-то не полностью сгенерировано. Не могу больше помочь, чем то, что мне нужно сначала прочитать о jsPDF, и я не могу этого сделать сейчас. Удачи. - person JScoobyCed schedule 21.01.2013