Angular访问中断控制指南：示例及预防

了解访问控制和授权的基础知识是任何受人尊敬的开发人员的必备技能之一。无论您是开发安全敏感应用程序的开发人员，还是想要扩展知识的安全爱好者，安全性都是使用现代网络的重要组成部分。

本文旨在探讨访问控制主题并帮助您提高确保平台足够安全的能力。

首先，我们将简要定义损坏的访问控制。然后，我们将通过示例说明损坏的访问控制是什么样子以及它针对的漏洞。最后，我们将提出一些缓解这些漏洞的方法。

在深入探讨这个主题之前，我们想强调的是，本文是专门为 Angular 开发人员撰写的。

话虽如此，您不必了解 Angular 即可从本文中受益。这些解释适用于任何技术，最终将帮助您更好地理解该主题。

最快的 Angular 介绍

现在，在开始之前，让我们先构建作为本文基础的 Angular 项目。别担心 – 这些说明非常简短。

首先，如果你还没有安装 Angular，那么让我们来安装它。为此，请在终端中运行以下命令。

npm install -g @angular/cli

完成后，使用终端上的以下命令创建项目脚手架。

ng new my-app

最后，让我们进入新创建的项目文件夹并运行以下命令来启动服务器。

ng serve

就这样。在浏览器中转到localhost:4200并查看您的劳动成果。

相当令人印象深刻，对吧？

什么是访问控制？

好的，那么首先什么是访问控制？

好吧，如果您已经看到了登录页面，那么您已经与访问控制的实现进行了交互。

访问控制，通常称为授权，是一组强制访问资源的机制和策略。

通常，一旦服务器通过身份验证机制确定了您的身份，它就会授予或限制您在系统中可以访问的资源。

此外，授权基础设施是用户跟踪和资源监控的支柱。

充分实施强大而安全的访问控制系统是一项复杂而棘手的任务。访问控制本质上与系统架构密切相关。

由于大多数平台的用户通常扮演多个角色，因此访问控制的复杂性可能会呈指数级增长。

开发强大的访问控制是一项艰巨的挑战，即使是经验丰富的工程师也难以应对。根据系统的规模和复杂性，适当的解决方案可能意味着实施简单的身份验证、第三方库，甚至两者兼而有之。

值得庆幸的是，JavaScript 和 Angular 拥有流行且强大的解决方案，例如auth0和JWT（JSON Web Tokens），等等。

什么是损坏的访问控制？

简而言之，破坏的访问控制包括可能影响您访问系统组件的威胁或漏洞。

访问控制被破坏可能会给您的系统带来灾难性的后果，因为它允许攻击者在您的平台上肆意妄为。因此，解决任何存在的漏洞至关重要。

访问控制漏洞

现在我们了解了访问控制中断的概念，让我们来讨论一下这些攻击的实际例子。

我们将重点关注不安全的 ID、路径遍历、文件权限漏洞和客户端缓存攻击。

不安全 ID 的漏洞

大多数存储数据的关系数据库都使用 ID 来识别资源。此外，现代网站使用某种形式的 ID 或索引来快速高效地检索数据。因此，如果您的网站允许用户为这些敏感资源输入他们的 ID，并且这些 ID 很容易猜到，那么您就很容易受到这种攻击。

让我们举例说明。

假设您有一个显示用户个人资料的个人资料页面部分。然后以下 URL 检索用户个人资料。

https://www.mywebsite.com/profile?id=123

但是，如果我手动更改查询字符串中的数字并且不存在活动访问控制，那么我就可以访问任何配置文件。

为了减轻这种脆弱性，我们必须在开发周期早期解决它。

首先，ID 不应容易被猜到。因此，您必须开发系统，使所有 ID（或至少属于敏感资源的 ID）都经过混淆且独一无二。您可以通过将全局唯一标识符（或GUID）实现为 ID 来实现这一点。

另一个可靠的解决方案将涉及每个请求的会话验证以及适当的访问控制。

路径遍历漏洞

路径遍历背后的想法是在未经授权的情况下浏览文件系统的目录树。

