如何使用 angular (6) 和服务器端保护页面

Question

angular 有保护私有页面的好方法吗？（我知道有但我无法得到它）.. 我搜索了很多这个问题，发现的所有信息看起来都一样，并没有真正给我解决方案

angular 如何在任何服务器端保护页面（如管理面板）？ 我会解释我的意思..

我知道我们可以创建一个服务器端代码，该代码进入他自己的存储（数据库等）并根据他的凭据检查 angular 发送的凭据。

但是-无论服务器端的答案是什么（比如 PHP 或 Firebase 等），用户都可以更改 angular 中的代码，因为它最终会生成到 JS 中!

假设我的 angular 代码是这样的：

somecode..
somecode..
somecode..
if (serverside.respone == true) {
    goto AdminPanel page;
} else {
    alert('not authorized!');
}
somecode..
somecode..
somecode..

当我在 chrome 中打开我的开发工具时，在我运行我的应用程序（使用 ng serve）之后，我可以轻松地查看 "main.js" 源文件，并轻松地更改它代码：

somecode..
somecode..
somecode..

if (1 == 1) {
    goto AdminPanel page;
} else {
    alert('not authorized!');
}

somecode..
somecode..
somecode..

然后呢？当然这不安全..（我也尝试过并且知道我是对的）请帮助我了解我错过了什么！

谢谢！

Answer 1

Angular 或任何其他客户端框架应仅包含 UI 逻辑。公开 UI 逻辑不是安全线程。

服务器端 webapi 应该有适当的身份验证和授权。

JWT（JSON Web Token）用于安全访问服务器端API。

如您所说，用户可以修改代码 if (1 == 1) ，但用户可以看到 UI.. 而不是数据。您应该在服务器端验证凭据并将数据提供给客户端

Answer 2

前端主要负责向服务器展示和发送数据，服务器负责存储和处理数据。

意味着服务器负责检查用户是否已通过身份验证（已登录）并有权访问该页面（已授权）。正如 Saravana 所说，JWT 是一种很好的技术，可以保证用户已通过身份验证并有权访问该数据。

但这并不意味着您不应该注意安全。前端环境主要是要注意XSS攻击。但好消息是 Angular 有很多事情需要处理 XSS，但你仍然需要自己实现一些感觉，比如 JWT 和路由守卫例如。

如何使用 angular (6) 和服务器端保护页面

How to secure page with angular (6) & server side

security

backend

angular