2024.10.16 기록

모브박스 - 유튜브 api / env 환경변수

const YOUTUBE_API_KEY = 'aabbccaabbccaabbcc'
console.log(YOUTUBE_API_KEY, 'YOUTUBE_API_KEY')

env 파일을 만들기 전에는 잘 들어왔던 유튜브api 키 값
console.log( aabbccaabbccaabbcc,'YOUTUBE_API_KEY' )

const YOUTUBE_API_KEY = process.env.YOUTUBE_CODE;
console.log(YOUTUBE_API_KEY, 'YOUTUBE_API_KEY')

env 파일을 만들고 나서는 키 값이 제대로 안들어오는 현상
console.log( undefined,'YOUTUBE_API_KEY' )

next.js에서 env파일에 환경변수 사용시
클라이언트가 환경변수에 접근할 수 있게 하려면
변수 이름 앞에 NEXTPUBLIC 접두사를 붙여야한다.

.env

NEXT_PUBLIC_YOUTUBE_CODE = "aabbccaabbccaabbcc"

console.log( aabbccaabbccaabbcc,'YOUTUBE_API_KEY' )

const YOUTUBE_API_KEY = process.env.NEXT_PUBLIC_YOUTUBE_CODE;