这意味着允许用户访问服务器文件系统中的资源的系统存在漏洞。

如果路径字符串可供修改且不存在验证，则此漏洞尤其危险。

为了说明，请看以下场景。

https://www.mywebsite.com/photos?file=user.png

在这种情况下，攻击者可以将user.png更改为../../etc/passwd并访问应用程序的数据。

为了减轻路径遍历攻击，您必须对用户输入进行适当的验证，并限制对应用程序外部的服务器目录的访问。

幸运的是，这方面的责任通常由服务器工程师承担。但是，如果您启用需要访问和修改服务器中的文件（如文件上传）的功能，请确保实施强大且经过测试的库。

文件权限漏洞

文件权限漏洞与服务器文件系统有关。

应用程序包含许多不应修改的配置文件和资源，在大多数情况下，用户无法读取或执行这些文件和资源。然而，如果没有适当的配置策略，攻击者就可以瞄准这些文件并控制整个平台。

为了说明这一点，这里有一个尝试访问不可读文件的示例。

https://www.mywebsite.com/photos?file=../../angular.json

解决文件权限漏洞需要对服务器配置和维护有广泛的了解。因此，我们建议您咨询服务器工程师并避免触碰任何东西。除非您绝对需要修改服务器权限以添加与文件操作相关的功能，否则请将此事留给服务器工程师。

客户端缓存漏洞

现在，您的某些客户端很可能与其他用户共享计算机。不幸的是，这是我们作为开发人员无法控制的情况，但它会导致客户端缓存等漏洞。

客户端缓存漏洞很难缓解，因为它们涉及攻击者利用会话凭证、缓存页面或存储在经过身份验证的客户端的浏览器中的数据。

要利用此类漏洞，攻击者需要物理访问受害者的计算机。一旦获得访问权限，足够有决心的攻击者就可以破坏用户数据。

对于客户端缓存，最有效的解决方案就是不在客户端上存储敏感的用户信息。但是，如果由于某些业务需求而必须这样做，请确保实施适当的 HTML 元标记和异步验证以确认显示的权限。

实施访问控制

许多因素都会使解决访问控制漏洞变得非常简单或极具挑战性。系统架构、平台复杂性和数据敏感性只是其中的一部分。

保护系统安全的第一步应该始终是实施适当的身份验证机制。

就安全性而言，实施auth0之类的解决方案将帮助您实现大部分目标。出于本文的目的，我们仅探讨如何实施基本的 auth0 登录。但是，如果您想要更多自定义功能，也可以探索 JWT 之类的解决方案。

首先，运行以下命令将 auth0 添加到您的 Angular 项目。

ng add @auth0/auth0-angular

现在，转到项目 src 文件夹内的app.module.ts文件并导入模块。您可以在此文件中指定域和客户端 ID。

import { NgModule } from '@angular/core';

import { BrowserModule } from '@angular/platform-browser';



import { AppRoutingModule } from './app-routing.module';

import { AppComponent } from './app.component';

import { HomeComponent } from './home/home.component';



// Import the module from the SDK

import { AuthModule } from '@auth0/auth0-angular';



@NgModule({

  declarations: [

    AppComponent,

    HomeComponent

  ],

  imports: [

    BrowserModule,

    AppRoutingModule,



    // Import the module into the application, with configuration

    AuthModule.forRoot({

      domain: 'YOUR_AUTH0_DOMAIN',

      clientId: 'YOUR_AUTH0_CLIENT_ID',

    }),

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

最后，转到您想要添加登录功能的组件并导入AuthService模块。

import { Component } from '@angular/core';



// Import the AuthService type from the SDK

import { AuthService } from '@auth0/auth0-angular';



@Component({

  selector: 'app-root',

  templateUrl: './app.component.html',

  styleUrls: ['./app.component.css'],

})

export class AppComponent {

  title = 'My App';



  // Inject the authentication service into your component through the constructor

  constructor(public auth: AuthService) {}



  loginWithRedirect(): void {

    // Call this to redirect the user to the login page

    this.auth.loginWithRedirect();

  }

}