2017-04-09 15 views
0

私はかなり新しいnodeJsです。サーバー上にjsPdfというpdfを作成しようとしています。nodejsとjspdfを使ってpdfにpng画像を追加

nodeJsがjspdfに使用したatobをサポートしていdoestよう私はnpm install jspdf --save

を用いjspdfをインストールしている、私は

npm install atob --saveを添加し

png-jsのために必要とされる
var atob = require('atob'); 
var PNG = require('png-js'); 

を追加しましたjspdfにpngファイルを追加する。 私は次のコード

let imgData=request.payload.canvasobj; 
let pdfContent = new jsPDF(); 
pdfContent.addImage(imgData, 'PNG', 40, 20, 0, 0); 
let data = pdfContent.output('arraybuffer'); 
let buffer = Buffer.from(data); 
let arraybuffer = Uint8Array.from(buffer); 
fs.appendFile('./canvas.pdf', new Buffer(arraybuffer), function (err) { 
    if (err) { 
     console.log(err); 
    } else { 
     console.log("PDF created"); 
    } 
}); 

でPDFにPNGファイルを追加しようとすると、次のエラーが、私は何を逃していない

Debug: internal, implementation, error 
    TypeError: Uncaught error: Cannot read property 'buffer' of undefined 
    at Object.jsPDFAPI.processPNG (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\jspdf\dist\jspdf.debug.js:8796:80) 
    at Object.jsPDFAPI.addImage (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\jspdf\dist\jspdf.debug.js:4696:50) 
    at canvas (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\requestHandler.js:105:16) 
    at Object.internals.handler (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\lib\handler.js:99:36) 
    at request._protect.run (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\lib\handler.js:30:23) 
    at internals.Protect.run (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\lib\protect.js:59:12) 
    at exports.execute (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\lib\handler.js:24:22) 
    at each (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\lib\request.js:382:16) 
    at iterate (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\node_modules\items\lib\index.js:36:13) 
    at done (C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\hapi\node_modules\items\lib\index.js:28:25) 
Debug: internal, implementation, error 
    TypeError: fn is not a function 
    at C:\LearningPro\NodeJsProjects\pdfexport-nodejs\node_modules\png-js\png-node.js:246:16 
    at Inflate.onEnd (zlib.js:227:5) 
    at emitNone (events.js:91:20) 
    at Inflate.emit (events.js:185:7) 
    at endReadableNT (_stream_readable.js:974:12) 
    at _combinedTickCallback (internal/process/next_tick.js:74:11) 
    at process._tickDomainCallback (internal/process/next_tick.js:122:9) 

を誘発していますか? JPEG Imageでうまく動作します。

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...QmCC 

答えて

1

がjsPDFライブラリーと協力し、不正な画像データの入力フォーマットを有するとエラーにつまずいたログ

から

画像データは、私は次のように画像データのフォーマットを決定するためにログを追加するように助言する:

let imgData=request.payload.canvasobj; 
console.log(imgData); 

形式であることを確認します。

data:image/png;base64,... 

どこで...あなたの画像データがbase64でエンコードされていますか?

EDIT jsPDFをローカルに設定しました。 Node.jsの4.xで働いて(NPMから)jspdfパッケージを得るために、私は次の操作を実行する必要がありました:

global.PNG = require('png-js'); 
global.window = {document: {createElementNS:() => {return {}} }}; 
global.navigator = {}; 
global.atob = require('atob'); 

そして、成功しjsPDFオブジェクトを作成するために行きました。

var fs = require('fs'); 
var jsPDF = require('jspdf'); 
var imgData = fs.readFileSync('imgdata').toString(); 
var pdfContent = new jsPDF(); 
var ret = pdfContent.addImage(imgData, 'PNG', 40, 20, 0, 0); 
var data = new Buffer(pdfContent.output('arraybuffer')); 

fs.appendFile('./canvas.pdf', data, function (err) { 
    if (err) { 
     console.log(err); 
    } else { 
     console.log("PDF created"); 
    } 
}); 

セットアップではブラウザ以外の環境で調整が必要だったため、元の問題を再現できませんでした。

+0

画像データは完璧です質問の画像データを垣間見るように追加しました – DharanBro

+0

私は自分の答えを更新しました。自分で働いていて、ライブラリを使用するためにいくつかのグローバル変数を作成する必要があります。参照してください。 –

+0

'png-js'は' jspdf'と完全には動作しません。私は 'png-js'を' jspdf'で提供された 'png.js'から修正しました。また、私はアプリケーションでより多くのDOM機能が必要だったので、ドキュメントのために 'jsdom'を使用しました。 – DharanBro

関連する問題