localhost에서 Facebook 애플리케이션 실행

내 로컬 호스트에서 Facebook 채팅에 연결할 계획입니다. Facebook에서 세션 키를 가져와야합니다. 사이트 URL을 그대로 제공 localhost:8080하거나 ip-address:8080작동하지 않습니다.

하나는 dev m / c에서 실행되고 다른 하나는 localhost에서 실행되는 2 개의 서로 다른 API 키를 사용하여 두 개의 앱을 설정하는 방법에 대해 읽었지만 제대로 이해하지 못했습니다.

누구든지 localhost에서 Facebook 앱을 실행하는 방법을 설명 할 수 있습니까?

얼마 전에 이것에 대한 튜토리얼을 썼습니다 .

가장 중요한 점은 "사이트 URL"입니다.

사이트 URL : http : // localhost / app_name /

폴더 구조는 다음과 같습니다.

app_name
¦   index.php
¦
+---canvas
¦   ¦   index.php
¦   ¦
¦   +---css
¦           main.css
¦           reset.css
¦
+---src
        facebook.php
        fb_ca_chain_bundle.crt

편집 :
Kavya : FB 서버가 IP 또는 포트 없이도 내 로컬 호스트를 어떻게 인식합니까 ??

나는이 페이스 북과 아무 상관이 있다고 생각하지 않는다, 나는 생각 iframe이 된 이후 src매개 변수는 브라우저에 직접 넣어 것처럼 로컬 URL을 치료하는 것입니다 클라이언트 측에서로드됩니다.

예를 들어 온라인 서버에 콘텐츠 (예 :)가있는 파일이 있습니다 online.php.

<iframe src="http://localhost/test.php" width="100%" height="100%">
    <p>Not supported!</p>
</iframe>

그리고 localhost 루트 디렉토리에 다음 파일이 있습니다 test.php.

<?php echo "Hello from Localhost!"; ?>

이제 방문 http://your_domain.com/online.php하면 localhost 파일의 내용을 볼 수 있습니다!

이것이 바로 실시간 구독 및 콜백 승인 취소 가 로컬 호스트 URL에서 작동 하지 않는 이유입니다 ! Facebook은 이러한 URL에 대해 핑 (http 요청을 전송)하지만 분명히 Facebook 서버는 해당 URL을 귀하의 URL로 변환하지 않기 때문입니다!

localhost를 사용하는 경우 :

Facebook-> Settings-> Basic에서 "App Domains"필드에 "localhost"를 입력 한 다음 "+ 플랫폼 추가"를 클릭하고 "웹 사이트"를 선택합니다.

"모바일 사이트 URL"과 "사이트 URL"이라는 두 개의 필드를 만들고 "사이트 URL"에 "localhost"를 다시 작성합니다.

나를 위해 작동합니다.

또한 '호스트'파일을 편집하고 도메인의 로컬 변형을 만들 수도 있습니다.

예

실제 페이스 북 애플리케이션 주소가 "example.com"인 경우 "localhost"를 가리키는 "hosts"파일에 "localhost.example.com"(PC에서만 액세스 가능) 도메인을 만들고이 도메인에서 로컬 웹 사이트를 실행할 수 있습니다. 이런 식으로 Facebook을 속일 수 있습니다.

