supabase storage를 사용하여 프로필 사진, 게시물 이미지 등을 연동할때 사용하는 policy
아무 정책없이 열어두면 악의적인 공격을 통해 타인의 프로필 이미지 변경, 적절치 못한 행동을 할 수 있으므로 해당 정책들을 사용하여 기본적인 방어책을 세워야합니다.
-- 1. 읽기 권한: 누구나 프로필 이미지를 볼 수 있도록 허용
create policy "Allow public read access to avatars"
on storage.objects for select
using ( bucket_id = 'profile' );
-- 2. 업로드 권한: 인증된 사용자만 자신의 폴더에 파일을 올릴 수 있음
-- (파일 경로가 '유저UUID/파일명' 형태일 때 안전합니다)
create policy "Allow authenticated users to upload to their own folder"
on storage.objects for insert
with check (
bucket_id = 'profile'
and auth.role() = 'authenticated'
and (storage.foldername(name))[1] = auth.uid()::text
);
-- 3. 수정 권한: 자신의 파일만 덮어쓰거나 수정할 수 있음
create policy "Allow users to update their own avatar"
on storage.objects for update
using (
bucket_id = 'profile'
and auth.role() = 'authenticated'
and (storage.foldername(name))[1] = auth.uid()::text
);
-- 4. 삭제 권한: 자신의 파일만 삭제할 수 있음
create policy "Allow users to delete their own avatar"
on storage.objects for delete
using (
bucket_id = 'profile'
and auth.role() = 'authenticated'
and (storage.foldername(name))[1] = auth.uid()::text
);
만약 직접 해당 코드로 부여하는것이 아닌 supabase의 dashboard로 가서 이용한다면
policy name에 각 이름을 그리고 "Allowed operation"을 각각 SELECT, INSERT, UPDATE, DELETE를 적절히 체크하고 "Target roles"를 SELECT는 "anon, authenticated"를 나머지는 모두 "authenticated"만 체크 한뒤
1. Allow public read access to avatars, SELECT, (anon, authenticated) - 설정값 참고, 아래 코드만 복붙
bucket_id = 'profile'
2. Allow authenticated users to upload to their own folder, INSERT, (authenticated)
bucket_id = 'profile' AND (storage.foldername(name))[1] = auth.uid()::text
3. Allow users to update their own avatar, UPDATE, (authenticated)
bucket_id = 'profile' AND (storage.foldername(name))[1] = auth.uid()::text
4. Allow users to delete their own avatar, DELETE, (authenticated)
bucket_id = 'profile' AND (storage.foldername(name))[1] = auth.uid()::text
다음과 같이 설정하면 됩니다.
이렇게 설정이 되면 각 역할에 맞는 조건일때만 supabase의 storage의 리소스를 접근, 제어할 수 있습니다.
supabase를 사용할땐 보통 프론트단에서 바로 supabase 내의 데이터들을 호출하고 사용하기때문에 RLS를 유의하여 사용해야합니다.
반응형
'공부하는 중~~ > 웹' 카테고리의 다른 글
| [WEB] 옵셔널 체이닝 (?.), null (??) 병합 연산자 이게 뭐지? (0) | 2023.02.15 |
|---|---|
| [WEB] NVM을 이용한 node 버전 관리 (Window, Mac) (0) | 2022.06.28 |
| [JavaScript] ECMA6, normal function vs Arrow function 비교 (0) | 2021.01.28 |
| [JavaScript] ==와 ===의 차이 (0) | 2021.01.13 |
| [React] Props vs State, Class component vs Functional component 비교하기 (0) | 2021.01.12 |
댓글