vercel에 새 도메인 연결 이후 환경변수 적용 안 됨.

[김종휘]

환경 변수를 사용하는 Next.js로 만든 웹사이트를 vercel에 업로드했습니다.
.env 파일과 함께 vercel 플랫폼 환경 변수를 둘 다 설정하였습니다.
개발환경과 vercel 딱지 붙은 도메인에서는 정상적으로 작동이 되는 것을 확인했습니다.

그런데 새로운 도메인을 등록하고 네임 서버를 vercel로 연결한 이후부터는 환경 변수가 적용이 안 됩니다.
하드코딩을 하면 작동이 잘 되기 때문에 환경 변수 적용이 안 되는 문제라 확신합니다.

참고로 문제가 발생하는 부분은 Nodemailer와 Gmail을 이용한 이메일 보내기 양식입니다.

어떻게 해결해야할까요?
해결이 어렵다면, 하드코딩으로 이메일 주소와 구글의 app password를 사용하는 것이 보안에 큰 위협이 될 수 있을까요?

도와주세요 센세!

[codingapple]

터미널 에러메세지같은거 출력하는 부분이 있으면 출력해봅시다
https://stackoverflow.com/questions/65631481/nodemailer-in-vercel-not-sending-email-in-production
await 붙여보라는소리도 있군요

[김종휘]

건방지게 에러 메시지도 안 붙였다니 죄송합니다 센세.
말씀해주신 스택오버플로우 글대로 코드 수정 후 진행해봤지만 같은 에러 메시지 출력되었습니다.
참고하실 수 있도록 해당 문제 발생 코드와 함께 에러 로그 아래 덧붙였습니다.
Next 14버전 사용 중입니다.

// src/app/api/sendEmail/route.js
const transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
user: process.env.NODEMAILER_EMAIL, // 여기에 환경 변수 대신 하드코딩 하면 작동이 잘 됩니다.
pass: process.env.NODEMAILER_PW, // 여기에 환경 변수 대신 하드코딩 하면 작동이 잘 됩니다.
 },
 })

try {
await transporter.sendMail({
from: process.env.NODEMAILER_EMAIL, // 여기에 환경 변수 대신 하드코딩 하면 작동이 잘 됩니다.
to: process.env.NODEMAILER_EMAIL, // 여기에 환경 변수 대신 하드코딩 하면 작동이 잘 됩니다.
subject: `${name}님께로부터 견적 신청서가 도착했습니다.`,
html: generateEmailHtml(),
 })

return NextResponse.json(
 { message: 'Email was successfully sent.' },
 { status: 200 }
 )
 } catch (error) {
console.error('이메일 전송 중 오류 발생:', error)
return NextResponse.json(
 { error: 'Internal Server Error' },
 { status: 500 }
 )
 }
}

//src/app/quote/page.js

const handleSubmit = async (e) => {
e.preventDefault()

const formData = new FormData(e.currentTarget)

formData.append('items', JSON.stringify(items))

try {
const response = await fetch('/api/sendEmail', {
method: 'POST',
body: formData,
 })

if (response.ok) {
alert('견적 신청이 성공적으로 제출되었습니다.')
resetForm()
 } else {
alert('견적 신청을 제출하는 중 오류가 발생했습니다.')
 }
 } catch (error) {
console.error('견적 신청 중 오류 발생:', error)
alert('견적 신청을 제출하는 중 오류가 발생했습니다.')
 }
 }

//Vercel Log

이메일 전송 중 오류 발생: Error: Invalid login: 535-5.7.8 Username and Password not accepted. For more information, go to

535 5.7.8  https://support.google.com/mail/?p=BadCredentials o12-20020a05620a110c00b0078560085d6bsm668700qkk.100 - gsmtp

    at h._formatError (/var/task/.next/server/chunks/340.js:1:180205)

    at h._actionAUTHComplete (/var/task/.next/server/chunks/340.js:1:191187)

    at h.<anonymous> (/var/task/.next/server/chunks/340.js:1:176702)

    at h._processResponse (/var/task/.next/server/chunks/340.js:1:182453)

    at h._onData (/var/task/.next/server/chunks/340.js:1:179897)

    at TLSSocket._onSocketData (/var/task/.next/server/chunks/340.js:1:171454)

    at TLSSocket.emit (node:events:517:28)

    at addChunk (node:internal/streams/readable:368:12)

    at readableAddChunk (node:internal/streams/readable:341:9)

    at Readable.push (node:internal/streams/readable:278:10) {

  code: 'EAUTH',

  response: '535-5.7.8 Username and Password not accepted. For more information, go to\n' +

    '535 5.7.8  https://support.google.com/mail/?p=BadCredentials o12-20020a05620a110c00b0078560085d6bsm668700qkk.100 - gsmtp',

  responseCode: 535,

  command: 'AUTH PLAIN'

}

[codingapple]

환경변수 이상하게 적용되는게 원인같은데 vercel에다가 문의해야할거같기도 합니다

[글쓴이]

글