앱의 기본 설정 ( https://developers.facebook.com/apps )에서 설정-> 기본-> 앱이 Facebook과 통합되는 방식 선택 ...

"사이트 URL :"및 "모바일 사이트 URL :"을 사용하여 프로덕션 및 개발 URL을 보관하십시오. 두 사이트 모두 인증이 허용됩니다. 인증을 위해 Facebook을 사용하고 있으므로 모바일 사이트 리디렉션 기능이 필요하지 않습니다. 인증을 테스트하는 동안 일반적으로 "Mobile Site URL :"을 "localhost : 12345"사이트로 변경 한 다음 완료되면 다시 정상으로 설정합니다.

2013 년 8 월. Facebook은 "localhost : 3000"과 같이 앱에 대한 포트로 도메인을 설정하는 것을 허용하지 않습니다.

따라서 https://pagekite.net 을 사용 localhost:port하여 적절한 도메인 으로 터널링 할 수 있습니다 .

Rails 개발자는 http://progrium.com/localtunnel/ 을 무료로 사용할 수 있습니다 .

• Facebook은 한 번에 하나의 앱 도메인 만 허용합니다. localhost로 다른 것을 추가하려고 시도하면 도메인에 대해 일종의 다른 오류가 표시됩니다. 콜백 및 앱 도메인 설정에는 한 번에 하나의 도메인 만 사용해야합니다.

그래서 오늘 이걸 사용했습니다. 내 URL은 http://localhost:8888입니다. 내가 facebook에 준 도메인은 localhost입니다. FB.api방법을 사용하여 데이터를 가져 오려고했기 때문에 작동하지 않는다고 생각했습니다 . 나는 "정의되지 않은"이름과 소스가없는 이미지를 계속 얻었 기 때문에 확실히 Graph에 액세스 할 수 없었습니다.

나중에 나는 내 문제는 내가 단지의 첫 번째 인수를 전달했다 정말로 것을 깨달았다 /me에 FB.api, 나는 토큰이 없었다. 따라서 인수에 FB.getLoginStatus추가해야하는 토큰을 얻으려면 함수를 사용해야합니다 /me.

캔버스 URL을 http : // localhost / app_path 로 지정하십시오 .

Ok 나는이 답변이 무엇인지 잘 모르겠지만 내 직장에서 수석 개발자의 조언에 따라 무엇이 나를 위해 일했는지 알려 드리겠습니다. 저는 Ruby on Rails에서 일하고 있으며 Facebook의 JavaScript 코드를 사용하여 액세스 토큰을 얻습니다.

문제 : 인증을 위해 Facebook은 주소 표시 줄에서 URL을 가져와 파일에있는 URL과 비교합니다. localhost:3000어떤 이유로 든 사용할 수 없습니다 . 그러나 같은 완전히 만들어 낸 도메인 이름을 사용할 수 있습니다 yoursite.dev로컬 서버를 실행하고 지정하여 yoursite.dev에 127.0.0.1:3000또는 어디서든 로컬 호스트를 가리키는했다.

1 단계 : Nginx 설치 또는 업데이트

$ brew install nginx(설치) 또는 $ brew upgrade nginx(업데이트)

2 단계 : nginx 구성 파일 열기

/usr/local/etc/nginx/nginx.conf (일반적으로 여기)

/opt/boxen/config/nginx/nginx.conf(Boxen을 사용하는 경우)

3 단계이 코드를 http {}블록에 추가합니다.

proxy_pass가리키고 싶은 곳으로 교체하십시오 yoursite.dev. 제 경우에는 localhost : 3000 또는 이와 동등한 것을 대체했습니다.127.0.0.1:3000

server {
  listen       yoursite.dev:80;
  server_name  yoursite.dev;
  location / {
    proxy_pass http://127.0.0.1:3000;
  }
}

4 단계 : /etc/hostsMac에서 포함 할 호스트 파일 편집

127.0.0.1   yoursite.dev

이 파일은 도메인을 localhost로 지정합니다. Nginx는 localhost에서 수신 대기하고 규칙과 일치하면 리디렉션합니다.

5 단계 : 앞으로 개발 환경을 사용할 때마다 Facebook이 올바르게 로그인하도록하는 yoursite.dev대신 주소 표시 줄에서 를 사용 localhost:3000합니다.

Forward는 로컬에서 Facebook 앱 개발을 돕는 훌륭한 도구이며 SSL을 지원하므로 인증서 문제가 발생하지 않습니다.

https://forwardhq.com/in-use/facebook

면책 조항 : 저는 개발자 중 한 명입니다.

로컬 호스트에 대해 https를 통해 실행되도록 앱을 설정해야합니다.

이 단계에 따라 우분투에서 HTTPS를 설정할 수 있습니다.

https://www.digitalocean.com/community/articles/how-to-create-a-ssl-certificate-on-apache-for-ubuntu-12-04

다음 단계를 수행해야합니다.

아파치 설치 (설치되어 있지 않은 경우)

sudo apt-get install apache2

1 단계 —SSL 모듈 활성화

sudo a2enmod ssl
sudo service apache2 restart

2 단계 — 새 디렉토리 생성

sudo mkdir /etc/apache2/ssl

3 단계 — 자체 서명 된 SSL 인증서 만들기

sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout /etc/apache/ssl/apache.key -out /etc/apache2/ssl/apache.crt

이 명령을 사용하여 자체 서명 된 SSL 인증서와이를 보호하는 서버 키를 만들고 둘 다 새 디렉터리에 배치합니다. 가장 중요한 라인은 "Common Name"입니다. 여기에 공식 도메인 이름을 입력하거나 아직 도메인이없는 경우 사이트의 IP 주소를 입력합니다.

일반 이름 (예 : 서버 FQDN 또는 사용자 이름) [] : example.com 또는 localhost

4 단계 — 인증서 설정

sudo vim /etc/apache2/sites-available/default-ssl

다음 줄을 찾아 설정으로 편집하십시오.

ServerName localhost 또는 example.com

SSLCertificateFile /etc/apache2/ssl/apache.crt의 SSLEngine

SSLCertificateKeyFile /etc/apache2/ssl/apache.key

5 단계 — 새 가상 호스트 활성화

sudo a2ensite default-ssl
sudo service apache2 reload

트릭:

MAMPPRO를 사용 하고 다음을 생성합니다. 서버 이름 : 웹 사이트의 정확한 주소 (예 : helloworld.com)를 디스크의 사이트에

Facebook : 따라서 원래 사이트 URL도 유지할 수 있습니다 (예 : helloworld.com).

이제 주소 표시 줄에 웹 사이트를 입력 할 때 로컬 에 있음을 이해합니다 ! .. 온라인 상태를 원할 때 MAMP PRO에서 서버를 비활성화하기 만하면됩니다.

:)

위의 답변 중 어느 것도 나를 위해 일하지 않았습니다. FB API 2.5에서 실행 중입니다. 내 것은 일단 해결되면 성공으로 이어지는 문제의 조합이었습니다.

1. 테스트 앱을 만들어 그대로 유지 및 관리하고 게시 할 때 비활성화 할 수 있는지 확인합니다.
2. 오류 메시지를 제대로 읽습니다.- "클라이언트 OAuth 로그인"을 사용하여 "웹 OAuth 로그인"을 활성화해야했습니다.
3. https://www.whatismyip.com/ 을 사용 하여 내 현재 IP가 무엇인지 알아보십시오.
4. 내 도메인 즉 , 현재 IP를 가리키는 http://localhost.mydomain.com 에 A 레코드를 만듭니다.

동적 IP의 변경으로 이상적이지 않을 수 있으며 DynDNS 또는 유사한 것을 사용하여 IP를보다 "정적"으로 만들 수 있지만 저에게는 효과적이었습니다.

제 경우에는 문제가 localhost : 4200에서 facebook api 웹 사이트로의 CORS 요청을 차단하는 크롬으로 밝혀졌습니다. 이 설정으로 Chrome 실행 : "YOUR_PATH_TO_CHROME \ Google \ Chrome \ Application \ chrome.exe"--disable-web-security --user-data-dir = "c : / chrome은 개발하는 동안 매력처럼 작동했습니다. 로컬 호스트가 없어도 페이스 북 앱 설정에 추가되었습니다.