HTML输入标记文件处理

时间:2013-07-11 00:57:11

标签: html file

在PDF阅读器pdf-js的此代码中,有一个input标记可让用户上传输入文件

 <input id="fileInput" class="fileInput" type="file" oncontextmenu="return false;" style="visibility: hidden; position: fixed; right: 0; top: 0" />

input标记不是任何表单的一部分。用户上传文件后,它会在哪里上传?处理文件的代码在哪里? (我一般都会问,不一定特定于这段代码。)

1 个答案:

答案 0 :(得分:3)

  

“然后它很有趣。这段代码没有服务器端”

不,它没有。

Pdf.js是一个用javascript编写的客户端程序。所以这适用于javascript端。

它实际上需要你想要显示的文件,并且做一些必须做的事情,比如将缓冲区转换为Uint8Array而不是渲染它。

所有进程都发生在javascript端。没有服务器端,没有文件上传。

Here是一篇关于在javascript中读取本地文件的文章

以下是pdf.viewer.js

中代码的相关部分
window.addEventListener('change', function webViewerChange(evt) {
  var files = evt.target.files;
  if (!files || files.length === 0)
    return;

  // Read the local file into a Uint8Array.
  var fileReader = new FileReader();
  fileReader.onload = function webViewerChangeFileReaderOnload(evt) {
    var buffer = evt.target.result;
    var uint8Array = new Uint8Array(buffer);
    PDFView.open(uint8Array, 0);
  };

  var file = files[0];
  fileReader.readAsArrayBuffer(file);
  PDFView.setTitleUsingUrl(file.name);

  // URL does not reflect proper document location - hiding some icons.
  document.getElementById('viewBookmark').setAttribute('hidden', 'true');
  document.getElementById('download').setAttribute('hidden', 'true');
}, true);