Open Graph

The Open Graph protocol

웹 페이지의 메타 데이터를 사용해 페이지 콘텐츠 표시를 표준화하기 위한 페이스북에서 만든 인터넷 프로토콜

https://ogp.me/

  <!-- 웹사이트로 설정 -->
  <meta property="og:type" content="website" />
  <!-- 전체 사이트 이름 -->
  <meta property="og:site_name" content="Vue3 Movie App" /> 
  <!-- 개별 사이트 이름 -->
  <meta property="og:title" content="Vue3 Movie App" />
  <!-- 사이트 설명 -->
  <meta property="og:description" content="The OMDb API is a RESTful web service to obtain movie information, all content and images on the site are contributed and maintained by our users." />
  <!-- 이미지  -->
  <meta property="og:image" content="https://heropy.blog/css/images/logo.png" />
  <!-- 사이트 url 제공하고 싶은 url을 제공 -->
  <meta property="og:url" content="https://trusting-haibt-4f2ef4.netlify.app" />

index.html 파일에 head태그 안에 넣어주면 된다.,

그럼 이러한 결과를 얻을 수 있다.

그렇지만 다른 페이지를 붙여 넣어도 똑같은 결과를 출력한다.