ローカルホストを使用する場合のFacebookアプリのドメイン名

こちらのチュートリアルから：http：
//ankurm.com/blog/api/using-localhost-for-facebook-app-development/1091/

Facebookアプリのローカル開発エリアを設定しようとしました。しかし、ドメイン名として「http：// localhost：85 / my_app /」を入力すると、Facebookは

アプリドメイン：「http：// localhost：85 / app-name /」にプロトコル情報を含めることはできません。

また、ドメイン名として「localhost：85 / my_app /」を入力すると、次のエラーが発生します。

アプリドメイン：localhost：85 / my_app /は有効なドメインではありません。

私の解決策：

1. アプリドメインを空のままにします
2. （商品）Facebookログイン>設定
3. 追加http://localhost:85/my_app/のValid OAuth redirect URIsボックス
4. 変更内容を保存

プロトコルが変更されたようです。

これが私の解決策です（2015年4月3日にテストしましたが、うまく機能します）：

で設定- > [基本]タブ

1. アプリドメイン： localhost
2. 「+プラットフォームの追加」をクリックし、「ウェブサイト」を選択します
3. サイトのURL： http：// localhost：<port> /（<port>はポート番号です）
4. 変更内容を保存

1. アプリドメインを空のままにします
2. Facebookログインでウェブサイトに移動
3. 追加 http://localhost:port_number/
4. 変更を保存して、再試行してください。詳細については、次のWebサイトをご覧ください。

http://developers.facebook.com/docs/samples/canvas/ ハッピーコーディング:-)

これは何年にもわたって変更されましたが、ローカルホストで実行しているWebアプリで動作するようになりました。これは私がしたことです：

1. 後藤https://developers.facebook.com/apps
2. アプリを選択します。
3. 左側のナビゲーションバーから[設定]> [基本]を選択します。
4. ページの下部にある[プラットフォームの追加]ボタンをクリックします。
5. ウェブサイトをクリック
6. http://localhost:8080/サイトのURLを入力します。
7. 入力したサイトURLの右端にある[クイックスタート]ボタンをクリックします。
8. 新しいタブが開きます。そのタブで、[ウェブサイトについて教えてください]セクションまで下にスクロールしhttp://localhost:8080/、サイトのURLをもう一度入力します。
9. [次へ]ボタンをクリックします。
10. 再度ログインを試みましたが、今回はうまくいきました。

幸運を！

2018ワーキングソリューション

これを理解するのに何年もかかったので、私の解決策を共有します。

提案されたすべての回答を試しましたが、何もうまくいきませんでした。結局、https：//developers.facebook.com/apps/YOUR_APP_ID/fb-login/settings/にアクセスして、 [有効なOAuthリダイレクトURI]ボックスの完全なコールバックURL 。

私の場合、レールにRubyを使用すると、URLは次のようになりますhttp://localhost:3000/user/auth/facebook/callback。

そして、それを追加した直後に、すべてが機能し始めました！これがこの問題に直面している他の誰かに役立つことを願っています。

これは私が以前やっていたことです。

Windowsを使用している場合は、ホストファイルを変更する必要があります。ホストファイルの場所は次のようになります%SystemRoot%\System32\drivers\etc\

このようにホストファイルに新しい行を追加します

127.0.0.1    localhost.YOUR-SITE-NAME.com

ホストファイルを保存します。

FBアプリ設定コントロールパネルに移動しlocalhost.YOUR-SITE-NAME.com、アプリドメインフィールドに入力します。変更内容を保存。

次にlocalhost.YOUR-SITE-NAME.com、ブラウザからのようにローカル環境をロードします。

注意：YOUR-SITE-NAMEをドメイン名に変更してください。

実用的なソリューション（2018年8月）

まず、開発者ダッシュボードでアプリを選択します。

次に、アプリが開発モードになっていることを確認します。これにより、localhost overHTTPが許可されます。これを行うには、アプリのページの右上にあるトグルをクリックします。

最後に、以下の注意事項に従ってください。不適切に記入すると問題が発生する可能性があります。

• Settings > Basic > App Domains 空にする必要があります
• Products > Facebook Login > Settings > Valid OAuth Redirect URIs 空にする必要があります

