iframe에서 google.com을 표시하는 방법은 무엇입니까?

121

google.com을 내 웹 사이트의 iframe에 넣으려고합니다. 이것은 yahoo를 포함한 다른 많은 웹 사이트에서 작동합니다. 그러나 빈 iframe 만 표시하므로 Google에서는 작동하지 않습니다. 렌더링되지 않는 이유는 무엇입니까? 그렇게 할 수있는 트릭이 있습니까?

나는 다음과 같은 iframe에 웹 사이트를 표시하기 위해 일반적인 방법으로 시도했습니다.

<iframe name="I1" id="if1" width="100%" 
 height="254" style="visibility:visible" 
 src="http://www.google.com"></iframe>

google.com 페이지는 iframe에서 렌더링되지 않고 비어 있습니다. 무슨 일이야?

html

— 발라
소스

iframe에 Google을 표시해야하는 이유는 무엇입니까?

— Paul Alan Taylor

저를 인용하지 마십시오.하지만 Google은 window.propertyIFrame 내부에서 디스플레이의 일부를 깨뜨리는 것과 같은 것을 사용 합니까?

— 익명으로

Google 검색 창을 원하시면 다음 링크를 참조하십시오. google.com/webelements/#!/custom-search

— mgraph

@PaulAlanTaylor 그것은 제 고객의 요구 사항이었습니다. 그는 iframe에서 편리한 웹 사이트에 Google 결과를 표시하고 싶다고 말했습니다.

— Bala

11

다음과 같이하십시오 :<iframe src="https://www.google.com/webhp?igu=1"></iframe>

— niutech

117

그 이유는 Google이 "X-Frame-Options : SAMEORIGIN"응답 헤더를 전송하기 때문입니다. 이 옵션은 브라우저가 상위 페이지와 동일한 도메인에서 호스팅되지 않는 iFrame을 표시하지 않도록합니다.

참조 : Mozilla 개발자 네트워크-X-Frame-Options 응답 헤더

— 안드레아스 코흐
소스

18

이것은 꽤 쓸모가 없다고 생각합니다. 누군가가 그 기능을 사용하는 이유를 생각할 수 있다면 그저 의미하는 것 외에 저에게 알려주십시오.

— 익명으로

15

@JonHanna one은 단순히 Google에 문의하지 않습니다.

— albert

23

이 URL을 다음에서 사용할 수 있습니다 iframe. google.com/search?igu=1

— niutech

1

또는 내 X-Frame-Bypass 웹 구성 요소를 사용할 수 있습니다 .

— niutech

4

@niutech 놀랍게도? igu = 1 매개 변수가있는 URL이 작동합니다. 왜 그런지 아세요? 그 옵션의 원래 목적은 무엇입니까? 흥미롭게도 이로 인해 로그인하지 않은 것으로 표시 되지만 검색 필드는 여전히 내 실제 과거 검색 중 일부를 제안합니다. 그래서 저는 "일종"로그인했습니다. 매우 이상합니다.

— Mark Thomson

28

불가능하지 않습니다.
역방향 프록시 서버를 사용하여 Different-Origin-Problem을 처리합니다. proxy_pass페이지의 URL을 변경하기 위해 Nginx를 사용했습니다 . 시도해 볼 수 있습니다.

또 다른 방법은 서버에서 직접 실행되는 간단한 프록시 페이지를 작성하는 것입니다. Google에서 요청하고 결과를 클라이언트에 출력하기 만하면됩니다.

— ijse
소스

8

