인스타그램 원박스용 앱 토큰 설정하기

:warning: 이 가이드가 처음 작성된 이후의 주요 업데이트 사항:

  1. 앱 리뷰(App Review)가 이제 필수입니다. 2021년 9월부터 Meta는 앱이 App Review를 통과하고 oEmbed Read 권한(2025년 4월 8일 이후 생성된 앱의 경우 Meta oEmbed Read로 명명됨)에 대한 승인을 받아야 합니다. 이를 수행하지 않으면 oEmbed API 호출이 실패합니다. 승인에 대한 팁은 Meta의 App Review 제출 가이드를 참조하십시오.

  2. Instagram 원박스(onebox)가 올바르게 렌더링되지 않을 수 있습니다. 2025년 11월 3일부로 Meta는 Instagram oEmbed 응답에서 thumbnail_url, thumbnail_width, thumbnail_height, author_name 필드를 제거했습니다. Discourse의 Instagram 원박스 코드는 현재 이러한 필드에 의존하고 있으며(lib/onebox/engine/instagram_onebox.rb), 이로 인해 깨지거나 빈 임베드가 생성될 수 있습니다.

  3. 게시물(post) 및 IGTV URL만 지원됩니다. Discourse는 현재 Instagram /p/(게시물) 및 /tv/(IGTV) URL만 원박스로 처리합니다. 릴스(Reels)(/reel/) URL은 지원되지 않습니다.

  4. Facebook Developer Console UI가 크게 변경되었습니다. 아래 스크린샷은 2020년 12월에 촬영되었는데, 그 이후로 UI가 크게 달라졌습니다. 일반적인 단계는 유사하지만, 정확한 화면과 옵션은 다르게 보일 수 있습니다.


이미 Discourse 사이트에 연결된 Facebook 앱이 있다면 Facebook 앱에 oEmbed 추가 섹션으로 스크롤하십시오.

Facebook Developer 계정과 Facebook 앱이 없는 경우:

https://developers.facebook.com/으로 이동하십시오. 현재 로그인되어 있지 않으면 Facebook 계정에 로그인하도록 안내됩니다. 이전에 개발자 계정으로 전환하지 않은 경우 Facebook 계정을 개발자 계정으로 '전환’하라는 요청을 받을 수 있습니다. 전화번호를 추가하거나 기타 단계를 완료하여 Facebook에서 계정을 인증해야 할 수도 있습니다. 안내에 따라 Facebook이 요구하는 사항을 수행하기만 하면 됩니다.

Facebook Developer 계정이 있으면 Facebook Developer 홈 화면에서 'My Apps’를 클릭하십시오:

…그리고 'Create App’을 클릭하십시오:

앱 유형으로 'Something Else’를 선택하고 'Continue’를 클릭하십시오:

'App Display Name’과 'App Contact Email’을 입력하십시오. 약관 및 정책을 읽은 후 'Create App’을 클릭할 수 있습니다:

로봇인 경우: 볼 것이 없습니다. 삐 부루 부루. :robot:

로봇이 아닌 경우: "I’m not a robot"을 클릭하고, 안내에 따라 'Submit’을 클릭하십시오.

축하합니다! 이제 Facebook 앱이 있습니다!

Facebook 앱에 oEmbed 추가:

제품 목록 하단으로 스크롤하여 'oEmbed’를 찾은 후 'Set Up’을 클릭하십시오:

oEmbed 제품 사용 방법에 동의하는 경우 확인란을 클릭한 후 'Confirm’을 클릭하십시오:

oEmbed 제품이 추가되었습니다. 'Settings’를 클릭하십시오:

'Display Name’과 'Contact Email’은 이미 입력되어 있을 것입니다. 'Privacy Policy’와 'Terms of Service’의 URL을 입력해야 합니다. 사용 가능한 옵션 목록에서 'Category’를 선택하십시오. 모든 것이 만족스러우면 'Save Changes’를 클릭하십시오:

화면 상단의 토글을 클릭하여 ‘In development’ 모드에서 ‘Live’ 모드로 변경하십시오:

'Switch Mode’를 클릭하십시오:

앱 리뷰에 앱 제출 (2021년부터 필수):

