Open a new tab/window and write something to it?
Solution 1:
Top-level navigation to data URLs has been blocked in Chrome, Firefox (with some exceptions), IE, and Edge (and likely other browsers to boot). They are apparently commonly used for phishing attacks, and major browser vendors decided that the danger outweighed the value provided by legitimate use cases.
This Mozilla security blog post explains that Firefox will block
- Web page navigating to a new top-level data URL document using:
window.open("data:…");
window.location = "data:…"
- clicking
<a href="data:…">
(including ctrl+click, ‘open-link-in-*’, etc).- Web page redirecting to a new top-level data URL document using:
- 302 redirects to
"data:…"
- meta refresh to
"data:…"
- External applications (e.g., ThunderBird) opening a data URL in the browser
but will not block
- User explicitly entering/pasting
"data:…"
into the address bar- Opening all plain text data files
- Opening
"data:image/*"
in top-level window, unless it’s"data:image/svg+xml"
- Opening
"data:application/pdf"
and"data:application/json"
- Downloading a data: URL, e.g. ‘save-link-as’ of
"data:…"
You can also read the proposal to deprecate and remove top-frame navigation to data URLs in Chrome and view the current Chrome status indicating that is has been removed.
As for how to actually open HTML in a new tab or window, this should be sufficient:
var tab = window.open('about:blank', '_blank');
tab.document.write(html); // where 'html' is a variable containing your HTML
tab.document.close(); // to finish loading the page
Note that at least in Chrome, external scripts injected via document.write might not be loaded on slower connections. That might not be relevant here, but something to watch out for.
Solution 2:
Edit: As of 2018, this solution no longer works. So you are back to opening about:blank
in a new window and adding content to it.
Don't "write" to the window, just open it with the contents you need:
var data = "<p>This is 'myWindow'</p>";
myWindow = window.open("data:text/html," + encodeURIComponent(data),
"_blank", "width=200,height=100");
myWindow.focus();
For reference: data URIs
Solution 3:
var winPrint = window.open('', '', 'left=0,top=0,width=800,height=600,toolbar=0,scrollbars=0,status=0');
winPrint.document.write('<title>Print Report</title><br /><br />
Hellow World');
winPrint.document.close();
window.open(uri) does not work in chrome as of 2018