将文件路径传递给javascript输入android

时间:2017-10-28 07:42:09

标签: javascript jquery html

据我所知,由于安全原因,无法提供javascript的物理文件路径。但是,当我看到Mozilla的pdf.js和mupdf android pdf viewer时,我发现这很有可能。有一种机制可以将文件路径传递给javascript。我探讨了PDF.js,但是当我需要一个简单的解决方案时,似乎很难使用它。 我想将android内部存储文件位置传递到以下代码而不是使用input id="files" type="file",这需要我浏览并选择文件。在我的情况下,我想从sdcard传递文件位置。 以下代码实际上将ms word(docx)文件加载为html,然后我将在我的项目的webview中显示。在pdf.js的情况下,我们使用它以类似的方式显示pdf。

 <script>
$(document).ready(function(){
    //Input File
  var $files = $('#files');
  //File Change Event
  $files.on('change', function (e) {
    //File Object Information
    var files = e.target.files;
    //Create DocxJS
    var docxJS = new DocxJS();
    //File Parsing
    docxJS.parse(
      files[0],
      function () {
        //After Rendering
        docxJS.render($('#loaded-layout')[0], function (result) {
          if (result.isError) {
            console.log(result.msg);
          } else {
            console.log("Success Render");
          }
        });
      }, function (e) {
        console.log("Error!", e);
      }
    );
  });
});
</script>
<input id="files" type="file" name="files[]" multiple="false"  />
<div id="loaded-layout" style="width:100%;height:800px;">
</div>

您可以在android here中查看基于PDF.JS的pdfviewer代码。

我在用于输入文件的PDF.js代码中找到了什么: 在index.html文件中包含的pdffile.js中,提到了url变量指向文件的实际位置,即在资源文件夹中,然后在pdf.js中使用,但此时使用似乎令人困惑。有什么方法我可以使用真正的文件路径或以某种方式在android中传递真实路径以查看docx的目的?

更新: 我发现Mozilla的PDF.js实际上将文件位置视为URL,因此url中的文件被转换为javascript文件对象或blob。因此,我使用Ajax从服务器创建了一个url:

     var myObject;
    var xhr = new XMLHttpRequest();
    xhr.open("GET","10143.docx",true); // adding true will make it work asynchronously
    xhr.responseType = 'blob';
    xhr.onload = function(e) {
        if (this.status == 200){
            //do some stuff
            myObject = this.response;
        }
    };
    xhr.send();



    $(document).ready(function(){
    //Input File
  var $files = $('#files');

  //File Change Event
  $files.on('change', function (e) {

    //File Object Information
    var files = myObject.files;

    //Create DocxJS
    var docxJS = new DocxJS();

    //File Parsing
    docxJS.parse(
      blobToFile(myObject, "10143.docx"),
      function () {
        //After Rendering
        docxJS.render($('#loaded-layout')[0], function (result) {
          if (result.isError) {
            console.log(result.msg);
          } else {
            console.log("Success Render");
          }
        });
      }, function (e) {
        console.log("Error!", e);
      }
    );
  });
});

function blobToFile(theBlob, fileName){
    //A Blob() is almost a File() - it's just missing the two properties below which we will add
    theBlob.lastModifiedDate = new Date();
    theBlob.name = fileName;
    return theBlob;
}

但是现在我这样做了,我从DocxJS得到了解析错误,如:{isError: true, msg: "Parse Error."}

0 个答案:

没有答案