我使用 javascript jsPDF 库生成带有文本和图像的 pdf。然后我想将文件发送到服务器以便发送一封电子邮件。问题是到达服务器的文件已损坏且无法打开,或者我看不到 pdf 上的图像。
我的代码:
var pdf = btoa(doc.output());
- 这给出了一个错误:Uncaught InvalidCharacterError: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside the Latin1 range.
var pdf = btoa(encodeURIComponent(doc.output()));
var data = new FormData();
data.append("data" , pdf);
var xhr = new XMLHttpRequest();
xhr.open( 'post', '/url', true );
xhr.send(data);
我还尝试了其他的东西,比如:
var pdf = btoa(encodeURIComponent(doc.output('blob')));
- 文件无法打开
var pdf = btoa(doc.output('blob'));
- 文件无法打开
var pdf = btoa(unescape(encodeURIComponent(doc.output())));
- 文件将打开但图像是一些灰线
PS:我使用的是 Laravel 5。服务器代码:
$data = base64_decode($_POST['data']);
$fname = "test.pdf";
$file = fopen("pdf/" .$fname, 'w');
fwrite($file, $data);
fclose($file);
解决方案:
js代码:
var blob = doc.output('blob');
var fd = new FormData();
fd.append('data', blob);
$.ajax({
type: 'POST',
url: '/url',
data: fd,
processData: false,
contentType: false
}).done(function(data) {
console.log(data);
});
服务器代码:
if(!empty($_FILES['data'])){
move_uploaded_file(
$_FILES['data']['tmp_name'],
public_path() . '/test.pdf'
);
return "Pdf was successfully saved.";
} else {
return "No Data Sent";
}
最佳答案
btoa 被 ascii 字节范围搞乱了……javascript 不能保存所有字符。这就是为什么你不应该使用 FileReader 的 readAsBinaryString 的原因......以正确的方式处理二进制文件,不是作为字符串或 ~3x 大的 base64 字符串,而是作为 blob、ArrayBuffer 或类型化数组,结果会很好
var blob = doc.output('blob')
xhr.send(blob)
关于javascript - jsPDF - 将 pdf 发送到服务器最终损坏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39649045/