如何在Chrome打包应用中将HTML加载到iframe中

时间:2015-07-07 12:26:48

标签: javascript html google-chrome iframe google-chrome-app

我正在尝试制作一个Chrome打包的应用程序,以允许文件将自己保存回磁盘。我打算使用chrome.fileSystem.chooseEntry()打开文件。然后我必须将其加载到设置了沙箱属性的iframe中。它将使用文档事件侦听器(document.createEvent)等待客户端文件发送其更新的文件内容,然后将其保存回文件系统。

所以我需要做两件事,第一件我能够在Chrome打包的应用程序中找到很少的信息,你不能使用document.write。我无法使用body.innerHTML,因为它是带有head元素的完整HTML文档。

  1. 我想将文件加载到iframe中运行它。该文件可能是几MB。数据网址可以处理这么大的东西吗?我在src中输入了吗?或者我把它放在其他地方并将src设置为javascript:void(0);
  2. 我想将一个元素注入iframe DOM并监听该元素上的事件。这实际上看起来我可以从我们已有的Firefox实现中复制它。
  3. 以下是我必须打开它的代码,从chrome.fileSystem页面复制。

    chrome.fileSystem.chooseEntry(
        {
            type: 'openFile', 
            accepts:[{
                extensions: ['html']
            }] 
        }, 
        function(fileEntry) {
            if (!fileEntry) {
                return;
            }
            console.log(fileEntry);
            fileEntry.file(function(file) {
                console.log(file);
                var reader = new FileReader();
                reader.onload = function(e) {
                    console.log(e); 
                    //set iframe contentDocument
                };
                reader.readAsText(file);
            });
        }
    );
    

    这是iframe。

    <iframe id="test" sandbox="allow-scripts allow-popups allow-forms allow-same-origin" seamless="seamless"></iframe>
    

1 个答案:

答案 0 :(得分:0)

我最终使用webview。我非常喜欢它,因为除了上下文菜单外,它的作用就像一个完全正常的浏览器窗口。但是所有幕后的东西似乎都是正常的,除了警报,提示和确认,你必须在父窗口中实现,以及你必须使用事件来允许它访问几乎任何外部的事实,除了ajax请求。