friends S3업로드 수정, 프론트에서 받아오기

오늘 s3작업을 하는데 이상하게 읽기권한이 안된다. 또한s3 버킷에서 정책생성을 하려는데도 안된다....

파일을 모드 읽기로 가져와야 프론트에서 읽을수 있는데.. 이게 안돼서 엄청 고생을 한 거 같다.

결국 해결법은 백엔드 에서 저장할때 있었따!

ACL= "public-read",

이것이 들어가야 된다!! 또한 s3업로드 방식도 조금 바뀌었다.

s3= boto3.client(
            's3',
            aws_access_key_id=AWS_ACCESS_KEY_ID,
            aws_secret_access_key=AWS_SECRET_ACCESS_KEY,
            )
            file = request.FILES['postimg']
            date = (datetime.datetime.now().strftime('%Y-%m-%d-%H-%M-%S'))
            s3.put_object(
                    ACL= "public-read",
                    Bucket = "bucketfriends",
                    Body =file,
                    Key = date,
                    # ContentType = file.content_type,
                    ContentType = file.content_type,
                )

차이점이라면 put 으로 올려주고, 앞에 데이터들을 명시해준다.

aws 가 처음보면 뭔가 어려운데 이제는 조금씩 눈에 보이는 것 같다. 계속 연습해서 하다보면

적응 될 것 같다!

프론트에서 받아오기

프론트에서 Response 에 데이터를 실어보내줬는데 어떻게 받아오는지 작업을 했었다. 이것도 시간이 조금은 걸린 것 같지만.

우선 Respons 에 넣어주면 .then() 안에 담겨서 넘어게 된다 구글링 해본 결과 여기서의 로직은 then 안에서만 해결해야 한다고 한

다 그래서 이걸 async awiat 으로 처리 할 수 있다는데 일단은 간단한 로직이라 then 안에서 해결을 했다.

       .then(date=>{
            let event = document.getElementById("event_div")
            event.innerHTML = `<img src="https://bucketfriends.s3.ap-northeast-2.amazonaws.com/${date}"/>`;
        })

date 라는 변수로 s3 에 업로드한 파일명을 받아온다 날짜 순으로 저장을 하였다.
inerHTML 을 통해서 그려주기만 하면 끝!

생각 보다 단순한데 역시 처음에 하기는 조금 어렵고 많이 헤메는 것 같다.

그외에도 프론트 작업들을 진행하였다. 이번 프로젝트는 뭔가 여유로운 것 같은데 이럴수록

좀더 집요하게 코드를 짜보는 연습을 해보고, 디테일하게 작업 하는 연습을 하면 좋을 것 같다.