Configurar um token de aplicativo para oneboxes do Instagram

:warning: Atualizações importantes desde que este guia foi escrito originalmente:

  1. A Revisão de Aplicativos agora é obrigatória. Desde setembro de 2021, a Meta exige que seu aplicativo passe pela Revisão de Aplicativos e seja aprovado para a permissão oEmbed Read (agora chamada Meta oEmbed Read para aplicativos criados após 8 de abril de 2025). Sem isso, as chamadas da API oEmbed falharão. Consulte as orientações de envio para Revisão de Aplicativos da Meta para obter dicas sobre como ser aprovado.

  2. Os oneboxes do Instagram podem não ser renderizados corretamente. A partir de 3 de novembro de 2025, a Meta removeu os campos thumbnail_url, thumbnail_width, thumbnail_height e author_name das respostas oEmbed do Instagram. O código onebox do Instagram do Discourse depende atualmente desses campos (lib/onebox/engine/instagram_onebox.rb), o que pode resultar em embeds quebrados ou vazios.

  3. Apenas URLs de postagens e IGTV são suportadas. O Discourse atualmente só gera oneboxes para URLs de postagens /p/ (post) e /tv/ (IGTV) do Instagram. URLs de Reels (/reel/) não são suportadas.

  4. A interface do Console de Desenvolvedor do Facebook mudou significativamente desde que as capturas de tela abaixo foram tiradas em dezembro de 2020. As etapas gerais permanecem semelhantes, mas as telas e opções exatas podem parecer diferentes.


Se você já tem um Aplicativo do Facebook associado ao seu site Discourse, role para baixo até Adicionando o oEmbed ao seu Aplicativo do Facebook.

Se você não tem uma conta de Desenvolvedor do Facebook e um Aplicativo do Facebook:

Acesse https://developers.facebook.com/. Você será solicitado a fazer login em sua conta do Facebook se não estiver logado. Você pode ser solicitado a ‘converter’ sua conta do Facebook para uma conta de desenvolvedor se não o fez anteriormente. Você pode ser solicitado a verificar sua conta com o Facebook adicionando um número de telefone ou concluindo outras etapas. Você precisará apenas seguir as instruções e fazer o que o Facebook exigir de você.

Depois de ter uma conta de Desenvolvedor do Facebook, clique em ‘Meus Aplicativos’ na tela inicial do Desenvolvedor do Facebook:

…e em ‘Criar Aplicativo’:

Selecione um tipo de aplicativo ‘Outro’ (Something Else) e clique em ‘Continuar’ (Continue):

Insira um ‘Nome de Exibição do Aplicativo’ (App Display Name) e um ‘Email de Contato do Aplicativo’ (App Contact Email). Depois de ler os Termos e Políticas deles, você pode clicar em ‘Criar Aplicativo’ (Create App):

Se você for um robô: não há nada para ver aqui. Bip bop boop. :robot:

Se você não for um robô: clique em “Não sou um robô” (I’m not a robot), siga as instruções e clique em ‘Enviar’ (Submit).

Parabéns! Você tem um Aplicativo do Facebook!

Adicionando o oEmbed ao seu Aplicativo do Facebook:

Role até o final da lista de Produtos, encontre ‘oEmbed’ e clique em ‘Configurar’ (Set Up):

Se você concorda com a forma como usará o produto oEmbed, marque a caixa de seleção e clique em ‘Confirmar’ (Confirm):

O produto oEmbed foi adicionado. Clique em ‘Configurações’ (Settings):

‘Nome de Exibição’ (Display Name) e ‘Email de Contato’ (Contact Email) já devem estar preenchidos. Você precisará inserir URLs para sua ‘Política de Privacidade’ (Privacy Policy) e ‘Termos de Serviço’ (Terms of Service). Selecione uma ‘Categoria’ (Category) na lista de opções disponíveis. Clique em ‘Salvar Alterações’ (Save Changes) quando estiver satisfeito com tudo:

