Figma 플러그인, CORS 문제 해결하고 안전하게 API 연결하기

by DD
5개월 전
조회수 12

Figma 플러그인 개발 중 CORS 에러 발생, HTTPS프록시 서버 구축 필요

기존 인프라 활용, Docker 기반 NestJS 프록시 서버 구축 및 배포 자동화

게스트 전용, GET-only 정책 등 5가지 보안 원칙을 적용하여 안전성 확보

CORS 문제와 프록시 서버의 역할

Figma 플러그인에서 CORS 에러는 외부 API 직접 호출을 막아 개발을 방해한다. 프록시 서버는 이러한 문제를 해결하기 위해 HTTPS를 통해 안전하게 API 요청을 중계한다. 따라서, CORS 정책 우회보안 강화를 동시에 달성하여 플러그인 개발을 가능하게 한다.

안전한 프록시 서버 구축을 위한 5가지 원칙

프록시 서버는 게스트 전용, GET-only 정책을 통해 데이터 접근 권한을 최소화한다. 서비스 화이트리스트응답 최소화를 적용하여 내부 정보 노출을 방지한다. 결과적으로, Docker 기반 배포를 통해 안정적인 운영 환경을 구축하여 보안과 편의성을 모두 확보한다.

실전 적용 가이드: 기존 인프라 활용 전략

새로운 인프라 구축 대신 기존 CMS 인스턴스를 활용하여 비용 절감배포 시간 단축을 달성한다. Docker 컨테이너를 사용하여 환경 일관성을 유지하고, CodeDeploy를 통해 자동 배포 파이프라인을 구축한다. 따라서, SRE팀과의 협업을 통해 효율적인 인프라 운영이 가능하다.

여기쏙 — Figma plugin 제작기 : 1. 프록시 서버