Blog Bugginho Academy

Exibindo fotos do instagram no seu website com Laravel

Olá amiguinhos,

essa é a minha primeira contribuição aqui pro blog, e nessa oportunidade vou apresentá-los um tutorial de como fazer uma integração funcional da API do Instagram com o Laravel para exibição das imagens sem a necessidade de instalação de plugins.

Instalação

O primeiro passo é instalar a biblioteca Vinkla Instagram:

Configuração

O próximo passo é seguir com as configurações, iniciando pelo arquivo config/app.php adicionando as seguintes linhas:

Em providers:

Em aliases:

Execute o comando para publicar os arquivos do pacote:

IMPORTANTE, SE VOCÊ PULAR ESSA ETAPA NÃO IRÁ FUNCIONAR:

Por algum motivo, o arquivo de configuração original não está funcionando corretamente. Precisamos alterar a matriz principal afim de que o acess_token seja passado no formato json. Iremos então substituir a matriz connections para:

 

Para obter as credencias do Instagram, siga as seguintes etapas:

1. Crie uma nova aplicação

Acesse a área gerenciamento de clientes clicando aqui, em seguida, clique no botão register a new client.

 

 

2. Registre um novo Cliente ID

Insira suas informações, com atenção para as url’s de redirecionamento (Valid redirect URL’s), nessa informação você poderá deixar apenas a URL do seu projeto local (Ex. localhost:8000).

ATENÇÃO – Antes de clicar em Register, preste atenção na próxima etapa.

 

Certifique-se de ter clicado na aba Security, e desmarcado a opção Disable implicit OAuth:

Em seguida, informe o Captcha e clique em Register.

Você verá uma tela com as informações sobre seu Cliente ID.

 

Cole a seguinte URL no seu navegador informando o CLIENT_ID e a URL_PROJETO do seu projeto local NÃO FECHE ao ser redirecionado:

 

Você verá a seguinte tela:

 

Clique em Authorize, e lembre-se de não fechar a aba ou o navegador.

 

Perceba que no link, é possível ver o seu access_token e  agora você possui todas as informações para configurar o seu arquivo config/instagram.php .

O controller

 

A view

 

Recomendações

O pacote  vinkla/instagram é baseado no pacote Elogram. Você poderá se aprofundar acompanhando a documentação do projeto.

 

Caso queira um maior detalhamento sobre a estrutura do array recebida pela API, execute o comando

 

Bem pessoal, esse foi meu primeiro post por aqui. Em breve estarei escrevendo mais artigos e continuar contribuindo para a comunidade. Espero ter ajudado, abraços a todos.

Vinícius Carvalho

Empreendedor e desenvolvedor full-stack em FPPEdu.

1 comentário

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Your Header Sidebar area is currently empty. Hurry up and add some widgets.