Clique no botão de alternância na parte superior da tela para mudar de ‘Em desenvolvimento’ (In development) para o modo ‘Ao vivo’ (Live):

Clique em ‘Mudar Modo’ (Switch Mode):

Envie seu aplicativo para Revisão de Aplicativos (obrigatório desde 2021):

Antes que seu aplicativo possa acessar a API oEmbed em produção, você deve enviá-lo para Revisão de Aplicativos e solicitar a permissão oEmbed Read (ou Meta oEmbed Read para aplicativos criados após 8 de abril de 2025).

  1. No painel do seu aplicativo, vá para Revisão de Aplicativos (App Review) → Permissões e Recursos (Permissions and Features).
  2. Encontre oEmbed Read (ou Meta oEmbed Read) e clique em Solicitar (Request).
  3. Você pode precisar primeiro fazer uma chamada de teste de API bem-sucedida antes que o botão de solicitação fique ativo. Pode levar até 24 horas após sua primeira chamada de API.
  4. Ao enviar, forneça um URL no seu site Discourse que contenha um embed do Instagram e explique que seu site usa o software de fórum Discourse para incorporar posts do Instagram usando a API oEmbed.

Consulte a documentação do oEmbed da Meta para obter orientações detalhadas de envio.

Gere seu Token de Acesso ao Aplicativo:

Tendo feito tudo isso, podemos gerar um Token de Aplicativo seguindo as instruções do Facebook sobre Tokens de Acesso ao Aplicativo. Você precisará do valor do campo ‘ID do Aplicativo’ (App ID) e do valor do campo ‘Segredo do Aplicativo’ (App Secret). Para obter o Segredo do Aplicativo, clique em ‘Mostrar’ (Show). Você pode ser solicitado a se reautenticar ou algo semelhante, mas deverá obter um longo valor hexadecimal que poderá copiar:

Conforme a documentação do Facebook, você precisa enviar esses valores ao Facebook para gerar um token. Você está familiarizado com o uso do curl? Ótimo! Eles sugerem o seguinte (substituindo {your-app-id} e {your-app-secret} pelos valores que você copiou da tela acima).

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

Alternativamente, copiar apenas o URL (após substituir esses dois valores) para o seu navegador também deve funcionar:

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

O Facebook responderá com um pequeno bloco de JSON, que deve se parecer com este exemplo:

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

Copie o valor do seu access_token, excluindo as aspas (ou seja, no meu exemplo seria 1234567890654321|c3bd55c09fc5e561552ad7a8717), e vá para as Configurações do seu site Discourse. Encontre a configuração do site chamada facebook_app_access_token nas configurações do Onebox. Cole o valor do ‘access_token’ neste campo:

Clique no :white_check_mark: …e pronto!

Colar um URL como https://www.instagram.com/p/CIRhYzFM7Lu/ em uma postagem no seu site deve resultar em um onebox adorável, assim como este:

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

17 curtidas

Novo Recurso de Leitura oEmbed e Requisitos de Revisão de Aplicativos

Hoje, 8 de junho de 2021, anunciamos a v11.0 da Graph API e das APIs de Marketing. Com esta atualização, surgiram novos requisitos para acessar as APIs oEmbed . Alguns dos seus aplicativos acessam atualmente as APIs oEmbed e podem ser afetados por essas mudanças.

Para continuar acessando as APIs oEmbed, você deverá enviar seus aplicativos para revisão até 6 de setembro de 2021. Se desejar solicitar novo acesso às APIs oEmbed, também será necessário enviar seu(s) aplicativo(s) para revisão.

Para saber mais, consulte os requisitos atualizados. Se seus aplicativos não forem revisados para o recurso da API oEmbed até 6 de setembro de 2021, perderão o acesso a essa funcionalidade. Para evitar interrupções no acesso oEmbed dos seus aplicativos, envie-os para Revisão de Aplicativos o mais rápido possível.

