페이스북 로그인을 사용할 일이 있어 제 티스토리를 둘러 봤는데, 없어서, 작업하며 남겨 둡니다.

[공식문서]

Manually Build a Login Flow : https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow .

[주요 사이트]

페이스북 개발자 센터 : https://developers.facebook.com/ .

1. 페이스북 개발자 센터 로그인 및 앱정보 확인.

먼저, 개발자 센터로가 로그인하고, 해당 앱을 선택합니다. (페이스북 앱이 아직 없다면, 생성해 주면됩니다.).

베이직 셋팅으로가 AppID와 App Secret을 확인하고 메모해 둡니다. 앱 시크릿은 show 버튼을 누르면 표시가 됩니다.

그리고, 개발 계정에서도 사용할 수 있도로 계발자를 몇 명 등록합니다.

그리고, 페이스북 로그인을 사용할 수 있도록 추가합니다.

그리고 플랫폼별 퀵스타트가 나오는데 우리는 웹에 해당 하지만, 매뉴얼로 직접 설치 할 것 이므로, 굳이 보시지 않으셔도 좋습니다.

중요한 것은 리디렉션 페이지를 지정하는 것 입니다. 페이스북 로그인 시 처음 아이디 페스워드를 입력하는 창을 띄울 때 리디렉션을 통해 띄웁니다. 그리고, 이 것이 성공하면 호출될 리디렉션 주소를 입력하면 됩니다.

2. 로그인 창 부르기.

공식문서 Manually Build a Login Flow를 보면 아래와 같이 입력하라고 되어 있습니다.

https://www.facebook.com/v3.3/dialog/oauth?
  client_id={app-id}
  &redirect_uri={redirect-uri}
  &state={state-param}

값을 만들어 웹브라우저에 바로 붙여 넣어도 되며, 지금은 php서버로 작업할 것이며, start.php 파일을 만들어 위 페이지로 리다이렉션 시키도록 하겠습니다. state값은 임의로 생성해 주면 되며, redirect-url 은 로그인 결과를 돌려 받을 url로 위에서 적어둔 주소와 일치해야 합니다. 몇 개를 추가할 수는 있지만, 리스트에 없는 값으로 redirect를 요청하면 오류가 납니다. app-id는 위에서 확인했을 것 입니다.

그럼 로그인 페이지를 요청하겠습니다. 로그인이 끝나고, 돌려받는 redirect-url은 http:// 부터 (또는 https://) 파일명까지 풀로 적어 줍니다. 아래 소스가 페이스북 로그인 창을 부르는 소스의 모두 입니다. (편의상 start.php 라 하겠습니다.)

<?php

// 페이스북 로그인을 위한 주소를 만들어 줍니다.
$facebook_call_dialogue = "https://www.facebook.com/v3.3/dialog/oauth?"
  . "client_id={app-id}"
  . "&redirect_uri={redirect-uri}"
  . "&state={state-param}"
  ;
  
  
  
// 지정한 주소로 리디렉션 시키기.
header( 'Location: ' . $facebook_call_dialogue );

정상 동작한다면 아래와 같은 페이지를 만나게 됩니다.

페이스북의 API는 에세스 토큰을 얻은 다음 유저의 정보를 검색 하거나, 해당 유저 명의로 글을 쓰거나 할 수 있습니다.  이 때 권한이 필요한 데, 유저에게 이 앱이 그렇게 할 수 있는 권한을 주겠니 라고 물어보며, 그 화면이 아래와 같이 뜹니다.

여기서 다음을 누르면 code와 state를 위에서 적었던 redirect-url 페이지로 돌려 줍니다. 여기서 받은 코드를 서버에서 에세스 코드로 변경하는데, 보안상 php 서버에서 facebook과의 통신으로 통해 교환하며, GET 방식으로 연결해 받아 옵니다. php에서는 fsocketopen을 이용해 받아 올 수 있습니다.

3. 리디렉션 처리 하기.

