2015-05-07 3 views
-2

У меня есть веб-страница, которая показывает iframe, instaframe.html. Я пытаюсь создать веб-страницу, где я могу установить iframe src с полем ввода. Я понятия не имею, что так когда-нибудь, как это сделать, или если ее вообще возможно ..Изменить iframe src с другой веб-страницы

Instaframe.html:

<html> 
    <head> 
     <title>InstaFrame</title> 
    </head> 
    <body> 
     <iframe src="http://snapwidget.com/in/?h=bWU5fGlufDEyNXwzfDN8fG5vfDV8bm9uZXxvblN0YXJ0fG5vfG5v&ve=070515" 
      title="Instagram Widget" 
      class="snapwidget-widget" 
      allowTransparency="true" 
      frameborder="0" 
      scrolling="no" 
      style="border:none; overflow:hidden; width:390px; height:390px" 
    </body> 
</html> 

Instaframe.html на моей Raspberry Pi подключен к монитору в фоторамке на моей стене. Моя цель состоит в том, чтобы иметь возможность просматривать веб-страницу на малине, а оттуда менять iframe src, которые отображаются на мониторе. У меня установлен веб-сервер php и работает на малине pi.

+0

Зависит от того, что вы вообще не можете этого сделать, поскольку политика одного и того же происхождения предотвращает доступ к iFrames с перекрестным происхождением. – adeneo

+0

@adeneo политика происхождения креста ** не ** влияет на атрибут 'src'. Это влияет только на доступ к окну/DOM кадра и все, что связано с запросами (AJAX, сокеты и т. Д.). 'X-Frame-Options', возможно, препятствует встраиванию, но это не относится к snapwidget.com – Halcyon

ответ

0

Быстрый и грязный:

<input type="text" id="iframe_src" value="http://snapwidget.com/" /> 
<input type="button" id="iframe_src_button" value="Go!" /> 
<iframe id="iframe"></iframe> 
<script type="text/javascript"> 
    document.getElementById("iframe_src_button").onclick = function() { 
     document.getElementById("iframe").src = document.getElementById("iframe_src").value 
    }; 
</script> 

демо: http://jsfiddle.net/4b60o7h1/

Это работает, потому что snapwidget.com не возвращает X-Frame-Options заголовок, который может блокировать вложение. Например, Google и StackOverflow возвращают этот заголовок, поэтому вы не можете их внедрять.

Смежные вопросы