📮 ObjectStorage에 Image 저장 API 연동

[heejinnn]

작업 이유

왜 ObjectStorage 사용?

❗️DB에 저장하는 것과 차이점

1. 데이터 유형:

데이터베이스: 주로 구조화된 데이터를 저장하는 데 사용, 테이블과 열의 형태로 저장
Object Storage: 비정형 데이터 (이미지, 동영상, 문서 등)를 저장하는 데 효과적, 파일 자체와 메타데이터를 함께 저장

2. 용량 및 확장성:

데이터베이스: 주로 정형 데이터를 다루므로, 스키마 및 테이블 구조를 정의해야 한다. 확장성이 있지만 일정 규모 이상의 데이터에 대한 확장이 복잡할 수 있다.
Object Storage: 대용량의 데이터를 효과적으로 다룰 수 있으며, 분산 아키텍처를 활용하여 쉽게 확장할 수 있다.

3. 접근성:

데이터베이스: 구조화된 쿼리 언어(SQL)를 사용하여 데이터에 접근
Object Storage: 주로 RESTful API를 통해 데이터에 접근하며, 간단한 HTTP 요청으로 데이터를 가져오거나 저장할 수 있다.

4. 비용 구조:

데이터베이스: 대부분의 경우 데이터 양에 따른 비용이 존재하며, 쿼리 수행에 따라 비용이 발생할 수 있다.
Object Storage: 주로 저장된 데이터의 양과 전송된 데이터 양에 따라 비용이 발생한다. 사용한 용량만큼만 비용을 지불하므로 예측 가능

정리하자면, ObjectStorage는 RESTful API를 통해 편리한 데이터 접근과 큰 데이터를 효과적으로 저장할 수 있다는 점, 그리고 비정형 데이터를 저장하는 데 효과적이므로 ObjectStorage에 Image를 저장하기로 하였다.

작업 사항

1. presignedUrl 발급

presignedUrl에 POST 요청을 보내면 payload 값을 받을 수 있다.
payload는 {api}/{dirname}/uuid.{extension}?{queryitem} 와 같은 형식으로 dirname과 extension 그리고 ?뒤에 queryItem들을 받아온다.

받아온 payload를 바로 사용하지않고 queryitem과 분리하여 저장한다.
?앞까지 url을 PAYLOADURL.PAYLOAD에 저장하고 나머지 queryitem들을 PAYLOADURL의 요소들에 저장해준다.

 //presignedURL 발급 받기
AlamofireManager.shared.presignedURL("profile", "jpeg") { result in
    switch result {
    case .success(let data):
        // Handle success
        if let responseData = data {
            do {
                let jsonObject = try JSONSerialization.jsonObject(with: responseData, options: []) as? [String: Any]

                if let payloadValue = jsonObject?["payload"] as? String,
                   let payloadURL = URL(string: payloadValue),
                   let components = URLComponents(url: payloadURL, resolvingAgainstBaseURL: false),
                   let queryItems = components.queryItems {

                    //'?'전까지 payload 설정
                    if let range = payloadValue.range(of: "?") {
                        PAYLOADURL.PAYLOAD = String(payloadValue[..<range.lowerBound])
                    } else {
                        PAYLOADURL.PAYLOAD = payloadValue
                    }

                    // query item을 PATLOADURL에 저장
                    PAYLOADURL.algorithm = queryItems[0].value ?? ""
                    PAYLOADURL.credential = queryItems[1].value ?? ""
                    PAYLOADURL.date = queryItems[2].value ?? ""
                    PAYLOADURL.expires = queryItems[3].value ?? ""
                    PAYLOADURL.signature = queryItems[4].value ?? ""
                    PAYLOADURL.signedHeaders = queryItems[5].value ?? ""
                    PAYLOADURL.acl = queryItems[6].value ?? ""

                    print("JSON Object: \(jsonObject ?? [:])")
                    print(PAYLOADURL.PAYLOAD)
                } else {
                    print("Payload key not found in the JSON response.")
                }
            } catch {
                print("Error parsing JSON: \(error)")
            }
        }
    case .failure(let error):
        // Handle failure
        print("Error: \(error)")
    }
}

아래의 두 쿼리문도 api 넣어서 보내주고 dirname과 extension 값은 body에 넣어서 POST 요청을 보낸다.

URLQueryItem(name: "result", value: "true"),
URLQueryItem(name: "blocking", value: "true")

2. ObjectStorage Image 저장

PAYLOADURL에 저장된 queryItem들을 가져와 put요청을 보내는 url에 query문을 삽입해준다.
query문을 이런 식으로 따로 저장해서 queryitem으로 추가해서 보내지 않으면 오류가 난다....

//objectStorage Image 저장
            AlamofireManager.shared.uploadImage(pickedImage) { result in
               switch result {
               case .success(let data):
                   // Handle success
                   if let unwrappedData = data,
                      let resultString = String(data: unwrappedData, encoding: .utf8) {
                       print("Success: \(resultString)")
                   } else {
                       print("Success with nil or non-text data")
                   }

               case .failure(let error):
                   // Handle failure
                   print("Error: \(error)")
               }
           }

다음과 같이 queryitem들을 url에 삽입해줬다.

 case .uploadImage(let image):
            request = createURLRequestForBody(url: baseURL, image: image)
            // Add X-Amz-Algorithm query parameter
            var components = URLComponents(url: baseURL, resolvingAgainstBaseURL: false)
            components?.queryItems =
                [URLQueryItem(name: "X-Amz-Algorithm", value: PAYLOADURL.algorithm),
                 URLQueryItem(name: "X-Amz-Credential", value: PAYLOADURL.credential),
                 URLQueryItem(name: "X-Amz-Date", value: PAYLOADURL.date),
                 URLQueryItem(name: "X-Amz-Expires", value: PAYLOADURL.expires),
                 URLQueryItem(name: "X-Amz-Signature", value: PAYLOADURL.signature),
                 URLQueryItem(name: "X-Amz-SignedHeaders", value: PAYLOADURL.signedHeaders),
                 URLQueryItem(name: "x-amz-acl", value: PAYLOADURL.acl)
                ]

            if let urlWithQuery = components?.url {
                request.url = urlWithQuery
                
                print("requestURL: \(request.url)")
            }

image는 body에 넣어 query 파라미터 삽입한 url에 PUT 요청을 보냈다.

이슈 연결

close #31

[psychology50]

전에 iOS 로그 알려드린 거 잘 쓰고 계시네요. 다만 디버깅 용으로 print를 쓰셔서 혼용 중인 상태인 거 같은데, 이것도 지우시거나 log로 바꾸는 게 좋을 듯 합니다.
지금은 Alamofire의 Session.default를 사용하고 계시지만, 나중에는 커스텀 기능을 구현하는 게 편해지는 시점이 올 거예요. 그때라도 Interceptor를 적용해보시는 걸 권해봅니다. 저도 도와드릴게요.
작업하시느라 수고 많으셨습니다.

[psychology50]

url을 받아서 쿼리로 분리해야 할 일이 많을지는 잘 모르겠지만, 만약 그럴 일이 있을 수 있다면 QueryParameter보다는 ObjStorageQueryParam..? 같은 게 더 나을 거 같아요.

[psychology50]

presigned url도 이번에는 /photo 하위 디렉토리에 대한 내용이지만, 저흰 profile이나 pet-profile도 있다는 점을 생각해서 문자열을 /obj까지만 지정하거나, 다른 변수명을 선택하는 게 좋을 듯 합니다.