I need to open External website inside my application without iFrame also I need to pass some header values to that external website.
Help me..
We can use the object tag in HTML to embed external resources in the webpage. We can use the tag to display another webpage in our webpage. The object tag is an alternative to the iframe tag in HTML. We can use the tag to embed different multimedia components like image, video, audio, etc.
An iframe or inline frame is used to display external objects including other web pages within a web page. An iframe pretty much acts like a mini web browser within a web browser. Also, the content inside an iframe exists entirely independent from the surrounding elements.
One of the simplest methods to embed a YouTube video in a web page without IFrame is by embedding the video using the HTML <object> tag. Simply provide the URL of the video to the <object> element's data property and set few other properties like, the width, height, and you are ready to go.
The easiest way to embed HTML5 project into your web page is using an iframe (inline frame). Iframe is just a very simple HTML code that used to display content from another source into a web page. If you know copy and paste, you can do it. The src attribute specifies the URL (web address) of the inline frame page.
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); } });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With