Безопасность использования локального хранилища для HTML Angular 2 Project

Question

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

Я работаю над бизнес-приложением, где после регистрации я получаю основную информацию о пользователе, такую ​​как компания, адрес электронной почты, имя ... и т. Д.

Упрощенно пу Databse (firebase) структуры данных выглядит что-то вроде

-company1 
    -filed1 
     -data1 
    -filed2 
     -data1 
-company2 
    -field1 
     data1 

Вот как я это делаю в данный момент без локального хранения данных (проблемы с упомянуто)

1. Пользователь открывает сайт для входа в систему, приложение отправляется в firebase для входа пользователя в систему и поиска данных пользователя, чтобы сохранить его в переменной
2. Каждый раз, когда пользователь хочет сделать запрос, я использую эту переменную и нахожу информацию, такую ​​как компания имя (для этого примера). Затем я рассказываю, что firebase ищет путь, основанный на этом названии компании (company1).

Все это работает нормально. Однако проблема заключается в том, что при запуске нет пользователя, поэтому весь мой AuthGuard не удастся, в результате чего пользователь будет перенаправлен обратно на страницу входа. Представьте, что если пользователь вошел в систему, а затем нажата кнопка обновления, это приведет к обратному возврату на страницу входа, потому что нет пользователя, пока firebase не вернет некоторые данные.

// Auth guard 
canActivate() { 
    if (!this.userService.getCurrentUser()) { 
     return false 
    } 
    return true 
} 

getCurrentUser(): User { 
    return this.currentUser 
} 

const APP_ROUTE: Routes = [ 
    { path: '', redirectTo: '/login', pathMatch: 'full' }, 
    { path: 'login', component: LoginComponent }, 
    { path: 'register', component: RegisterComponent }, 
    { path: 'somePath', component: SomeComponent, canActivate: [AuthGuard] }, 
    { path: 'somePath2', component: SomeOtherComponent, canActivate: [AuthGuard] }, 
    { path: '**', redirectTo: '/login' }, 
] 

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

Есть ли способ безопасного хранения данных на локальном без моего беспокойства?

Answer 1

Использование TypeScript, который является в основном JavaScript, является проблематичным в способах безопасности, поскольку JavaScript является интерпретированным языком, и пользователь имеет доступ ко всему вашему клиентскому коду.

По этой причине решения, такие как шифрование на стороне клиента, не будут работать, поскольку вам понадобятся данные в какой-то момент, а это значит, что ваш клиент будет иметь код для расшифровки файлов, что делает этот код доступным для злоумышленника ,

Прочтите this article, он идет дальше в эту проблему и предлагает несколько вариантов, которые могут вам помочь.

Answer 2

Firebase имеет встроенную модель безопасности, с помощью которой вы можете определить пользовательские уровни доступа к узлам в вашей базе данных. Это поддерживается JWT, который опирается на подписанный сервером токен, который кодирует разрешения пользователя. Если токен подделан или изменен, все это становится недействительным. Поэтому, если вы правильно реализуете свою безопасность на стороне Firebase, пользователь, изменяющий данные локального хранилища, вообще не имеет значения.