07/08 카카오톡 로그인

http://www.passportjs.org/

Passport.js

 

카카오 개발자 앱 등록

https://developers.kakao.com/

Kakao Developers

카카오 앱 생성

Web플랫폼 설정 (url등록)

로그인 후 리다이렉트 url 등록

호스팅할 서버에 서버코드 업로드

 

 

유니티

App.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Networking;
using Newtonsoft.Json;

public class res_kakao_user
{
    public int id;
    public string nickname;
    public string profile_image_url;
}

public class App : MonoBehaviour
{
    public Button btnLogin;
    public Text txtUserId;
    public Text txtNickName;
    public Image imgThumb;

    public UniWebView webView;

    // Start is called before the first frame update
    void Start()
    {
        webView.OnMessageReceived += WebView_OnMessageReceived;
        this.btnLogin.onClick.AddListener(() => {
            webView.Frame = new Rect(0, 0, Screen.width, Screen.height);
            webView.Load("");//호스팅중인 서버 주소
            webView.Show();
        });
    }

    private void WebView_OnMessageReceived(UniWebView webView, UniWebViewMessage message)
    {
        Debug.LogFormat("message.RawMessage: {0}", message.Args["user"]);

        Destroy(webView.gameObject);    //창을 닫는다 

        var user = JsonConvert.DeserializeObject<res_kakao_user>(message.Args["user"]);
        this.txtUserId.text = user.id.ToString();
        this.txtNickName.text = user.nickname;

        var imgUrl = user.profile_image_url.Insert(4, "://");

        Debug.Log(imgUrl);

        StartCoroutine(this.WaitForLoadThumb(imgUrl, (texture) => {

            Debug.Log(texture);

            this.imgThumb.sprite = Sprite.Create(texture, new Rect(0, 0, texture.width, texture.height), Vector2.zero);
        }));
    }

    private IEnumerator WaitForLoadThumb(string url, System.Action<Texture2D> callback)
    {

        //텍스쳐를 로드한다 
        //https://docs.unity3d.com/Manual/UnityWebRequest-RetrievingTexture.html
        UnityWebRequest www = UnityWebRequestTexture.GetTexture(url);
        yield return www.SendWebRequest();
        Texture myTexture = DownloadHandlerTexture.GetContent(www);

        Debug.Log(myTexture);

        callback((Texture2D)myTexture);
    }
}

 

서버 코드

web.js

const express = require("express");
const app = express();
const passport = require("passport");
const KakaoStrategy = require("passport-kakao").Strategy;

let user = {};

passport.use(
  new KakaoStrategy(
    {
      clientID: "",//rest api키
      clientSecret: "", // clientSecret을 사용하지 않는다면 넘기지 말거나 빈 스트링을 넘길 것
      callbackURL: "",//카카오 콜백 주소
    },
    (accessToken, refreshToken, profile, done) => {
      // 사용자의 정보는 profile에 들어있다.
      let raw = JSON.parse(profile["_raw"]);

      user.id = profile.id;
      user.nickname = raw.kakao_account.profile.nickname;
      user.profile_image_url = raw.kakao_account.profile.profile_image_url;

      done(null, user);
    }
  )
);

app.get("/auth/kakao", passport.authenticate("kakao", null), (req, res) => {
  console.log("failed");
});

app.get("/auth/kakao/callback", (req, res) => {
  passport.authenticate("kakao", (err, user) => {
    let json = JSON.stringify(user);
    res.send(
      `<script>window.location.href = 'uniwebview://test?user=${json}';</script>`
    );
  })(req, res);
});

app.get("/", (req, res) => {
  res.send("<h1>hello express!!</h1>");
});

app.listen(8001, () => {//포트 설정
  console.log("server is running at 3030 port.");
});