프로그래밍/NextJS

nextjs aws를 이용한 이미지 업로드

타코코딩 2023. 12. 14. 01:07

가입 후 s3라는 서비스에 접속

버킷을 만든다

버킷리스트는 누구와도 겹치지 않는 고유아이디 같은 개념이기 때문에 유니크하게 만들고 모든 퍼블릭액세스 차단은 해제시켜준다

만들어졌으면 권한에 가서 버킷정책과 cors를 설정해 준다

 

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "1",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::방금만든버킷이름/*"
        },
        {
            "Sid": "2",
            "Effect": "Allow",
            "Principal": {
                "AWS": "arn:aws:iam:AWSID:root" //awsid는 우측 내 id를 드롭다운하면 복사할수있음
            },
            "Action": [
                "s3:PutObject",
                "s3:DeleteObject"
            ],
            "Resource": "arn:aws:s3:::방금만든버킷이름/*"
        }
    ]
}

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "PUT",
            "POST"
        ],
        "AllowedOrigins": [
            "*"   //개발중이라 *지만 호스팅할땐 서비스하는 url로 바꾸면됨!
        ],
        "ExposeHeaders": [
            "ETag"
        ]
    }
]

다했으면 우측상단 보안자격증명 눌러서 액세스키 발급하면 됨. 요금폭탄 맞기 싫으면 유출 안되게 조심해야 한다

 

https://codingapple.com/course/next-js/

 

Next.js로 웹서비스 만들기 - 코딩애플 온라인 강좌

  누구나 마음 한켠엔 나만의 웹서비스를 만들고 싶어합니다. 프론트엔드는 어찌저찌 하겠는데 서버 만드는게 어렵고 귀찮다고요? 그렇다면 Firebase를 쓰십시오.   구글이 웹서버를 대신 만들어

codingapple.com