Aplicativo do Facebook: localhost não funciona mais como domínio do aplicativo

Estou escrevendo um jogo para o Facebook usando Rails e jQuery. Desde que comecei a usar o SDK Javascript do Facebook, o uso de localhost como um domínio de aplicativo parecia funcionar muito bem. Pude testar meu jogo localmente e no Heroku.

No dia anterior, parece que o Facebook fez uma grande atualização na IU do desenvolvedor. Agora, se eu adicionar localhost como um domínio de aplicativo, recebo o seguinte erro:

Deve ser derivado de URL da tela, URL da tela segura, URL do site, URL do site móvel, URL da guia da página ou URL da guia da página segura. Verifique e corrija os seguintes domínios: localhost

Meu jogo agora também não funciona localmente e recebo um erro quando o SDK do Javascript faz login no usuário:

Código de erro da API: 191 Descrição do erro da API: O URL especificado não pertence ao aplicativo Mensagem de erro: redirect_uri inválido: o URL fornecido não é permitido pela configuração do aplicativo.

Isso não acontece quando implanto meu jogo, pois herokuapp.com é considerado um domínio de aplicativo válido.

Como devo desenvolver e testar meu jogo se não posso mais usar o localhost ou o 127.0.0.1?

O protocolo parece estar sempre mudando, e a resposta aceita não funcionou para mim hoje. Caso ajude outros pesquisadores, isto é o que funcionou para mim:

• Todas as alterações foram feitas na página Configurações na guia Básico

1.) No centro, sob a primeira caixa de opções, clique em "+ Adicionar plataforma" e escolha "Site" (ou o que for apropriado para seu aplicativo).

2.) Na caixa que aparece para o site que você acabou de adicionar: URL do site: http://localhost:3000/

3.) Na caixa acima (Configurações => Básico): Domínio do aplicativo: localhost

4.) No canto inferior direito - clique em "Salvar alterações"

5.) Certifique-se de ter o ID do aplicativo copiado e colado corretamente em seu código. (O ID está na primeira caixa dessa página se você precisar dele novamente.)

1. Vá para a página de configurações do seu aplicativo em http://developers.facebook.com
2. Clique na seta suspensa no canto superior esquerdo (ao lado do nome do seu aplicativo) e clique em "Criar aplicativo de teste" e dê um nome a ele
3. Em Configurações> Básico desse novo aplicativo de teste, defina os Domínios do aplicativo como "localhost"
4. Defina também o URL do site do site como " http: // localhost: 8888 " (ou qualquer porta que você esteja usando).
5. IMPORTANTE: este aplicativo possui ID de aplicativo e segredo de aplicativo diferentes do seu aplicativo online. Portanto, última etapa: certifique-se de atualizar o código que fica em seu localhost com o App ID e a chave secreta do aplicativo de teste. Pelo contrário, o código que fica no servidor ativo deve usar o ID e o segredo do aplicativo principal.

Você ainda pode testar seu aplicativo sem implantá-lo em um servidor remoto como o heroku. O truque é atualizar o etc/hostsarquivo desta forma:

127.0.0.1 mydomain.com

Em seguida, nas configurações do aplicativo do Facebook, digite [ http: //] meudominio.com, sem o "[" e "]"

Funcionou para mim desta forma

Para todos que estão se preocupando com isso em 2017. A interface mudou novamente. Queria comentar isso na resposta, mas não tenho reputação suficiente. O URL do host local do seu aplicativo agora deve ser copiado para três lugares. Atualmente, (26 de outubro de 2017), a sequência é:

1.) Clique em "Configurações" no menu à esquerda.

2.) No centro, sob a primeira caixa de opções, clique em "+ Adicionar plataforma" e escolha "Site" (ou o que for apropriado para seu aplicativo).

3.) Na caixa que aparece para o site que você acabou de adicionar, copie o url do seu site localhost (por exemplo, http: // localhost: 3000 / )

4.) Na caixa acima de "App Domain" copie o mesmo URL

5.) No canto inferior direito - clique em "Salvar alterações"

6.) No menu à esquerda em "Produtos", clique em "Login do Facebook" (ou adicione-o através de "+ Adicionar produtos" se não estiver disponível)

7.) Agora você está nas configurações de login do Facebook. Copie o mesmo url para o campo "Valid OAuth redirect URIs"

Isso deve funcionar.

Basta adicionar localhost como seu URL de tela ou url de site móvel, isso permitirá que você tenha localhost e herokuapp.com em sua configuração de domínio do aplicativo. Depois que seu aplicativo estiver em produção, basta removê-lo.

