프론트/Vue.js

카카오 로그인, 로그아웃

김어찐 2021. 11. 18. 18:44
728x90
<template>
  <div id="main">
                <button
                  type="button"
                  class="btn btn-warning"
                  v-on:click="kakaoLogin"
                >
                  Kakao Login
                </button>
                <button
                  type="button"
                  class="btn btn-warning"
                  v-on:click="kakaoLogout"
                >
                  Kakao Logout
                </button>
  </div>
</template>

<script>
import { mapState, mapActions } from "vuex";

const memberStore = "memberStore";

export default {
  name: "MemberLogin",

  methods: {

    kakaoLogin() {
      window.Kakao.Auth.login({
        success: (response) => {
          console.log(response);
          window.Kakao.API.request({
            url: "/v2/user/me",
            success: (response) => {
              console.log(response);
            },
            fail: function (error) {
              console.log(error);
            },
          });
        },
        fail: (error) => {
          console.log(error);
        },
      });
    },
    kakaoLogout() {
      if (window.Kakao.Auth.getAccessToken()) {
        window.Kakao.API.request({
          url: "/v1/user/unlink",
          success: function (response) {
            console.log(response);
          },
          fail: function (error) {
            console.log(error);
          },
        });
        window.Kakao.Auth.setAccessToken(undefined);
      }
    },
  },
  created() {
  	//index.html 에서
    window.Kakao.init("카카오 api key"); //발급받은 키 중 javascript키를 사용해준다.
    // console.log(Kakao.isInitialized()); // sdk초기화여부판단
  },
};
</script>

<style></style>
728x90