在基于phonegap的应用程序上使用jspdf生成客户端pdf

时间:2013-09-03 15:26:21

标签: javascript android cordova jspdf

我尝试从本地数据生成pdf。

我遇到了ArrayBuffer()和Uint8Array对象的问题。解决方案是添加我在互联网上找到的js实现。

现在这行出错:

E/Web Console(21515): Uncaught TypeError: Illegal constructor at file:///android_asset/www/libs/jspdf.js:973

这是一行:

blob = new Blob([array], {type: "application/pdf"});

我添加了BlobBuilder.js和Blob.js(就像在jspdf示例中一样)。

一般情况下,使用jspdf可以吗? (我发现jspdf存在很多问题)

我该如何解决这个问题?

如何在浏览器,android和ios上生成pdfs ..?

感谢您的帮助,祝您度过愉快的一天: - )

2 个答案:

答案 0 :(得分:2)

try  
{
    blob = new Blob([data], {type: "application/pdf"});
    console.debug("case 1");
}
catch (e)  
{
    window.BlobBuilder = window.BlobBuilder ||
                   window.WebKitBlobBuilder ||
                      window.MozBlobBuilder ||
                      window.MSBlobBuilder;
    if (e.name == 'TypeError' && window.BlobBuilder)  
    {
        var bb = new BlobBuilder();
        bb.append(data);
        blob = bb.getBlob("application/pdf");
        console.debug("case 2");
    }
    else if (e.name == "InvalidStateError")  
    {
         // InvalidStateError (tested on FF13 WinXP)
         blob = new Blob([array], {type: "application/pdf"});
         console.debug("case 3");
    }
    else  
    {
        // We're screwed, blob constructor unsupported entirely   
        console.debug("Errore");
    }
}

答案 1 :(得分:1)

Blob构造函数在android中不起作用(不支持所有Web浏览器)。 快速解决方案是,使用Phonegap文件编写器创建PDF文件。以下是 jsPDF.js 文件的更改:

output = function (type, options) {
            var undef, data, length, array, i, blob;
            switch (type) {
            case undef:
                return buildDocument();
            case 'save':
                if (navigator.getUserMedia) {
                    if (window.URL === undefined) {
                        return API.output('dataurlnewwindow');
                    } else if (window.URL.createObjectURL === undefined) {
                        return API.output('dataurlnewwindow');
                    }
                }
                data = buildDocument();
                write(data, options);                    
                break;
            case 'datauristring':
            case 'dataurlstring':
                return 'data:application/pdf;base64,' + btoa(buildDocument());
            case 'datauri':
            case 'dataurl':
                document.location.href = 'data:application/pdf;base64,' + btoa(buildDocument());
                break;
            case 'dataurlnewwindow':
                window.open('data:application/pdf;base64,' + btoa(buildDocument()));
                break;
            default:
                throw new Error('Output type "' + type + '" is not supported.');
            }
            // @TODO: Add different output options
        };

将CLI中的cordova文件插件作为“cordova插件添加org.apache.cordova.file”添加到您的项目中。

接下来使用phonegap filewriter API实现 write()功能,如下所示:

write = function (data, filename) {
    var PERSISTENT = window.PERSISTENT || LocalFileSystem.PERSISTENT;

window.requestFileSystem(PERSISTENT, 0, gotFS, fail);

function gotFS(fileSystem) {
    fileSystem.root.getFile(filename, {create: true, exclusive: false}, gotFileEntry, fail);
}

function gotFileEntry(fileEntry) {
    fileEntry.createWriter(gotFileWriter, fail);
}

function gotFileWriter(writer) {
    writer.write(data);
}

function fail(error) {
    console.log(error.code);
 }
}