html - 将本地存储用于 HTML Angular 2 项目的安全性

标签 html angular typescript firebase-realtime-database local-storage

我担心如果我使用本地存储来存储用户信息,黑客可能会进入开发人员的控制台/应用程序/本地存储以更改数据(例如公司名称)并开始从其他公司的数据库中获取数据。这里有更多细节

我正在开发一款商业应用程序,注册后我会收到基本的用户信息,例如公司、电子邮件、姓名...等。

ny 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' },
]

我能想到的最简单的修复方法是创建一个本地存储来存储使用过的信息,并在需要时将其 checkin 。 但是,我担心使用这种方法,用户可能会进入本地存储,例如,将公司更改为 2,这将允许访问其他公司的数据

有没有一种方法可以安全地将数据存储在本地存储中而无需我担心?

最佳答案

使用 TypeScript(基本上是 JavaScript)在安全方面存在问题,因为 JavaScript 是一种解释型语言,并且用户可以访问您的全部客户端代码。

出于这个原因,客户端加密等解决方案将不起作用,因为您在某些时候会需要数据,这意味着您的客户端将拥有用于解密文件的代码,从而使恶意用户可以使用此代码。

阅读this article ,它进一步探讨了这个问题,并提出了几个可能对您有帮助的选项。

关于html - 将本地存储用于 HTML Angular 2 项目的安全性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42228910/

相关文章:

javascript - JQuery width() 返回错误值?

javascript - Asp.NET MVC 中的模态

javascript - 将嵌入的内容传递给嵌套列表的孙组件

javascript - Angular 2.1.0 动态创建子组件

javascript - Reactjs - 类型错误 : Failed to execute 'fetch' on 'Window' : Failed to parse URL from ***. **.*.***:2000

html - 段落不使用左边距移动

html - box-shadow 不遵循 z-index 顺序

angular - 在 Angular 中导入 JS 库

reactjs - TypeScript:将函数参数值限制为动态变量中的数组值

typescript - 如何将额外的参数传递给 TypeScript 中的属性装饰器?