如何对未登录的用户隐藏我的大部分JavaScript？

Question

我正在开发Web应用程序。主要部分将是HTTP API和使用大量JavaScript的前端。

需要身份验证，因此将有一个用户登录页面。在此页面上，前端代码将从用户那里获取凭据，将其提交给HTTP API，并接收令牌，该令牌可以然后用于访问HTTP API的私有部分。

实现此目的的简单方法是让登录页面引用所有JavaScript代码，这意味着登录页面将具有a）登录所需的JavaScript和b）登录后所需的JavaScript。但是拥有（b）是一个问题。即使将JavaScript精简了，破解者也可以阅读并找到：

• HTTP端点；
• 如何对API的受保护部分进行身份验证；
• API的受保护部分需要什么样的数据；
• 使用HTML模板和其他静态字符串向用户发送消息。

前3个项目可用于探测HTTP API并可能对其进行攻击。最后一项可以帮助进行社会工程攻击，或者通常可以帮助确定应用程序的功能。

所以我的问题是：如何确保当用户未登录时，他看不到仅在登录后才需要的JavaScript？

我正在考虑以下内容：

• 用户导航到登录页面，其中包含最少的JavaScript代码。
• 用户输入其凭据。
• JavaScript将这些凭据发送到后端并接收cookie。
• JavaScript重定向到另一个页面，将其称为页面2。
• 第2页引用了登录后使用的JavaScript，该JavaScript存储在URL中，该URL包含一个长的，密码随机的字符串。

通过让后端要求客户端在请求JavaScript时发送有效的cookie，可以改善最后一点。

这是一个合理的计划吗？有什么更好的吗？

因为它可能有用，所以我将提供有关此Web应用程序的更多信息。

该Web应用程序的域名和登录页面的URL将不会被公开，因此，除非您在系统上拥有一个帐户，否则您将不会知道登录页面的URL —至少这是故意的。

前端将使用React。

我在此网站上发现了类似的问题，但没有得到很好而详尽的答复：

• Can I avoid serving all js to clients not logged in?（2013，流星框架）

• Ember best practices for loading javascript/app only after authentication（2014）

Answer 1

首先，服务器上应存在验证和安全措施。即使用户知道端点，也不会知道未经授权的有效载荷。

基于Cookie的方法看起来不错，一旦用户登录，您就会发送一个存储的cookie，它将随每个请求一起发送到服务器，其中服务器将首先验证cookie，然后再处理请求/资源。

这也将解决您的JS问题，因为在充当JS文件/资产服务器之前，服务器将检查用户是否已通过身份验证，然后仅提供JS文件。

创建一个HTTP cookie，并向其中添加访问令牌，并验证您从服务器提供的请求的访问令牌。还添加CSP和CSRF作为添加的安全措施。

阅读有关 1）基于JWT的身份验证 2）CSRF 3）CSP

希望这会有所帮助。