Next.js typescript 프론트에서 카카오 로그인 인가코드 확인하기

//components>OAuth.tsx

const CLIENT_ID = "0000000000000000000";//각자 입력하기
const REDIRECT_URI = "http://localhost:3000/";

export const KAKAO_AUTH_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}&response_type=code`;

//버튼 누르면 카카오 로그인 동의서 화면이 나옴

import { KAKAO_AUTH_URL } from "../components/OAuth";

...

<a href={KAKAO_AUTH_URL}>
   <img src="/kakao_login.png"></img>
</a>

//인가코드를 확인하고 싶은 페이지에 코드 작성

"use client";
import axios from "axios";
import Link from "next/link";
import React from "react";

export const Navigation = () => {
  const [isRender, setIsRender] = React.useState(false);

  React.useEffect(() => {
    setIsRender(true);
  }, []);

  React.useEffect(() => {
    //인가코드
    const code = new URL(window.location.href).searchParams.get("code");

    console.log("카카오 인가코드가 아래에!!");
    console.log(code); //콘솔에 나옴!📍📍📍

   
  return (
    ...
  );
};