[php] URL 링크를 입력하고 사이트 썸네일 가져오기 ( og image )
https://hajoung56.tistory.com/38
[HTML&JSP] SNS에서 URL 공유시 미리보기meta 태그
링크를 SNS를 통하여 URL을 공유할 때 링크 상단에 썸네일, 타이틀, 설명 등 다양한 정보가 노출됩니다. 어떠한 정보들이 노출되며, 어떻게 설정을 할 수 있는지 확인해보고자 합니다. 아래와
hajoung56.tistory.com
https://stackoverflow.com/questions/44595876/cant-get-ogimage-php
can't get og:image php
I'm using this script to get the og:image tag from a website: function getFrontImage($url){ $page_content = file_get_contents($url); $dom_obj = new DOMDocument(); $dom_obj->loadHTML($
stackoverflow.com
이 포스트들을 참조했습니다.
보통 웹사이트 head의 meta 태그 안에 og라고 오픈그래프가 있다.
사이트의 각 종 정보를 저장해두는 태그인데 어떠한 HTML 문서의 메타 정보를 쉽게 표시하기 위해서 메타정보에 해당하는 제목, 설명, 타입, 대표 URL 등 다양한 요소들에 대하여 사람들이 통일하여 사용할 수 있도록 정의한 프로토콜이라고 한다.
메타 태그에서 og 정보를 긁어오는 php 코드는 스택오버플로우에서 가져와 조금 수정했다. 이미지를 대체하는 대체 텍스트로는 사이트 이름을 가져오기 위해 og:title를 추가하고 이 함수를 부를 때 string 변수로 타입을 지정해서 원하는 메타 데이터만 가져오도록 했다.
function getMetaOG($url, $get_type){
libxml_use_internal_errors(true);
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL,$url);
curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (Windows NT 6.1; WOW64; rv:25.0) Gecko/20100101 Firefox/25.0');
curl_setopt($ch, CURLOPT_ENCODING , "gzip");
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_HEADER, 0);
$page_content = curl_exec($ch);
$dom_obj = new DOMDocument();
$dom_obj->loadHTML($page_content);
$meta_val = null;
foreach($dom_obj->getElementsByTagName('meta') as $meta) {
if(($meta->getAttribute('property')=='og:image') && $get_type == 'image'){
$meta_val = $meta->getAttribute('content');
}
else if(($meta->getAttribute('property')=='og:title') && $get_type == 'title'){
$meta_val = $meta->getAttribute('content');
}
}
return $meta_val;
}
필자는 HTML의 script 태그를 사용하여 php 코드를 감쌌다.
<script>
<?
// php code...
?>
</script>
그리고 DB에 저장된 값이든 스크립트 내에서 주소를 저장한 값을 찾는다.
<?
if ($view != '')
{
$getview = null;
if(strpos($view, 'https') == false)
{
// 작성자가 만약 관련링크에 https를 넣지 않았다면 앞에 붙임
$getview = 'https://'.$view;
}
else
{
$getview = $view;
}
}
?>테스트를 해보니 https 가 아닌 http 로는 작동하지 않아서 https를 붙였다.
* 입력된 주소에 http가 있다면 https로 변경하는 방식을 나중에 추가하겠다.
여기서 $view는 사용자가 입력한 URL 주소다.
이제 사이트의 og:image와 대체 텍스르로 쓸 og:title 을 받아오자
<? $getview = getMetaOG($getview, 'image');?>
<img src="<?=$getview?>" alt="<?=$getview = getMetaOG($getview, 'title');?>">이렇게 하면 사이트의 이미지를 받아올 수 있다.
메타데이터가 어떻게 생겼는지 확인하려면 확인하려는 사이트에서 f12를 눌러 사이트의 html 코드를 보면된다.
<head> 구문 안에 메타 데이터가 있으며
다음의 경우에는 image 값이 사진의 확장자를 가지지 않지만 실제로 사용하면 잘 표현된다.
네이버의 image 값은 사진 확장자를 가지고 있다.
