업무 관련하여 GitHub의 로그인(인증)을 가지고 웹사이트를 구축하고자 알아보고 있다.

별도의 웹페이지를 구성하는데, 로그인 부분을 GitHub 것을 가지고 오고 싶은 것이다.


구글신님께 여쭤보니 자꾸만 Node.JS 기반의 샘플 코드만 알려주시는데,

미천한 중생인 필자는 구석기 시대를 살고 있는 무식한 종자이기에... 버겨웠다 ㅠㅠ


하지만, 구현은 해야하는데...


필자에게 남은 선택지는 두 가지 !!!

① Node.JS 공부하기

② 무조건 다른 방식 찾아내기


그러다가 우연히 만난 구글신님의 중얼거림..... "PHP로 구현한 샘플도 있는데..."


그래서, 대세 흐름은 아니지만 PHP로 구현한 코드를 직접 한 번 되는지 해보기로 했다.



1. WAS 환경 구축하기

    - Docker 기반으로 nginx + php 환경을 간단히 구축해봤다.

        ① Docker 설치하기 (링크)

        ② Docker-Compose 설치하기 (링크)

        ③ docker-compose.yml 작성


version: '3'


services:


    web:

        image: nginx:latest

        ports:

            - "80:80"

        volumes:

            - ./html:/code

            - ./web/conf/default.conf:/etc/nginx/conf.d/default.conf

            - ./web/log:/var/log/nginx


    php:

        image: php:7.3-fpm

        expose:

            - "9000"

        volumes:

            - ./html:/code


        ④ ./web/conf/default.conf 작성


server {

    listen 80;


    server_name 192.168.100.xxx localhost;


    index index.php index.html;


    root /code;


    location ~ \.php$ {

        try_files $uri =404;

        fastcgi_split_path_info ^(.+\.php)(/.+)$;

        fastcgi_pass php:9000;

        fastcgi_index index.php;

        include fastcgi_params;

        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;

        fastcgi_param PATH_INFO $fastcgi_path_info;

    }


    error_log  /var/log/nginx/error.log;

    access_log /var/log/nginx/access.log;

}


    ⑤ ./html/index.php


<?php


echo phpinfo();


?>


    ⑥ 브라우져로 접속해서 확인 → 성공~



※ 진행하다보니.... 집에서 VirtualBox로 생성한 서버에서 테스트를 진행하려다보니 여러가지 제약사항이 생겼다.

   일단 외부에 있는 GitHub.com에서 내부로 들어올 수도 없고..... 포트포워딩 등을 셋팅하면 되겠지만...

   야밤에 귀찮기도 하고... 그래서 외국에 있는 저렴이 서버 호스팅을 이용해서 테스트 진행하기로 했다.




2. GitHub 에서 App 등록하기


    - GitHub 인증을 이용하기 위해서는 GitHub에 "OAuth Apps"로 등록하는 과정이 필요하다.

    - 회사에서는 GitHub Enterprise에서 진행을 해야하지만, 지금 집에서는 GitHub.com을 이용하기로 했다.



    - GitHub.com 로그인 후 계정에서 Settings 메뉴 선택 후 Developer settings 항목을 선택하자



    - 우리가 사용할 것은 OAuth Apps 메뉴이다.



    - 위와 같이 정보를 채우자. (GitHub로 시작하는 이름은 사용할 수 없단다 ^^)

    - 생성할 때 callback URL을 어떻게 해야할지 몰라서 위와 같이 했는데... 실제 구성 時 로그인 페이지의 URL로 작성해주자.




    - 이제 우리에게 필요한 정보를 얻었다!!!




3. 페이지 구성하기


    ① index.php : 첫 접근 페이지

        - 이미 로그인이 되어있으면 main.php 페이지로 전환

        - 로그인을 원하면 login.php 링크 제공

<?php

session_start();


if (isset($_SESSION['github_data'])) {

    header("location: main.php");

}

?>

<a href="login.php">Login with Github</a>


    ② login.php

        - 로그인이 안되어 있으면 GitHub.com으로 보내버리고,

        - 로그인이 되어 있으면 세션에 사용자 정보를 넣고선 main.php로 전환

        - 위에서 생성한 정보는 각자 알맞게 입력!

<?php


$config = array(

    'client_id'     => 'xxx',

    'client_secret' => 'xxx',

    'redirect_url'  => 'http://xxx.xxx.xxx.xxx:8080/login.php',

    'app_name'      => 'WHATWANT GH Login'

);


session_start();


if($_SERVER['REQUEST_METHOD'] == 'GET') {

    if(isset($_GET['code'])) {


        $curl = curl_init('https://github.com/login/oauth/access_token');


        //TO DO: code 값이 없을 경우 처리

        $config['code'] = $_GET['code'];


        curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);

        curl_setopt($curl, CURLOPT_POSTFIELDS, http_build_query($config));

        curl_setopt($curl, CURLOPT_HTTPHEADER, array("Accept: application/json"));


        $json_response = curl_exec($curl);

        curl_close($curl);



        $token = json_decode($json_response);


        //TO DO: access_token 값이 리턴되지 않을 경우 처리

        $_SESSION['access_token'] = $token->access_token;


        $curl = curl_init("https://api.github.com/user?access_token=".$_SESSION["access_token"]);


        curl_setopt($curl, CURLOPT_HEADER, false);

        curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);

        curl_setopt($curl, CURLOPT_HTTPHEADER, array("Accept: application/json", "User-Agent: WHATWANT App"));


        $json_response = curl_exec($curl);

        curl_close($curl);


        $userdata = json_decode($json_response, true);



        $_SESSION['github_data'] = $userdata;

        header("location: main.php");

    }


    else {


        $url = "https://github.com/login/oauth/authorize?client_id=".$config['client_id']."&redirect_uri=".$config['redirect_url']."&scope=user";

        header("Location: $url");

    }

}


?>


    ③ main.php

        - 세션에 값이 없으면 index.php로 전환

        - 세션에 값이 있으면 정보 출력, 더불어 로그아웃 링크 제공

<?php

session_start();


if (!isset($_SESSION['github_data'])) {

    header("location: index.php");

}

else {


    foreach( $_SESSION['github_data'] as $key => $value ) {

        echo "$key => $value<br>";

    }


    echo "<a href='logout.php'>Logout</a>";

}

?>


    ④ logout.php

        - 세션값 날리고, index.php 페이지로 전환

<?php

session_start();

unset($_SESSION['github_data']);

header("Location: index.php");

?>


일단 급한대로 여기에서 마무리.

아직 구현하지 않은 부분은 구현하는대로 업데이트 하겠음~!!


참고사이트 : https://www.9lessons.info/2014/02/login-with-github-oauth-php.html


반응형

+ Recent posts