How to Embed an External Webpage Without Using Iframe

how to embed external html file into current html file but without iframe tag

Some alternative solutions to an iframe are:

AJAX - You can use the XMLHttpRequest object to retrieve data and inject it to your page, for example inside a div. Example using jQuery:

 $( "#result" ).load( "ajax/test.html" );

HTML5 Web Components - HTML Imports, part of the Web Components, allows to bundle HTML documents in other HTML documents. That includes HTML, CSS, JavaScript or anything else an .html file can contain. Example:

   <link rel="import" href="http://stackoverflow.com">

Some other ideas are:

<object> tag - It defines an embedded object within an HTML document. Can be used fot HTML file and multimedia content like audio, video, applets, ActiveX, PDF and Flash or other plugins).

   <object data="http://stackoverflow.com" width="400" height="300" type="text/html">
        Alternative Content
    </object>

<embed> tag - It defines a container for an external application for example a plug-in, in can be also "hacked" and used to display an HTML page.

<embed src="http://stackoverflow.com" width=200 height=200 />

Regarding passing HEADER the best solution would be using an AJAX approach, here an example:

$.ajax({
    url: "http://stackoverflow.com",
    data: { uname: "test" },
    type: "GET",
    beforeSend: function(xhr){xhr.setRequestHeader('X-TOKEN', 'xxxxx');},
    success: function() { alert('Success!' + authHeader); }
});

or in this way,

$.ajax({
    url: "http://stackoverflow.com",
    data: { uname: "test" },
    type: "GET",
    headers:{ "X-TOKEN": 'xxxxx'},
    success: function() { alert('Success!' + authHeader); }
});

Embed an External Page Without an Iframe?

You could load the external page with jquery:

<script>$("#testLoad").load("http://www.somesite.com/somepage.html");</script>
<div id="testLoad"></div>
//would this help

Issues with how to Embed an External Page Without an Iframe

From my JavaScript console when I try to run that code in Firefox:

Load denied by X-Frame-Options: https://www.flickr.com/ does not permit cross-origin framing.

Flickr doesn't allow you to put its homepage in a frame (and a frame created by an object element is still a frame).

---

Related Topics