Este é o caminho errado. Você deve criar um aplicativo de teste usando a guia Teste nas configurações do aplicativo. E então você pode inserir o url do estágio de desenvolvimento (por exemplo localhost) para o seu aplicativo.

Solução usando Firebase

Para fazer isso funcionar localhost, 3000fiz o seguinte:

1. Criar aplicativo

2. Agora selecione "+ Criar aplicativo de teste" na lista suspensa de setas (canto superior esquerdo).

3. Adicionar localhosta domínios de aplicativos

4. Adicionar http://localhost:3000/ao URL do site selecionado "+ Adicionar plataforma"

Até este ponto, eu tinha seguido todas as respostas anteriores enviadas aqui, mas nada funcionou.

Assim...

5. No menu à esquerda, selecione "Adicionar produto"

6. Adicionar "Login do Facebook"

Você será apresentado a um carrossel de fluxo de trabalho, com domínio padrão http://localhost:3000/, clique em "continuar" até o final.

7. Selecione "Login do Facebook> Configurações" no menu do produto.

8. Insira o URI de redirecionamento do Firebase OAuth (encontrado ao ativar o login do Facebook no console do firebase https://console.firebase.google.com , exemplo abaixo)

9. Cole o URI e salve.

Feito.

Tente usar o url com porta, por exemplo

    http://localhost:8000/

Eu estava tendo o mesmo problema e encontrei essa solução agora.

Isso funciona para mim no heroku, a coisa localhost não funcionou (para mim). Espero que ajude

1.) No centro, sob a primeira caixa de opções, clique em "+ Adicionar plataforma" e escolha "Site" (ou o que for apropriado para seu aplicativo).

2.) Na caixa que aparece para o site que você acabou de adicionar: URL do site: http://MYAPP.herokuapp.com/ (substitua MYAPP pelo nome do seu aplicativo)

3.) Na caixa acima (Configurações => Básico): Domínio do aplicativo: MYAPP.herokuapp.com (substitua MYAPP pelo nome do seu aplicativo)

4.) No canto inferior direito - clique em "Salvar alterações"

Apenas uma nota para alguns outros que podem estar lutando com isso como eu. Não consegui fazer isso funcionar com aplicativos de "teste". Usando minhas configurações reais do aplicativo (e simplesmente adicionando

"http://localhost:3000/"

ao meu URL de tela) funcionou como todos os outros sugeriram. Parece que os aplicativos de teste não são iguais aos aplicativos reais.

Tive um problema com meu aplicativo Rails que geralmente executo com http: // localhost: 3000 porque o Facebook agora requer o redirecionamento OAuth válido para usar https.

Para usar https localmente, usei [ngrok] [1], que permite usar https fornecendo um túnel. Para fazer isso:

1. Eu fui ao site deles e baixei o programa
2. Extraí o arquivo para o programa
3. Em meu console, fui para o diretório para onde o ngrok foi extraído e digitei 'grok http 3000' em minha máquina Windows, outros podem usar './grok http 3000'
4. Depois de inserir isso, ngrok forneceu um endereço https que coloquei no campo URIs de redirecionamento OAuth válidos no Facebook
5. Então eu iniciei meu servidor e consegui acessá-lo usando aquele endereço https em vez de localhost: 3000

para fazer o teste local, basta desligar o aplicativo ou colocar o aplicativo do Facebook em modo de desenvolvimento. Então o Facebook permitirá que você acesse o aplicativo sozinho

Para mim funcionou assim:

Configurando o painel do aplicativo do Facebook:

* Na guia 'básico':

1) Deixando o domínio do aplicativo vazio.

2) Apagando qualquer plataforma. Significado: nenhum site, nenhuma plataforma de tela. (portanto, nenhum campo de URL do site para preencher)

* Na guia 'avançado':

3) Inseri os URIs de redirecionamento OAuth válidos:

http://localhost/myappfolder/redirect.php

4) em relação ao meu código, insdie my c: /xampp/htdocs/localhost/myappfolder/index.php (este arquivo faz o loginURL):

$helper = new FacebookRedirectLoginHelper('http://localhost/myappfolder/redirect.php');  

dentro do arquivo redirect.php:

$helper = new FacebookRedirectLoginHelper('http://localhost/myappfolder/redirect.php');  

e eu tenho uma sessão! finalmente! não há necessidade de me enforcar no final: P