在Chrome App Webview实施中加载本地文件

时间:2014-11-28 02:57:30

标签: google-chrome webview

我尝试了Marc Rochkind对loading a local file via a chrome app webview的建议,我无法让它发挥作用。

当我尝试使用mhtml页面时,webview不会呈现本地页面,并且页面变慢。没有错误。

然后我尝试使用一个小图片文件,删除webview元素并替换为:

<pre style="word-wrap: break-word; white-space: pre-wrap;">‰PNG

���
IHDR������0���}jž���sBIT|dˆ���  pHYs�����šœ���îIDATX…í×½JÃP€á'µ-EQ,8é&amp;^¢7¡›.Š£“Aœ\trï :xuð$„’Ô§ï…oÉÏyg„Ÿ¶q‚)f™fŠSì$Ã.&gt;2ÕùÄ\tˆ”sUàcÝöU$±ózÿP@P@P@·4­kóçö‚­4¯-ßmüà36mpœ®e…ž°^sé^è«õ§ÖðøWèËs²Ü/
]cÔ�)á¦-4Á°R6ÄeSèý²~Zc.t&amp;Ï×¢—Öª…ŽPd@Ê
W¡ƒŒ@µCÌ–0À~‡Ð-ß­eàbÖßÕq����IEND®B`‚</pre>

不知道为什么会这样做。

我的相关代码如下,您可以看到readAsDataUrl函数here的示例。

main.js,我的应用活动页面。它只是获取文件,并将数据URL传递到应用程序窗口。

chrome.storage.local.get('directory_ref', function(items) { 
  var ref = items.directory_ref;

  chrome.fileSystem.restoreEntry(ref, function(storage) {
    var fileName = 'test.html';

    storage.getFile(fileName, { create: false }, function(fileEntry) {
      fileEntry.file(function(file) {

        var fileReader = new FileReader();

        fileReader.onloadend = function() {
          var dataUrl = fileReader.result;

          chrome.app.window.create('webview_demo.html', function(window) {
            window.dataUrl = dataUrl;
          });
        };

        fileReader.readAsDataURL(file);
      });
    });
  });
});

webview_demo.html

<script src="webview.js"></script>

<webview id="webview" src=""></webview>

webview.js

var dataUrl = chrome.app.window.current().dataUrl,
    webview = document.getElementById('webview');

webview.src = dataUrl;

您在我的方法中看到的任何建议或缺陷都会有所帮助。

0 个答案:

没有答案