Instagram 플랫폼

Instagram 게시물 퍼가기

Instagram oEmbed 엔드포인트를 쿼리하여 Instagram 게시물의 퍼가기 HTML과 기본 메타데이터를 가져오고 다른 웹사이트나 앱에 게시물을 표시할 수 있습니다. 사진, 동영상, 릴스 및 피드 게시물을 지원합니다.

공개 Instagram 게시물 또는 프로필에서 퍼가기 코드를 가져오는 방법은 Instagram 고객 센터를 참조하세요.

일반적인 사용 방법

  • 블로그에 게시물 퍼가기
  • 웹사이트에 게시물 퍼가기
  • 콘텐츠 관리 시스템에서 게시물 렌더링
  • 메시지 앱에서 게시물 렌더링

요구 사항

이 가이드는 회원님이 Meta 개발자로 등록되어 있고 Meta 앱을 만든 상태인 것으로 가정합니다.

다음 항목이 필요합니다.

액세스 레벨

액세스 토큰

기본 URL

모든 엔드포인트에는 graph.facebook.com 호스트를 통해 액세스할 수 있습니다.

엔드포인트

기능

제한 사항

  • Instagram oEmbed 엔드포인트는 웹사이트와 앱에 Instagram 콘텐츠를 퍼가는 용도로만 사용해야 합니다. 그 외의 다른 용도로 사용해서는 안 됩니다. 페이지, 게시물 또는 동영상의 프런트 엔드 뷰를 제공하는 것 외에 다른 목적으로 엔드포인트의 메타데이터와 페이지, 게시물 또는 동영상 콘텐츠(또는 그 파생물)를 사용하는 것은 엄격히 금지됩니다. 이러한 금지 사항은 페이지, 게시물 및 동영상에 대한 정보를 분석 목적으로 메타데이터에서 얻어내는 것을 포함하여(이에 국한되지 않음) 메타데이터와 콘텐츠의 사용, 조작, 추출 또는 지속까지 적용됩니다.
  • 비공개, 비활성 상태 및 나이 제한이 있는 Instagram 계정의 게시물은 지원되지 않습니다.
  • 퍼가기 설정을 비활성화한 계정은 지원되지 않습니다.
  • 스토리는 지원되지 않습니다.
  • Shadow DOM은 지원되지 않습니다.

사용 제한

사용 제한은 앱이 각 요청에 포함하는 액세스 토큰의 유형에 따라 달라집니다.

앱 토큰 사용 제한

앱 액세스 토큰을 사용하는 앱은 24시간당 최대 500만 건의 요청을 보낼 수 있습니다.

클라이언트 토큰 사용 제한

클라이언트 토큰 사용 제한은 앱 토큰 사용 제한보다 현저히 낮습니다. 앱 활동에 따라 달라지기 때문에 실제 제한이 얼마인지는 공개하지 않습니다. 그러나 수천 건의 요청을 한 번에 보내거나 에이전트 또는 앱 사용자별로 수천 건의 요청을 전송하는 등, 봇과 유사한 행동을 하지 않는다면 앱이 사용 제한에 도달하지 않으므로 안심하셔도 됩니다.

퍼가기 HTML 가져오기

퍼가기 HTML은 프로그래밍 방식으로 가져오거나 Instagram 앱에서 가져올 수 있습니다.

Intagram 게시물의 퍼가기 HTML을 프로그래밍 방식으로 가져오려면 다음과 같은 요청을 보내세요.

GET /instagram_oembed?url=<URL_OF_THE_POST>&access_token=<ACCESS_TOKEN>

<URL_OF_THE_POST>를 쿼리하고자 하는 Instagram 게시물의 URL로 바꾸고 <ACCESS_TOKEN>은 앱 또는 클라이언트 액세스 토큰으로 바꾸거나 Authorization HTTP 헤더에 넣어서 Meta에 전달합니다.

Authorization: Bearer <ACCESS_TOKEN>

클라이언트 액세스 토큰을 사용하고 있다면 파이프 기호를 사용하여 Meta 앱 ID와 결합하지 않을 경우 요청이 실패한다는 점을 기억하세요.

요청이 성공하면 API가 게시물의 퍼가기 HTML과 추가 데이터를 포함한 JSON 개체로 응답합니다. 퍼가기 HTML은 html 속성에 할당됩니다.

요청을 보강하기 위해 포함할 수 있는 쿼리 문자열 매개변수의 리스트는 Instagram oEmbed 참고 자료를 참조하세요. 또한 fields 쿼리 문자열 매개변수를 포함하여 반환하고자 하는 필드를 지정할 수 있습니다. 이를 생략할 경우 모든 기본 필드가 응답에 포함됩니다.

요청 샘플