리디렉션 까지 무사히 마쳤다면, GET을 통해 서버로 code 값이 전해 졌을 것 입니다. 그럼 아래 코드를 통해 토큰으로 교환할 수 있습니다. 이 부분은 redirect.php 에서 처리를 하면됩니다.

    // 코드값을 가지고 옵니다.
    $code = @$_GET['code'];



    // 에세스 토큰 교환을 위한 api 주소를 가지고 옵니다.
    $exchange_host = "graph.facebook.com";
    $exchange_path = "/v3.3/oauth/access_token";

    // 보낼 주소를 만들어 주도록 합니다.
    $mainAddr =
      $exchange_path
      . "?client_id=" . {app-id}
      . "&redirect_uri=" . {redirect-uri}
      . "&client_secret=" . {app-secret}
      . "&code=" . $code
    ;


    $addr = "https://" . $exchange_host . $mainAddr;
    echo "<br><br>";
    echo $addr;
    echo "<br><br>";


    // 보낼값을 만들어 줄 변수들을 만들어 줍니다.
    $endline = "\r\n";
    $req = "";

    // 보낼 데이터를 만들어 주도록 합니다.
    $req = "GET $mainAddr HTTP/1.1" . $endline
    . "Host: " . $exchange_host . $endline
    . "Connection: Close" . $endline . $endline
    ;





    // 페이스북 서버와 연결을 시도합니다.
    $fsock = @fsockopen( "ssl://" . $exchange_host , 443 );

    if( @!$fsock )
    {
      // $error_result['method_error'] = "토큰을 교환하기 위한 페이스북 서버 접근에 실패하였습니다.";
      echo "토큰 교환을 위한 소켓을 여는 데 실패했습니다.";
      exit;
    }



    // 토큰 데이터를 확인합니다.
    $headPassed = false;
    $AccessTokenJson = "";

    // 데이터 보내기를 합니다.
    fwrite( $fsock, $req );

    while( !feof($fsock) ) {
      $runCount++;
      // 한 줄 라인을 가지고 옵니다.
      $line = fgets($fsock, 128);

      // 아직 헤더는 아니지만, 헤더의 끝을 만난 경우, 헤더가 끝났음을 마킹하고, 종료합니다.
      if( $line == "\r\n" && !$headPassed )
      {
        $headPassed = true;
        continue;
      }

      // 헤더가 아닌 경우만, 값을 출력하도록 합니다.
      if( $headPassed )
      {
        $AccessTokenJson .= $line;
      }

    }

    // 연결을 닫아 주도록 합니다.
    fclose( $fsock );


    print_r( $AccessTokenJson );

4. 로그인 유저의 정보 확인하기.

에세스 토큰을 교환하던 요령으로, 한번 더 http 요청을 하면됩니다.

    // json 문자열을 객체로 전환.
    $AccessTokenObj = json_decode( $AccessTokenJson );
    $token = $AccessTokenObj->access_token;




    // 접속한 유저의 정보를 가지고 옵니다.
    $me_host = "graph.facebook.com";
    $me_path = "/v3.3/me";


    $me_path =
      $me_path
      . "?access_token=" . $token;
      echo $me_path;
      echo "<br>"
      ;


    // 보낼값을 만들어 줄 변수들을 만들어 줍니다.
    $endline = "\r\n";
    $req = "";

    // 보낼 데이터를 만들어 주도록 합니다.
    $req = "GET $me_path HTTP/1.1" . $endline
    . "Host: " . $me_host . $endline
    . "Connection: Close" . $endline . $endline
    ;





    // 페이스북 서버와 연결을 시도합니다.
    $fsock = @fsockopen( "ssl://" . $me_host , 443 );

    if( @!$fsock )
    {
      // $error_result['method_error'] = "토큰을 교환하기 위한 페이스북 서버 접근에 실패하였습니다.";
      echo "프로필 확인을 위한 소켓을 여는 데 실패했습니다.";
      exit;
    }



    // 토큰 데이터를 확인합니다.
    $headPassed = false;
    $meJson = "";

    // 데이터 보내기를 합니다.
    fwrite( $fsock, $req );

    $runCount = 1;

    while( !feof($fsock) ) {
      $runCount++;
      // 한 줄 라인을 가지고 옵니다.
      $line = fgets($fsock, 128);

      // 아직 헤더는 아니지만, 헤더의 끝을 만난 경우, 헤더가 끝났음을 마킹하고, 종료합니다.
      if( $line == "\r\n" && !$headPassed )
      {
        $headPassed = true;
        continue;
      }

      // 헤더가 아닌 경우만, 값을 출력하도록 합니다.
      if( $headPassed )
      {
        $meJson .= $line;
      }

    }

    // 연결을 닫아 주도록 합니다.
    fclose( $fsock );



    // 페이스 북으로 부터 access 토큰 교환 값을 표시합니다.
    echo "<br><br>respone of logined user profile from facebook:<br>";


    // 에세스 토큰을 확인해 주도록 합니다.
    // $AccessTokenObj = @json_decode( $AccessTokenJson );
    // $AccessToken = @$AccessTokenObj->access_token;

    print_r( $meJson );