Google은 표준 검색 URL을 컬링하려는 간단한 시도를 차단했습니다. :( 다른 X-Frame-Options를 보내는 "Google Custom"을 사용하게되었습니다. google.com/custom?q=test&btnG=Search

— Joel Mellon

7

Nginx로이 문제를 해결하는 방법에 대한 자습서가 있습니까?

— Black

21

여기에 설명 된대로 Google이 "X-Frame-Options : SAMEORIGIN"응답 헤더를 전송하기 때문에 iframe에서 src를 " http://www.google.com "으로 설정할 수 없습니다 .

Google을 iframe에 삽입하려면 위의 댓글에서 sudopeople이 제안한 것을 수행하고 다음과 같은 Google 맞춤 검색 링크를 사용할 수 있습니다. 이것은 나를 위해 잘 작동했습니다 (빈 검색으로 시작하려면 'q ='를 비워 두었습니다).

<iframe id="if1" width="100%" height="254" style="visibility:visible" src="http://www.google.com/custom?q=&btnG=Search"></iframe>

편집하다:

이 답변은 더 이상 작동하지 않습니다. iframe 검색을 Google 맞춤 검색 요소로 대체하는 방법에 대한 정보 및 지침은 https://support.google.com/customsearch/answer/2641279를 확인하세요.

— ScottyG
소스

Thx ScottyG! 이미지 결과를 추가하는 옵션이 있습니까?

— Krzysztof Przygoda 2014

Hey Krzysztof Przygoda 저는 src와 같은 이미지 검색을 강제 할 수 있다고 생각합니다 : http://www.google.com/search?site=imghp&tbm=isch&q='searchstring'하지만 검색을 사용하기 때문에? 관습이 아니라? iframe에서는 사용할 수 없습니다

— ScottyG 2014-12-09

1

@ScottyG 위의 기술이 여전히 유효합니까? 나는 그 줄을 빈 페이지에 놓아 보았고 내가 얻는 것은 내가 쿼리를 제공하더라도 빈 iframe이다

— Andres

2

안녕하세요 Andres, 당신이 옳을 것 같습니다. 더 이상이 작업을 수행 할 수 없습니다. 이제 맞춤 검색 링크가 google.ca/webhp?btnG=&gws_rd=ssl로 리디렉션되어 ssl을 강제 실행하고 iframe에서 차단 된 것으로 보입니다. :( ... 나는이 조사를 계속하지만 당이 하나 이상있을 것 같습니다

— ScottyG

8

using YQL에서 X-Frame-Options를 우회 할 수 있습니다.

var iframe = document.getElementsByTagName('iframe')[0];
var url = iframe.src;
var getData = function (data) {
    if (data && data.query && data.query.results && data.query.results.resources && data.query.results.resources.content && data.query.results.resources.status == 200) loadHTML(data.query.results.resources.content);
    else if (data && data.error && data.error.description) loadHTML(data.error.description);
    else loadHTML('Error: Cannot load ' + url);
};
var loadURL = function (src) {
    url = src;
    var script = document.createElement('script');
    script.src = 'https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20data.headers%20where%20url%3D%22' + encodeURIComponent(url) + '%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=getData';
    document.body.appendChild(script);
};
var loadHTML = function (html) {
    iframe.src = 'about:blank';
    iframe.contentWindow.document.open();
    iframe.contentWindow.document.write(html.replace(/<head>/i, '<head><base href="' + url + '"><scr' + 'ipt>document.addEventListener("click", function(e) { if(e.target && e.target.nodeName == "A") { e.preventDefault(); parent.loadURL(e.target.href); } });</scr' + 'ipt>'));
    iframe.contentWindow.document.close();
}

loadURL(iframe.src);

<iframe src="http://www.google.co.in" width="500" height="300"></iframe>

여기에서 실행하세요 : http://jsfiddle.net/2gou4yen/

코드 : X-Frame-Options : SAMEORIGIN HTTP 헤더를 어떻게 우회 할 수 있습니까?

— Netham
소스

3

작동하지만 처음은 아닙니다. 삽입 한 웹 페이지를 열면 처음으로 페이지를로드하려면 새로 고침을 눌러야합니다. 그 후에는 좋을 것입니다.

— Vivek Sinha

당신이 교체 할 때 @ TV-C-15 그것은 작동 http://query.yahooapis.com으로 https://query.yahooapis.com.

— niutech

[codepen에도 테스트 codepen.io/anon/pen/Xyqqvb] 파이어 폭스, 크롬, 오페라와 (언젠가는 새로 고칠 필요하지만) 작동, 가장자리에 일을하지 않습니다 하지만 내가 로컬 복사 나 브라우저에 열 경우는 계속 페이지를 다시로드하십시오. 여기에서 전체 스크립트 : [ files.fm/u/arzrb2h4]

— Joe

1

작동하지 않는. iframe에서 Google을 여는 다른 방법이 있습니까?

— Krishna

3

iframe에 쉽게 삽입 할 수있는 Google CSE (Custom Searche Engine)를 사용하여 해결할 수 있습니다. 선택한 사이트 또는 전체 Google 데이터베이스를 검색하는 자체 검색 엔진을 만들 수 있습니다.

결과는 Google 스타일과 유사하게 원하는대로 스타일을 지정할 수 있습니다. Google CSE는 웹 및 이미지 검색과 함께 작동합니다.

google.php

<script>
  (function() {
    var cx = 'xxxxxxxxxxxxxxxxxxxxxx';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:searchresults-only></gcse:searchresults-only>

yourpage.php

<iframe src="google.php?q=<?php echo urlencode('your query'); ?>"></iframe>

— WalterV
소스

2

이것은 내 옵션으로 사용자 정의 Google 검색을 만드는 데 사용했기 때문에 작동했습니다. Google은 결국 변경하여 내 개인 맞춤 검색 페이지를 깨뜨 렸습니다. (더 이상 아래의 샘플이 작동하지 않습니다. 복잡한 검색 패턴에 매우 유용했습니다.

<form method="get" action="http://www.google.com/search" target="main"><input name="q" value="" type="hidden"> <input name="q" size="40" maxlength="2000" value="" type="text">

편물

더 나은 옵션은 Curl 또는 이와 유사한 것을 사용하는 것입니다.

— 짐
소스

1

이상적이지는 않지만 프록시 서버를 사용할 수 있으며 잘 작동합니다. 예를 들어 hidemyass.com으로 이동하여 www.google.com에 넣고 iframe에 연결하면 작동합니다!

— 몬티
소스

0

PHP를 사용 file_get_contents()하는 경우 내용을 인쇄하는 데 사용할 수 있습니다 .

<?php
$page = file_get_contents('https://www.google.com');
echo $page;
?>

이 file_get_contents()URL에서 콘텐츠 함수가 가져 오는 모든 내용을 인쇄 합니다. 콘텐츠를 실제 웹 페이지 대신 문자열로 표시하고 있기 때문에 /img/myimg.jpg가 이제 더 이상 google.com이 아닌 서버에서로드되기 때문에 상대 경로 이미지와 같은 항목이 올바르게 표시되지 않습니다.

그러나 str_replace()이미지에서 절대 URL을 대체하는 기능 과 같은 몇 가지 트릭을 사용할 수 있습니다 .

<?php
$page = file_get_contents('https://www.google.com');
echo str_replace('src="img/','src="https://google.com/img/',$page);
?>

— 지진
소스