Я создаю одностраничное приложение.
На стороне клиента я использую Nuxt.js (включая Vue.js и Vuex ).
Для отправки и получения данных на сервер я использую axios .
API был построен с использованием Django REST framework .
У меня есть следующий сценарий:
Если пользователь хочет зарегистрироваться, он начинает с Page 1 .
Здесь у него есть возможность загрузить фотографию профиля. Как только он выберет картинку, она автоматически загрузится в корзину S3.
Во время или после загрузки он может заполнить другие поля Имя и Фамилия .
Все эти поля временно сохраняются в хранилище Vuex, что означает, что если пользователь перезагрузит страницу, данные исчезнут.
Если он нажмет на Следующая страница , он перейдет на другую страницу (другой URL-адрес; перезагрузка страницы не будет -> Одностраничное приложение), где он сможет ввести оставшиеся данные.
После нажатия на кнопку Создать учетную запись запись создается в базе данных.
Теперь к моему вопросу ... Как мне обработать загрузку изображения?
Как уже было сказано, картинка должна быть загружена сразу после выбора, а не только при нажатии на кнопку Создать аккаунт .
В какой-то момент мне нужно создать связь между изображением и учетной записью.
До сих пор я придумал следующее решение. Следующая модель ER представляет мои таблицы базы данных.
Если пользователь выбирает изображение на Страница 1 , оно немедленно загружается в корзину S3 и создается запись в таблице изображений.
API возвращает идентификатор этой записи изображения. Я сохраняю этот идентификатор во временном хранилище Vuex, чтобы использовать его на 1066 * для отправки его в конечную точку API, которая отвечает за создание учетной записи.
Проблема в том, что Vuex Store не является «безопасным», поскольку опытный пользователь может легко редактировать значения через консоль. Чтобы он мог изменить идентификатор записи изображения на запись, которую он вообще не создавал.
Кто-нибудь знает, как решить что-то подобное или вообще, если этот подход распространен для обработки загрузки изображений перед созданием учетной записи?
(я уже видел эту ситуацию на многих страницах, но я не знаю, как они это решили)