2014-10-15 1 views
5

응용 프로그램에 PDFKit을 사용하고 있습니다. Javascript (Node.js가 없음)가있는 브라우저에서 HTML 파일로 사용하고 있습니다. PDFKit - 사용자 정의 글꼴 - fs.readFileSync가 함수가 아닙니다.

나는 GitHub의에서 PDFKit 다운로드 : https://github.com/devongovett/pdfkit/releases

뿐만 아니라 물방울 스트림 :

doc.registerFont('Custom Font', 'fonts/GOODDP__.TTF'); 
doc.font('Custom Font').fontSize(fontSize).text($("#text1").val(), xPos, yPos, configObj); 

그러나 I : https://github.com/devongovett/blob-stream

내가 그렇게 같은 문서에 따라 사용자 정의 글꼴을 포함하기 위해 노력하고있어 항상이 오류가 발생합니다.

fs.readFileSync is not a function 

fs.readFileSync이 node.js의 일부이기 때문에 이는 의미가 있으며, 저는 이것을 사용하지 않을 것입니다. 그러나 문서의 예에서는 브라우저에서이 코드를 사용할 수 있다고합니다.

나는 Browserify 옵션도 알고 있지만, 나는이 상황에서 도움이 될 방법이나 있는지 확실하지 않습니다 당신이이 기능을하고 있음을 Browserify를 사용해야 보인다

+0

브라우저는 클라이언트 파일 액세스를 차단하므로 먼저 파일을 서버에 업로드하도록 사용자에게 요청해야합니다. – Ammaroff

답변

2

미리 컴파일 된 PDFKit.js를 사용하여 Node.js 특정 기능에 대해이를 자르지 않습니다.

5

당신은 ArrayBuffer을 사용해야합니다 :

 var oReq = new XMLHttpRequest(); 
     oReq.open("GET", "css/fonts/Open_Sans/OpenSans-Regular.ttf", true); 
     oReq.responseType = "arraybuffer"; 

     oReq.onload = function(oEvent) { 
      var arrayBuffer = oReq.response; // Note: not oReq.responseText 

      if (arrayBuffer) { 
       PdfExporter.doc.registerFont('OpenSans', arrayBuffer) 
      } 
     }; 

     oReq.send(null); 
0

나는이 문제에 달려 안드레아의 대답은 솔루션의 일부입니다. 실제로 pdfkit.js 파일을 조정해야합니다. 하지만 먼저 Andrea가 한 일을해야합니다.

var myImage; 
var oReq = new XMLHttpRequest(); 
oReq.open("GET", "myimage.jpg", true); 
oReq.responseType = "arraybuffer"; 
oReq.onload = function(oEvent) 
{ 
    myImage = oReq.response; //image as an arraybuffer 
    makePDF(); 
}; 
oReq.send(null) 

//then use myImage like normal: 
doc.image(myImage); 

내가 말했듯이 pdfkit.js 파일을 조정해야합니다. 약 2888 줄에서 :

PDFImage.open = function(src, label) { 
    var data, match; 
    if (Buffer.isBuffer(src)) { 
     data = src; 
    } else { 
     //START NEW 
     if (src instanceof ArrayBuffer) { 
      data = new Buffer(new Uint8Array(src), 'object'); 
     } else 
     //END NEW 
     if (match = /^data:.+;base64,(.*)$/.exec(src)) { 
      data = new Buffer(match[1], 'base64'); 
     } else { 
      data = fs.readFileSync(src); 
      if (!data) { 
       return; 
      } 
     } 
    } 

blob-stream.js도 포함해야합니다. // START NEW 다음에 XMLHttpRequests에서 오는 배열 버퍼를 처리하는 추가 옵션을 추가했습니다.

이것이 최선의 해결책인지는 잘 모르겠지만 작동합니다.