Angular 5：有没有办法隐藏 API 调用？或将其设为私有？答案

【问题标题】：Angular 5: Is there way hide API call? or make it private?Angular 5：有没有办法隐藏 API 调用？或将其设为私有？
【发布时间】：2019-05-06 21:16:58
【问题描述】：

我开始学习 Angular，我注意到我对后端的每个调用都可以从开发人员工具中看到。所以当我得到这样的方法/功能时：

getUser(userId){
    return this.http.post('server/page/get-user', {id:userId});
}

然后在某些组件中我会这样称呼它：

this.userService.getUser(2).subscribe((data)=> {
    console.log(data)
})

根据发布的用户 ID 基本上返回用户信息（姓名、地址等）。如果想获取随机的用户信息，难道他们不能只是对这个端点进行 API 调用，在请求有效负载中使用随机数并获取该用户信息吗？

我读到了解决此问题的一种方法是使用 JWT，它基本上加密了有效负载，但是没有选项可以让这个 api 调用仅在我的应用程序中可用吗？或者至少让它对开发者工具隐藏？

【问题讨论】：

您可以使用debounceTime 运算符来避免您的门户发送垃圾邮件。您的 API 可以接受带有令牌的不记名标头，这样只有拥有此令牌的人才能发出请求。这只是基本的。
Web 开发中关于安全性的第一条规则是您无法控制客户端。即使你可以从 devtools 中隐藏它，我也可以使用其他工具来查看所有请求
如果你不通过服务器上的某种身份验证机制和访问控制来保护你的 API，那么每个人都可以使用它来获取各种信息。
我不得不为 Angular Universal 重新设计我的 Angular 应用程序，现在我还重新设计了 API 的工作方式。基本上我必须在 API 中定义标头以允许我的应用程序访问它。现在我想知道，我不能使用类似的东西来阻止人们从外部访问我的 API 吗？使用我当前的设置，人们可以复制 API 端点并在 Chrome 中打开它并获取公共信息，但是一旦他们尝试在他们的应用程序中使用该端点，由于 CORS，它不会返回任何信息。我不知道这是否真的像我想的那样有效，但这只是我想到的。

标签： angular

【解决方案1】：

有没有办法隐藏 API 调用？还是将其设为私有？

没有。浏览器属于用户。它所做的一切都在他们的控制之下，而不是你的。

根据发布的用户 ID 基本上返回用户信息（姓名、地址等）。如果想获取随机的用户信息，难道他们不能直接通过 API 调用这个端点，在请求负载中使用随机数并获取用户信息吗？

如果您正在运行未经身份验证的 API。是的。

听起来你想要security through obscurity，这是非常不可靠的。

我读到了解决此问题的一种方法是使用 JWT，它基本上加密了有效负载

不是。

您需要身份验证/授权。

您需要识别用户（这可以通过用户名和密码，通过 Facebook 或 Twitter 等提供商进行 OAuth）。

然后您需要确保允许用户读取他们请求的数据。例如用户记录只能由拥有该记录的用户或具有管理员角色的用户访问。

难道没有选项可以让这个 api 调用仅在我的应用程序中可用？

没有

或者至少让它对开发者工具隐藏？

没有

【讨论】：

但是他们不能只登录我的应用程序，复制生成的令牌，然后在他们的应用程序中使用该令牌来调用我的 API 并仍然获取数据吗？
@user1203497 — 是的。但既然是你愿意让他们看到的数据，那应该没关系。
我使用getUser 函数的全部目的是检索所有用户信息。然后稍后我可以简单地使用该功能来获取用户信息，无论是设置页面，用户需要查看仅针对他的眼睛的信息（如电子邮件）还是具有公共信息（如姓名）的用户公共个人资料。所以现在如果我使用 Angular，我不能使用这种简单的方法，我必须基本上创建两个函数——一个用于私有数据，另一个用于公共数据。这两者本质上都是在做同样的事情，只是一个只能检索经过身份验证的用户的数据。
检查这个。例如，点击这个网站的url track.aftership.com/shreetirupati/115601676472或shreetirupaticourier.net/Frm_DocTrack.aspx?docno=115601676472，没有点击任何API，这是否意味着他们直接从前端的数据库中访问数据？
如何隐藏从 API 调用返回的数据？有没有这样做的标准实践，或者这一切都依赖于你不应该返回你不希望有人在网络选项卡中偶然发现的数据这一事实？（显然不能替代 API 端点的身份验证/授权）

【解决方案2】：

简而言之，没有。

您可以通过点击处理您的请求的端点来隐藏请求，但是从您开始，请考虑您不能。

让我进一步解释一下：Javascript 在客户端的浏览器中运行。这意味着客户可以完全访问您的前端代码：如果他愿意，他可以完全分解您的应用程序。

好处是只能在他自己的电脑上破解：客户端不能乱用其他客户端的浏览器。

另一方面，任何东西都可以访问您的服务器，但您是对其拥有主控制权的人：您应该保护它。

如您所说，要做到这一点，您可以使用 JWT。但是 JWT 是一个身份验证过程，它基本上是一个编码字符串。通过对其进行解码，您可以获得客户端信息，但它们不是从数据库中获取的，而是从令牌本身中获取的。

如果您想保护您的端点，例如，您可以声明只有具有令牌提供的 ID 的用户才能访问您的端点：没有签名就无法伪造令牌。这将保护您的端点并防止其他用户进行修改。

另一方面，您还可以阻止其他应用程序使用此端点。例如，如果您的用户在您的其他应用程序中使用其令牌，您可以拒绝。但它变得更先进了，所以现在，我认为你应该专注于保护你的端点免受其他用户的影响。

考虑使用与您的后端语言相对应的标签提出另一个问题，这将比询问 Angular 解决方案更有帮助。

【讨论】：

On the other side, you could also prevent other applications from using this endpoint. For instance, if your user uses its token in an app other than yours, you could refuse that. But it's becoming a little more advanced, so for now, I think you should focus on securing your endpoint from other users. 真的吗？那你是怎么做到的呢？

【解决方案3】：

虽然这条消息是很久以前发布的。就我而言，我将请求发送到一个新窗口，然后将响应发布回我的主窗口。

在这种情况下，即使用户在“打开的浏览器”上打开开发人员工具上的网络选项卡，他也看不到日志。

【讨论】：