あなたはどちらか、空白または使用のままにすることができlocalhost、http://localhost:85/my_app/URLであります

その時に私がそのチュートリアルを書いたとき、ポートはアプリドメインで許可されていました。そして、私は実際に81ポート（Wampサーバー）でアプリを実行することができました。FacebookがURLでのポートを許可していないようです。localhostアプリドメインでご利用いただけます。

早急に情報を更新します。私は解決策を見つけようとしています。

一時的な解決策は、localtunnelhttp ： //progrium.com/localtunnel/を使用することです。

私はこれをテストしました、そしてそれは私のために働きます[2020年2月]：

1. ngrokをインストールしてhttpsURLを取得します（例：https：//a3asdf23.ngrok.io ）
2. [FBアプリダッシュボード設定（基本）]-> [アプリドメイン]-> [追加]https://a3asdf23.ngrok.ioに移動しhttps://ngrok.ioます。
3. 同じページで、一番下までスクロールし、[プラットフォームの追加（Webサイト）]で、URLをに設定しhttps://a3asdf23.ngrok.ioます。まだ終了していません。[クイックスタート]-> [ウェブサイトについて教えてください]の下にある[クイックスタート]をクリックし、同じURLを入力しhttps://a3asdf23.ngrok.ioます。
4. その後、製品に行く- > Facebookログイン- >設定- >クライアントのOAuth設定] - > [OAuthのリダイレクトURIを有効- >これらを追加しhttps://a3asdf23.ngrok.io、https://ngrok.io、https://a3asdf23.ngrok.io/{your-redirect-uri}。

そして、ここに行きます。後でありがとう:)

ローカルホストを共有するには、トンネルを作成する必要があります。 Ngrokはそれを行う最も簡単な方法です。

https://ngrok.com

ゴー通じhttps://ngrok.com/ダウンロードngrokへのリンクと、そのファイルを抽出します。cmdを開きます（検索cmd）ngrokが抽出されたディレクトリに移動します。コマンドラインからngrokを開きます。例：c：/ngrok/ngrok.exe [port]またはcdc：/ ngrok then ngrok 80（ngrok [port]）

ngrok

Tunnel Status                 online
Version                       1.3/1.3
Forwarding                    http://3ahsdfhska.ngrok.com -> 127.0.0.1:80
Forwarding                    https://3ahsdfhska.ngrok.com -> 127.0.0.1:80
Web Interface                 http://127.0.0.1:4040
# Conn                        0
Avg Conn Time                 0.00ms

wampサーバーが同じポートで開いていることを確認することを忘れないでください…（チェック方法-> goto-> wampicon-> apache-> httpd.confポートを検索するか、80（デフォルト）ngrok.exe 80に使用します）

http://3ahsdfhska.ngrok.com

ローカルホストにオンラインでアクセスするためのURLになります

プロトコルエラーが発生した場合は、Http：//を削除する必要があるだけでなく、Webアドレスの末尾にバックスラッシュがある場合は、それも削除する必要があります。そうしないと、機能しません。私はこれをしました、そしてそれは完全に働きました！ホラ！

ミックスにもう1つのソリューションを投げます：

指示に従ってWebサイトを設定し、2番目のアプリ（Facebook Canvas）を追加して、そのURLをに設定しましたhttp://localhost:XXXXX。これで、ローカルと本番環境の両方でFBにアクセスできます。

私はローカルで開発し、次のURLを使用します。 localhost/fb

次に、次のURLのWebサイトを追加する必要がありました。 http://localhost

アプリドメインの下に追加しましたlocalhost。

今では動作します。私が抱えていた唯一の問題は、すべてのスクリプトでこのURLを使用する必要があるということでした。例えば

$loginUrl = $helper->getLoginUrl('http://localhost/fb/login-callback.php', $permissions);

使えない 127.0.0.1ここで...

ここに記載されているすべてのソリューションを試しましたが、どれも機能しませんでした。

私の問題を解決したのは、「OAuthリダイレクトURI」をfirebaseからFacebookアプリ「ValidOAuthリダイレクトURI」にコピーすることでした

すべてのドメインを空白のままにしました