앱이 프로덕션 환경에서 oEmbed API에 액세스하려면 App Review에 제출하고 oEmbed Read 권한(2025년 4월 8일 이후 생성된 앱의 경우 Meta oEmbed Read)을 요청해야 합니다.

  1. 앱 대시보드에서 App ReviewPermissions and Features로 이동하십시오.
  2. oEmbed Read(또는 Meta oEmbed Read)를 찾아 Request를 클릭하십시오.
  3. 요청 버튼이 활성화되기 전에 성공적인 테스트 API 호출을 먼저 수행해야 할 수 있습니다. 첫 번째 API 호출 후 최대 24시간이 소요될 수 있습니다.
  4. 제출할 때, Instagram 임베드가 포함된 Discourse 사이트의 URL을 제공하고, 사이트가 Discourse 포럼 소프트웨어를 사용하여 oEmbed API로 Instagram 게시물을 임베드한다고 설명하십시오.

상세한 제출 가이드는 Meta의 oEmbed 문서를 참조하십시오.

앱 액세스 토큰 생성:

이 모든 작업을 완료했으므로, 이제 Facebook의 App Access Tokens에 대한 지침을 따르면서 앱 토큰을 생성할 수 있습니다. ‘App ID’ 필드의 값과 ‘App Secret’ 필드의 값이 필요합니다. App Secret를 얻으려면 'Show’를 클릭하십시오. 재인증 등을 요청받을 수 있지만, 복사할 수 있는 긴 16진수 값이 생성되어야 합니다:

Facebook 문서에 따르면, 토큰을 생성하려면 이러한 값을 Facebook에 전송해야 합니다. curl 사용에 익숙합니까? 좋습니다! 다음을 제안합니다(위 화면에서 복사한 값으로 {your-app-id}{your-app-secret}를 대체하십시오).

curl -X GET "https://graph.facebook.com/oauth/access_token?client_id={your-app-id}&client_secret={your-app-secret}&grant_type=client_credentials"

대신, 두 값을 대체한 후 URL만 브라우저에 복사해도 작동할 수 있습니다:

https://graph.facebook.com/oauth/access_token?client_id={your-app-id}&client_secret={your-app-secret}&grant_type=client_credentials

Facebook은 다음과 같은 예시와 유사한 작은 JSON 조각으로 응답합니다:

{"access_token":"1234567890654321|c3bd55c09fc5e561552ad7a8717","token_type":"bearer"}

access_token의 값을 복사하십시오(따옴표 제외, 즉 제 예시에서는 1234567890654321|c3bd55c09fc5e561552ad7a8717), 그리고 Discourse 사이트의 설정으로 이동하십시오. Onebox 설정에서 facebook_app_access_token이라는 사이트 설정을 찾습니다. 이 필드에 ‘access_token’ 값을 붙여넣으십시오:

:white_check_mark: 을 클릭하면 … 완료입니다!

https://www.instagram.com/p/CIRhYzFM7Lu/와 같은 URL을 사이트의 게시물에 붙여넣으면 다음과 같은 아름다운 원박스가 생성되어야 합니다:

https://www.instagram.com/p/CIRhYzFM7Lu/

17개의 좋아요

New oEmbed Read Feature and App Review Requirements

Today, June 8, 2021, we announced v11.0 of the Graph API and Marketing APIs. With this update, there are new requirements to be able to access oEmbed APIs . Some of your apps currently access the oEmbed APIs and might be affected by these changes.

To continue accessing the oEmbed APIs, you will have to submit your apps for review by September 6th, 2021 . If you want to request new access to the oEmbed APIs, you will also need to submit your app(s) for review.

To learn more, please review the updated requirements. If your apps haven’t been reviewed for the oEmbed API feature by September 6, 2021, your apps will lose access to this feature. To avoid disruption to your apps’ oEmbed access, please submit for App Review as soon as possible.

New rules from our Facebook overlords, I’ve just submitted both of my apps for review. I found a public post with an Instagram embed and linked directly to show how the integration works. Hopefully this is sufficient.

8개의 좋아요


womp womp, review failed.

here’s what i submitted

Your submission details

Is a Facebook reviewer able to access or login to your app to verify you’re using permissions or features according to Facebook Platform Policy?

Yes

Platform Settings

Desktop

Site URL:https://fixed.org.au/

