[Next.js] cloudinary setting

이동명·2025년 3월 7일
0

NEXT.js

목록 보기
5/8
post-thumbnail

이미지를 업로드 및 다운로드 할 수 있는 스토리지중 하나인 cloudinary 셋팅법을 기록해두겠습니다.
이미지를 업데이트하면 secure_url을 return 합니다.

npm i cloudinary

cloudinary.js

import { v2 as cloudinary } from 'cloudinary';

if (!process.env.CLOUDINARY_CLOUD_NAME) {
    throw new Error('CLOUDINARY_CLOUD_NAME is not set');
}

if (!process.env.CLOUDINARY_API_KEY) {
    throw new Error('CLOUDINARY_API_KEY is not set');
}

if (!process.env.CLOUDINARY_API_SECRET) {
    throw new Error('CLOUDINARY_API_SECRET is not set');
}

cloudinary.config({
    cloud_name: process.env.CLOUDINARY_CLOUD_NAME,
    api_key: process.env.CLOUDINARY_API_KEY,
    api_secret: process.env.CLOUDINARY_API_SECRET,
});

export async function uploadImage(image) {
    const imageData = await image.arrayBuffer();
    const mime = image.type;
    const encoding = 'base64';
    const base64Data = Buffer.from(imageData).toString('base64');
    const fileUri = 'data:' + mime + ';' + encoding + ',' + base64Data;
    const result = await cloudinary.uploader.upload(fileUri, {
        folder: 'nextjs-course-mutations',
    });
    return result.secure_url;
}

https://github.com/dongmyoungLee/NextCloudinary

profile
Web Developer

0개의 댓글