PERN - 07 clipdrop API 연동 / 인공지능 이미지생성, 자동 이미지 사진 제거, 이미지 편집 서비스 / 데이터 저장 cloudinary

PERN - 07 clipdrop 이미지 AI 연동 / 자동 이미지 사진 제거, 이미지 생성, 이미지 편집

​

사진, 이미지 작업을 하는 관련자들은 요즘 인공지능, 자동화 도구를 주로 사용하고 있습니다.

이 기능을 서비스하는 웹서비스가 있고, 이를 연동한 서비스를 생성할수도 있는데요.

​

이번 시간에는 이미지 편집을 자동, 간편하게 할수 있는 Clipdrop!

클립드롭!

clipdrop api를 사용하여 웹서비스에 적용하는 방법을 기록으로 남겨봅니다.

​

---

​

​

기장먼저 클립드롭 공식웹사이트에 접속합니다.

https://clipdrop.co/apis

Clipdrop APIs · All Clipdrop Apis documentation and experiments

접속후 상단 표시줄에 있는 "Doc" 항목을 선택하여

공식문서를 확인합니다.

Text to image

생성하고싶은 사진, 이미지에 대한 글 또는 프롬프트를 입력하고,

이에 따른 이미지를 생성하는 툴의 api를 이용하는 것을 적용해봅니다.

화면 스크롤을 아래로 내리면 cliptdrop 클립드롭 기능을 적용할수 있는 소스들을 볼수 있습니다.

사용하는 프로그래밍 언어에 맞는 탭을 선택합니다.

​

소스를 맞게 적용합니다.

변형을 해서 적용을 했습니다.

이어서, 이 기능을 사용하기위한 API KEY를 발급받아야합니다.

https://clipdrop.co/apis/signin

 

Clipdrop APIs · All Clipdrop Apis documentation and experiments

Sign up / sign in Email Sign up / sign in

clipdrop.co

clipdrop에 가입 또는 로그인을 합니다.

이메일 주소만 입력하면 가능하지요.

이메일 입력 후, 파란 버튼을 선택하면, 이메일 받은 편지함을 확인하여 메일 확인하면 됩니다.

가입 확인을 위해 링크를 선택합니다.

그러면 해당 clipdrop 프로필 페이지로 접속이 됩니다.

reveal api key 버튼을 선택하여 api 키를 발급받습니다.

 

 

.env 파일에 키와 값을 넣습니다.

​

---

-

---

​

이어서 이미지 파일 저장 및 읽기를 할 서비스를 적용해야합니다.

사용할 서비스는 cloudinary 입니다.

​

클라우드데이터베이스에 저장을 위해 클라우디나리 웹사이트에 접속합니다.

https://cloudinary.com/

Image and Video Upload, Storage, Optimization and CDN

회원가입/로그인을 합니다.

프로젝트내 api key를 생성합니다.

이어서 서버의 .env 파일에 키와 값을 넣어줍니다.

이어서 config/ 내 파일을 생성합니다.

클라우디너리와 관련된 소스를 작성합니다.

​

관련된 소스를 작성합니다.

​

그리고 테스트하면 끝!

​

//

$ npm install pdf-parse