No account needed

  1. Visit The 'what you've done to your bike today' thread - #10218 by jaseyjase - Post your ride - FOA
  2. The instagram post is embeded in the page. The site is running Discourse forum software (https://discourse.org/)

Oembed Read

Tell us how you’re using this permission or feature

Discourse (https://discourse.org/) can embed Instagram and Facebook posts in community posts, it keeps people on our website while richly embedding content

Oembed URL

The 'what you've done to your bike today' thread - #10218 by jaseyjase - Post your ride - FOA

I just resubmitted (had some extra text in Oembed URL) and it’s been approved!!! :smiley: waiting for my second app to be…

3개의 좋아요

The text looks the same as in your initial review submit. Can you elaborate on what extra information you provided compared to the failed review?

In addition: Did you pass FB login data to the forum or not?

1개의 좋아요

@znedw my question still stands, if you can help everyone with some insight on this please?

The first review failed because I had some extra text in the Oembed URL field and the form removes spaces onsubmit, so the URL didn’t work… That’s the only difference between attemps

Nope, in the Platform section (I had to add a platform in the wizard), I just wrote

No account needed

I didn’t really want to setup a discourse account just for FB review, so I just found a post on our forum that was public, and had an Instagram image embedded. I thought this would show how the integration functions well enough. I guess FB could read the discourse source and work it out themselves :man_shrugging:

Sorry I missed this. I literally did no changes to either forum, just found a forum post with an instagram pic embedded as mentioned above and then walked through the app review wizard on FB

3개의 좋아요

Hi @znedw, I followed your guide and got our app review approved 24 hours later.

Although, I had to enter the direct link to the embedded Instagram post into the oEmbed-URL field as the form did not accept the link to the topic on our domain in that field. Maybe they changed that part.

For the rest, I followed exactly your wording. And it worked.

1개의 좋아요

Quick Question: Did the process change to be “Instagram Basic Display” or I’m very very blind? Because I can’t see the oEmbed option, the closest by definition I’m supposing it’s the Instagram Basic Display.

Quoting:

Instagram Basic Display allows apps to access the Instagram Basic Display API, which provides read-only access to basic data in app users’ Instagram accounts.

Use this tab to configure the API’s authorization window so you can get permissions from users, and to submit your app for App Review when you are ready to switch it to Live Mode.

Note that Basic Display is not an authentication tool . Data returned by the API cannot be used to authenticate your app users or log them into your app. If your app uses API data to authenticate users, it will be rejected during App Review. If you need an authentication solution, use Facebook Login instead.

It, whoever, requires other URLs that are not listed here so I’m not sure, ie:

Client OAuth Setting

Deauthorize Callback URL


(Also maybe there is something that changed because it doesn’t work here I think?)

https://www.instagram.com/p/CIRhYzFM7Lu

3개의 좋아요

far as i can tell it’s still oEmbed read with advanced access

1개의 좋아요

I see. There is a difference with the tutorial, then.

Instead of being added like any other feature (called “Products” in the UI) from the Dashboard it is now requested from the “Request” section of the “App Review” menu. You select the feature and submit it to review.

Which makes the process kind of loophole-ish because they request a link with a valid oEmbed to approve it… but it doesn’t work because the feature isn’t approved… :sweat:

4개의 좋아요

It works on my account now. I’ll try to summarise with what you need. I’m not particularly techie so I’m not sure I can answer many questions, but I suppose just copy my settings as close as possible to check it all works.

You need both facebook login (I don’t know if instagram graph API is actually needed). Check facebook login works on your discourse installation

Facebook login settings:

Basic settings:

Advanced settings:

3개의 좋아요

Heya folks, wanted to let ya’ll know that as of today, @Iceman’s description remains accurate.

Some of the page layouts have been modified from the guide (:point_up:), but the primary different is oEmbed must be requested after your app has passed the App Review.

From the “App Review” menu, you may make requests:

My app hasn’t passed App Review, but @undasein was able to get it working recently, with help from this guide and advice from https://stackoverflow.com/questions/67998234/starting-using-instagram-oembed-feature.


Good luck sharing your `grams, folks! :slight_smile:

3개의 좋아요

In my request, I did nothing elaborate. I just wrote “I’d like to embed Instagram posts on my forum” and it was approved in one day.

1개의 좋아요

How can i access the advanced oembed read? i am not even able to request it because the button is disabled. I did some api on the graph, but the nothing happens even with the 24 hours

Some users have gotten around this by submitting the app for review for a different reason (such as Facebook login), and once it is approved some features are able to be requested, such as “Oembed Read”.

You may want to reach out to the platform support channels to understand what is happening with your account. :+1:

1개의 좋아요

oEmbed no longer exists, what do I put it in instead?

I can’t see the Oembed option, which one did you choose?

Has your app passed the App Review yet @danielabc?

1개의 좋아요

when I go to the option, the button is off, and I can’t click

when I go to the option, the button is off, and I can’t click

My access was revoked because it wasn’t used for 90 days. Which means, I think, that nobody on my forum posted an Instagram link recently.

So, here’s the current status of the oEmbed Read permission:

To request advanced access to this permission, you need to make a successful test API call. It may take up to 24 hours after the first API call for this button to become active. Learn about testing

How in practice do we do an API call with Discourse in this context to request advanced access again? :thinking:

2개의 좋아요