Как на странице конфиденциальной информации пользователя скрыть данные, оставив лишь последние несколько (цифр, букв)?

Question

[DevRev]

Есть поля с данными пользователя.
Например:
Номер телефона: (495) 333 33 33

А после сохранения данных (того же номера телефона) он должен выглядеть так:
Номер телефона: (495) *** ** 33
Как можно это реализовать в фронт-энде для подготовки среды бэк-энда?

Answer 1

[fetis26]

А какой смысл делать это на фронтенде во время заполнения формы? Вам ведь все равно придется хранить где-то номер целиком в браузере и желающий все равно его достанет. Можно конечно заморочиться с шифрованием, но это перебор уже

Comments

[DevRev]

Вы считаете что лучше заняться этим непосредственно при написании бэкэнда?

[fetis26]

DevRev: Естественно, прятать нужно на бекенде. Сохранили форму, перезагрузили страницу с обфусцированными данными.

[napa3um]

fetis26: возможно, автору вопроса нужна защита не от хакеров, а защита от "взгляда из-за плеча", тогда вполне резонно делать это на фронтенде.

[fetis26]

napa3um: ну тогда для этого можно везде поле password воткнуть :)

[napa3um]

fetis26: может и можно. На тостере полно вопросов, никак не описывающих ни прикладную задачу, ни стек используемых в разработке технологий, ни собственную компетенцию (т.е., никак не локализуют проблему, с которой столкнулся автор). На такие вопросы можно отвечать бесконечно и как угодно - к любому ответу можно придумать контекст, в котором он будет адекватным.

[napa3um]

(...ни минимального исследования вопроса в интернете - 90% ответов на тостере можно было бы заменить ссылкой на стековерфлоу.)

[fetis26]

napa3um: ох, давайте не будем о грустном

[DevRev]

napa3um: Именно это мне и нужно

[napa3um]

DevRev: тогда после ввода телефона превращайте поле в read-only и заменяйте текст телефона на текст с частично заменёнными цифрами на звёздочки.

[DevRev]

napa3um: Да, видать только такой вариант и остается использовать. Я думал что есть еще другие методы. Спасибо за ответ!

[fetis26]

DevRev: Ох. мне очень не нравится эта идея с точки зрения UX. Невозможно оценить правильность данных, невозможно отредактировать (никакого рид-онли это 100%). Можно попробовать с масками поиграться. Какая у вас задача стоит?

[DevRev]

fetis26: Стоит следующая задача: Пользователь заходит в личный кабинет где в формах указывается ИНН, Номер паспорта, Номер телефона и т.д. Вся конфиденциальная информация скрывается таким образом: Номер телефона: (495) *** ** 33. Все скрывается звездочками кроме последних 2-3 цифр. При необходимости пользователь может редактировать данные (для этого существует кнопочка) при нажатии на которую поле превращается в textarea. После чего пользователь вводит новые данные, допустим тот же самый номер телефона (495) 333 33 44, и нажимает кнопку "Сохранить". Ну и собственно говоря после сохранения данные должны преобразоваться в такой формат: Номер телефона: (495) *** ** 44. Можно ли это реализовать с помощью js (пока что без серверной части)?

[fetis26]

DevRev: Можно реализовать и с помощью JS, но безопасность такого решения в общем случае ниже чем, скрывать их на сервере. Но я не вижу, что вы собираетесь где-то запрашивать пароль на редактирование, поэтому на самом деле без разницы где их скрывать.

Answer 2

[Никита Кравченко]

Во front-end ты никак не сделаешь, это необходимо реализовывать в back-end.