Novas regras dos nossos senhores do Facebook. Acabei de enviar ambos os meus aplicativos para revisão. Encontrei uma publicação pública com um embed do Instagram e fiz um link direto para mostrar como a integração funciona. Espero que isso seja suficiente.

8 curtidas


womp womp, a revisão falhou.

aqui está o que eu enviei

Detalhes da sua submissão

Um revisor do Facebook consegue acessar ou fazer login no seu aplicativo para verificar se você está usando permissões ou recursos de acordo com a Política da Plataforma do Facebook?

Sim

Configurações da Plataforma

Desktop

URL do site: https://fixed.org.au/

Nenhuma conta necessária

  1. Visite The 'what you've done to your bike today' thread - #10218 by jaseyjase - Post your ride - FOA
  2. A postagem do Instagram está incorporada na página. O site está executando o software de fórum Discourse (https://discourse.org/)

Leitura de Oembed

Conte-nos como você está usando essa permissão ou recurso

O Discourse (https://discourse.org/) pode incorporar postagens do Instagram e do Facebook em postagens da comunidade, mantendo as pessoas em nosso site enquanto incorpora conteúdo de forma rica

URL de Oembed

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

Acabei de reenviar (havia um texto extra na URL do Oembed) e foi aprovado!!! :smiley: aguardando que meu segundo aplicativo seja…

3 curtidas

O texto parece ser o mesmo que no seu envio inicial de revisão. Você pode detalhar quais informações adicionais você forneceu em comparação com a revisão que falhou?

Além disso: Você passou os dados de login do Facebook para o fórum ou não?

1 curtida

@znedw minha pergunta ainda vale, você pode ajudar a todos com alguma orientação sobre isso, por favor?

A primeira revisão falhou porque eu tinha algum texto extra no campo Oembed URL e o formulário remove espaços ao enviar, então o URL não funcionou… Essa é a única diferença entre as tentativas

Não. Na seção Plataforma (tive que adicionar uma plataforma no assistente), eu apenas escrevi

Nenhuma conta necessária

Eu realmente não queria configurar uma conta do Discourse apenas para a revisão do Facebook, então encontrei um post público no nosso fórum que tinha uma imagem do Instagram incorporada. Achei que isso mostraria como a integração funciona bem o suficiente. Imagino que o Facebook possa ler o código-fonte do Discourse e resolver isso por conta própria :man_shrugging:

Desculpe ter perdido isso. Eu literalmente não fiz nenhuma alteração em nenhum dos fóruns, apenas encontrei um post do fórum com uma foto do Instagram incorporada, como mencionado acima, e então segui o assistente de revisão do aplicativo no Facebook.

3 curtidas

Olá @znedw, segui seu guia e nossa revisão do app foi aprovada 24 horas depois.

No entanto, precisei inserir o link direto da publicação do Instagram incorporada no campo oEmbed-URL, pois o formulário não aceitou o link para o tópico em nosso domínio nesse campo. Talvez tenham alterado essa parte.

Para o restante, segui exatamente sua redação. E funcionou.

1 curtida

Pergunta Rápida: O processo mudou para ser “Instagram Basic Display” ou eu estou muito, muito cego? Porque não consigo ver a opção oEmbed, o mais próximo por definição que eu suponho que seja o Instagram Basic Display.

Citando:

O Instagram Basic Display permite que os aplicativos acessem a API do Instagram Basic Display, que fornece acesso somente leitura a dados básicos nas contas do Instagram dos usuários do aplicativo.

Use esta guia para configurar a janela de autorização da API para que você possa obter permissões dos usuários e para enviar seu aplicativo para Revisão de Aplicativo quando estiver pronto para mudar para o Modo Ativo.

Observe que o Basic Display não é uma ferramenta de autenticação. Os dados retornados pela API não podem ser usados para autenticar os usuários do seu aplicativo ou fazer login neles. Se o seu aplicativo usar dados da API para autenticar usuários, ele será rejeitado durante a Revisão de Aplicativo. Se você precisar de uma solução de autenticação, use o Login do Facebook em vez disso.

Ele, no entanto, requer outras URLs que não estão listadas aqui, então não tenho certeza, por exemplo:

Configuração OAuth do Cliente

URL de Callback de Desautorização


(Também talvez algo tenha mudado porque não funciona aqui, eu acho?)

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

3 curtidas

pelo que posso dizer, ainda é oEmbed read com acesso avançado

1 curtida

Entendi. Há uma diferença em relação ao tutorial, então.

Em vez de ser adicionado como qualquer outro recurso (chamado de "Produtos" na interface do usuário) no Painel, agora ele é solicitado na seção "Solicitar" do menu "Revisão do aplicativo". Você seleciona o recurso e o envia para revisão.

O que torna o processo meio que uma brecha, porque eles solicitam um link com um oEmbed válido para aprová-lo… mas não funciona porque o recurso não foi aprovado… :sweat:

4 curtidas

Agora funciona na minha conta. Tentarei resumir o que você precisa. Não sou particularmente entendido em tecnologia, então não tenho certeza se consigo responder a muitas perguntas, mas suponho que você possa copiar minhas configurações o mais próximo possível para verificar se tudo funciona.

Você precisa de login do Facebook (não sei se a API do Instagram Graph é realmente necessária). Verifique se o login do Facebook funciona na sua instalação do Discourse

Configurações de login do Facebook:

Configurações básicas:

Configurações avançadas:

3 curtidas

Olá a todos, queria avisar que a partir de hoje, a descrição do @Iceman permanece precisa.

Alguns layouts de página foram modificados em relação ao guia (:point_up:), mas a principal diferença é que o oEmbed deve ser solicitado depois que seu aplicativo for aprovado na Revisão do Aplicativo.

No menu “Revisão do Aplicativo”, você pode fazer solicitações:

Meu aplicativo ainda não passou pela Revisão do Aplicativo, mas o @undasein conseguiu fazê-lo funcionar recentemente, com a ajuda deste guia e conselhos de https://stackoverflow.com/questions/67998234/starting-using-instagram-oembed-feature.


Boa sorte compartilhando seus `grams, pessoal! :slight_smile:

3 curtidas

Na minha solicitação, não fiz nada elaborado. Apenas escrevi “Gostaria de incorporar posts do Instagram no meu fórum” e foi aprovado em um dia.

1 curtida

Como posso acessar o oembed read avançado? Nem consigo solicitá-lo porque o botão está desativado. Fiz algumas chamadas de API no gráfico, mas nada acontece mesmo após 24 horas

Alguns usuários contornaram isso enviando o aplicativo para revisão por um motivo diferente (como login do Facebook) e, uma vez aprovado, alguns recursos podem ser solicitados, como “Oembed Read”.

Você pode querer entrar em contato com os canais de suporte da plataforma para entender o que está acontecendo com sua conta. :+1:

1 curtida

[quote=“Jamie Wilson, post:1, topic:223548, username:jamie.wilson”]noEmbed
[/quote]

oEmbed não existe mais, em que devo colocá-lo em vez disso?

[quote=“Iceman, post:10, topic:223548, username:Iceman”]Instagram Basic Display
[/quote]

Não consigo ver a opção oEmbed, qual você escolheu?

Seu aplicativo já passou na Revisão de Aplicativos, @danielabc?

1 curtida

quando vou para a opção, o botão está desativado e não consigo clicar

quando vou para a opção, o botão está desativado e não consigo clicar

Meu acesso foi revogado porque não foi usado por 90 dias. O que significa, acho, que ninguém no meu fórum postou um link do Instagram recentemente.

Então, aqui está o status atual da permissão de Leitura oEmbed:

Para solicitar acesso avançado a esta permissão, você precisa fazer uma chamada de API de teste bem-sucedida. Pode levar até 24 horas após a primeira chamada de API para que este botão fique ativo. Saiba mais sobre testes

Como, na prática, fazemos uma chamada de API com Discourse neste contexto para solicitar acesso avançado novamente? :thinking:

2 curtidas