데이터베이스에 계정에 대한 항목을 만들기 전에 이미지 업로드를 처리하는 방법은 무엇입니까?

데이터베이스에 계정에 대한 항목을 만들기 전에 이미지 업로드를 처리하는 방법은 무엇입니까?

저는 단일 페이지 애플리케이션을 만들고 있습니다.

클라이언트 측에서는 Nuxt.js(Vue.js 및 Vuex 포함)를 사용하고 있습니다.

서버에 데이터를 보내고 받기 위해 저는 axios를 사용합니다.

API는 장고 REST 프레임워크로 구축되었습니다.

다음과 같은 시나리오가 있습니다.

---

---

사용자가 등록을 원하는 경우, 1페이지에서 시작합니다.여기서 그는 프로필 사진을 업로드할 수 있습니다.사진을 선택하는 즉시 S3 버킷에 자동으로 업로드됩니다.

업로드 도중 또는 업로드 후에 다른 필드에 이름과 성을 입력할 수 있습니다.이러한 모든 필드는 Vuex 저장소에 일시적으로 저장되므로 사용자가 페이지를 다시 로드하면 데이터가 손실됩니다.

다음 페이지를 클릭하면 다른 페이지(다른 URL; 페이지 다시 로드 없음 -> 단일 페이지 응용 프로그램)로 이동하여 나머지 데이터를 입력할 수 있습니다.

Create Account 버튼을 클릭하면 항목이 데이터베이스에 작성됩니다.

이제 질문을 드리자면...이미지 업로드는 어떻게 처리해야 합니까?이미 말했듯이 사진은 계정 만들기 버튼을 클릭할 때뿐만 아니라 선택 후 바로 업로드해야 합니다.

어느 시점에서 이미지와 계정 간의 관계를 만들어야 합니다.

지금까지 저는 다음과 같은 해결책을 생각해냈습니다.다음 ER 모델은 데이터베이스 테이블을 나타냅니다.

---

---

사용자가 1페이지에서 이미지를 선택하면 즉시 S3 버킷에 업로드되고 이미지 테이블에 항목이 생성됩니다.

API가 이 이미지 항목의 ID를 반환합니다.저는 이 ID를 임시 Vuex Store에 저장하여 2페이지에서 계정 생성을 담당하는 API Endpoint로 보낼 수 있습니다.

문제는 숙련된 사용자가 콘솔을 통해 값을 쉽게 편집할 수 있기 때문에 Vuex Store가 "보안" 상태가 아니라는 점입니다.그래서 그는 이미지 항목의 ID를 자신이 전혀 만들지 않은 항목으로 변경할 수 있었습니다.

계정을 만들기 전에 이미지 업로드를 처리하는 것이 일반적인 접근 방식인지 아니면 일반적으로 이런 문제를 해결하는 방법을 아는 사람이 있습니까?

(이미 많은 페이지에서 이 상황을 보았지만 어떻게 해결했는지 모르겠습니다.)

가장 좋은 방법은 다른 고유 필드를 추가하고 다음과 같은 것을 사용하는 것입니다.uuid그리고 적어도 등록이나 ID를 받아들이는 것이 충분히 안전하지 않은 곳이라면 ID 대신에 그것을 사용합니다.아니면 일시적인 슬러그 같은 것들은 공개적으로 접근하거나 쉽게 추측할 수 없습니다.

또한 소유자가 없는 이미지를 필터링하여 안전하지 않은 이러한 ID를 수락할 수 있지만 정확한 시간에 소유자가 없는 다른 ID를 얻을 가능성은 매우 낮습니다.(소유자가 없는 영상을 정기적으로 지우는 경우 OFC)

또한 사용자가 2페이지에서 중지되어 소유자가 없는 이미지(추가 공간)를 갖게 될 수도 있다는 사실에 대해 우려해야 합니다.이미지 테이블에 관계가 있는 경우 24시간마다 실행하는 작업을 추가하고 소유자가 없거나 X분이 지난 이미지를 생성 등에서 제거할 수 있습니다.

기본적으로 단일 양식을 별도의 단계로 분리해야 할 때마다 청소 기능을 추가하게 됩니다.

언급URL : https://stackoverflow.com/questions/55305638/how-to-handle-an-image-upload-before-creating-the-entry-for-the-account-in-the-d