2011-12-08 188 views
47

有什麼辦法可以在不使用iframe的情況下嵌入外部網頁嗎?我可以訪問這兩個網站,我只是希望嵌入內容的頁面根據嵌入的內容(它會隨時間而改變,並且位於多個網站上)調整大小。在沒有Iframe的情況下嵌入外部頁面?

謝謝!

編輯:我不認爲任何一種AJAX都可以工作,因爲它是跨站點的,並且JavaScript不會讓你加載離線內容(據我所知)。

回答

38

你可以使用jQuery加載外部頁面:

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

+1 - 我認爲您仍然需要允許從www.orginaldomain.com到www.somesite.com的跨域ajax呼叫。 – DefyGravity

+1

我不認爲你可以使用JavaScript包括,因爲它是有限的安全原因。 DefyGravity,我會怎麼做呢? – JacobTheDev

+11

此代碼取決於外部頁面啓用「allow-control-allow-origin:*」,您不能保證。 – FlavioEscobar

2

問題是好的,但答案是:這取決於。

如果其他網頁不包含任何表單或文本,例如您可以使用CURL方法獲取確切的內容,然後在您的網頁上顯示。你可以做到這一點,而不使用iframe。

但是,如果您要嵌入的頁面包含例如表單,它將無法正常工作,因爲表單處理在該網站上。

28

或者你可以使用object標籤:

http://jsfiddle.net/7MaXx/

<!--[if IE]> 
<object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="http://www.google.be"> 
<p>backup content</p> 
</object> 
<![endif]--> 

<!--[if !IE]> <--> 
<object type="text/html" data="http://www.flickr.com" style="width:100%; height:100%"> 
<p>backup content</p> 
</object> 
<!--> <![endif]--> 
+1

對象標籤有高度問題。即使給高度:100%;仍然不起作用。僅以固定的高度值工作。否則需要獲取外部網頁的高度和寬度。那我還找不到。如果您可以請求幫助 –

+0

您可以將高度設置爲2500像素或其他東西...我有同樣的問題。 –

+0

對於我的情況,我不得不在Object中顯示一個動態創建的HTML內容。我正在使用jQuery替換對象標記運行時的數據屬性,如下所示。 element.attr('data',「data:text/html; charset = utf-8,」+ escape(HTMLCtent)) 它的工作方式就像魅力一樣。 –

1

什麼這樣的事情?

<?php 
$URL = "http://example.com"; 
$base = '<base href="'.$URL.'">'; 
$host = preg_replace('/^[^\/]+\/\//', '', $URL); 
$tarray = explode('/', $host); 
$host = array_shift($tarray); 
$URI = '/' . implode('/', $tarray); 
$content = ''; 
$fp = @fsockopen($host, 80, $errno, $errstr, 30); 
if(!$fp) { echo "Unable to open socked: $errstr ($errno)\n"; exit; } 
fwrite($fp,"GET $URI HTTP/1.0\r\n"); 
fwrite($fp,"Host: $host\r\n"); 
if(isset($_SERVER["HTTP_USER_AGENT"])) { fwrite($fp,'User-Agent: '.$_SERVER 

["HTTP_USER_AGENT"]."\r\n"); } 
fwrite($fp,"Connection: Close\r\n"); 
fwrite($fp,"\r\n"); 
while (!feof($fp)) { $content .= fgets($fp, 128); } 
fclose($fp); 
if(strpos($content,"\r\n") > 0) { $eolchar = "\r\n"; } 
else { $eolchar = "\n"; } 
$eolpos = strpos($content,"$eolchar$eolchar"); 
$content = substr($content,($eolpos + strlen("$eolchar$eolchar"))); 
if(preg_match('/<head\s*>/i',$content)) { echo(preg_replace('/<head\s*>/i','<head>'. 

$base,$content,1)); } 
else { echo(preg_replace('/<([a-z])([^>]+)>/i',"<\\1\\2>".$base,$content,1)); } 
?> 
+0

OP要求提供JS解決方案。此外,在標籤中,沒有關於使用PHP的OP的內容,只有ASP.net –

+0

即使這不是確切的解決方案,對於其他人來說這是一個非常有用的PHP腳本,+1 – electroid

+0

對JS需求而言不是一個有效的答案。我不使用PHP。它將如何幫助我?你可以放一個僞代碼。這將是有幫助的 – Tarun

1

爲什麼不使用PHP!這是所有服務器端:

<?php print file_get_contents("http://foo.com")?> 

如果你擁有這兩個網站,你可能需要確定與在服務器端頭的完整聲明本次交易。精美的作品。

+0

PHP會做jpb的罰款,產生額外的負載到您的服務器。客戶端解決方案(JS)將使您的服務器保持完美和新鮮 – augusto

相關問題