curl -X GET \
  "https://graph.facebook.com/v21.0/instagram_oembed?url=https://www.instagram.com/p/fA9uwTtkSN/&access_token=IGQVJ..."


curl -i -X GET \
     --header "Authorization: Bearer 96481..." \
     "https://graph.facebook.com/v21.0/instagram_oembed?url=https%3A%2F%2Fwww.instagram.com%2Fp%2FfA9uwTtkSN"

응답 샘플

일부 값은 가독성을 위해 생략 부호(...)를 붙여 자릅니다.

{
  "version": "1.0",
  "author_name": "diegoquinteiro",
  "provider_name": "Instagram",
  "provider_url": "https://www.instagram.com/",
  "type": "rich",
  "width": 658,
  "html": "<blockquote class=\"instagram-media\" data-instgrm-ca...",
  "thumbnail_width": 640,
  "thumbnail_height": 640
}

URL 형식

url 쿼리 문자열 매개변수는 다음과 같은 URL 형식을 사용합니다.

https://www.instagram.com/p/{media-shortcode}/
https://www.instagram.com/tv/{media-shortcode}/https://www.instagram.com/{username}/guide/{slug}/{guide_id}

퍼가기 JS

퍼가기 HTML에는 Instagram embed.js JavaScript 라이브러리에 대한 참조가 포함됩니다. 라이브러리를 읽어들이면 페이지에 게시물 HTML이 있는지 스캔하고 완전히 렌더링된 게시물을 생성합니다. 라이브러리를 별도로 읽어들이려면 요청에 omitscript=true 쿼리 문자열 매개변수를 포함하세요. 퍼가기 HTML을 수동으로 초기화하려면 라이브러리를 읽어들인 후에 instgrm.Embeds.process() 함수를 호출하세요.

게시물 크기

퍼간 게시물은 반응형이며 컨테이너의 크기에 맞게 조정됩니다. 즉 컨테이너 너비와 캡션의 길이에 따라 높이가 달라집니다. 요청에 maxwidth 쿼리 문자열 매개변수를 포함하면 최대 너비를 설정할 수 있습니다.

썸네일 가져오기

가능하면 게시물의 퍼가기 HTML을 모두 렌더링하는 것이 좋습니다. 모두 렌더링할 수 없다면 대신 게시물의 썸네일 이미지 URL을 가져와서 렌더링할 수 있습니다. 그러나 이 방법을 사용하면 이미지 옆에 명확한 출처를 제공해야 합니다. 예를 들어 원래 저자와 Instagram에 대한 출처 표기와 쿼리하는 Instagram 게시물의 링크를 포함해야 합니다.

게시물의 썸네일 URL과 출처 정보를 가져오려면 다음과 같은 요청을 보내세요.

GET /instagram_oembed
  ?url=<URL_OF_THE_POST>
  &maxwidth=<MAX_WIDTH>
  &fields=thumbnail_url,author_name,provider_name,provider_url
  &access_token=<ACCESS_TOKEN>

<URL_OF_THE_POST>를 쿼리하고자 하는 Instagram 게시물의 URL로 바꾸고 <MAX_WIDTH>는 렌더링하려는 썸네일의 최대 크기로 바꾸며 <ACCESS_TOKEN>은 앱 또는 클라이언트 액세스 토큰으로 바꿉니다.

요청 샘플

curl -i -X GET \
  "https://graph.facebook.com/v21.0/instagram_oembed?url=https%3A%2F%2Fwww.instagram.com%2Fp%2FfA9uwTtkSN&maxwidth=320&fields=thumbnail_url%2Cauthor_name%2Cprovider_name%2Cprovider_url&access_token=96481..."

응답 샘플

일부 값은 가독성을 위해 생략 부호(...)를 붙여 자릅니다.

{
  "thumbnail_url": "https://scontent.cdninstagram.com/v/t51.288...",
  "author_name": "diegoquinteiro",
  "provider_name": "Instagram",
  "provider_url": "https://www.instagram.com/"
}

앱 검수 제출

검수를 위해 앱을 제출할 때 Oembed 읽기를 요청하는 이유 > Oembed 읽기를 테스트할 수 있는 URL을 제공하세요 양식 필드에서 공식 Facebook 페이지 또는 Instagram 페이지의 전체 공개 게시물에 대해 퍼가기 HTML을 가져오기 위한 Instagram oEmbed 엔드포인트를 사용합니다. 그런 다음, 반환된 퍼가기 HTML을 oEmbed 콘텐츠를 표시할 위치에 추가하고 해당 페이지의 URL을 양식 필드에 입력합니다.

oEmbed 읽기 기능에 대한 승인을 받으면 각 URL을 사용하여 페이지, 게시물 또는 동영상을 포함할 수 있습니다.