简体   繁体   中英

How to load HTML into iframe in a Chrome packaged app

I am trying to make a chrome packaged app to allow a file to save itself back to disk. I am planning to open the file using chrome.fileSystem.chooseEntry() . Then I have to load it into an iframe with the sandbox attribute set. It will use document event listenders ( document.createEvent ) to wait for the client file to send its updated file content, and then save it back to the file system.

So there are two things I need to do, and the first one I have been able to find very little information on inside a Chrome packaged app, where you can't use document.write. I can't use body.innerHTML because it is a full HTML document with a head element.

  1. I want to load the file into the iframe to run it. The file may be several MBs. Can a data url handle something this big? Do I put in in the src? Or do I put that somewhere else and set the src to javascript:void(0); ?
  2. I want to inject an element into the iframe DOM and listen for events on that element. This actually looks like I might be able to copy it over from the implementation for Firefox that we already have.

Here's the code I have to open it, copied from the chrome.fileSystem page.

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);
        });
    }
);

This is the iframe.

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

I ended up using a webview . And I really like it, because it acts like a totally normal browser window, except for the context menu. But all the behind the scenes stuff seems normal, except for alert, prompt, and confirm, which you have to implement yourself in the parent window, and the fact that you have to use events to allow it to access almost anything external, except maybe ajax requests.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM