小编Nik*_*nov的帖子

我在网上浏览了一段时间，但无法理解仅在前端和后端之间创建私有 API 的概念。我本质上想做的是拥有一个只能通过前端访问的API，而不是通过curl、postman 或其他任何东西。

我有以下设置：

1. 应用程序托管在 Heroku 上，后端位于 Nodejs 中

2. 我使用通过 Let's Encrypt 工具自行生成的 https 连接。

3. 我有一个公共 API atm，它返回字符串“Hello world”

4. 目前，您可以通过前端或访问 www.example.com/api/test 来访问它，但我想做的是不允许用户手动访问链接或使用curl或postman来获取它，但是相反，仅使其可以通过前端访问。

5. 前端是用 Angular 2 编写的（如果有的话）

请注意，我不打算让任何用户登录该网站，我只是想限制外部世界对 API 的访问，以便只有我的前端才能获取它。

更新用例

未来的用例很简单。我有一个基本的注册表单，要求提供电子邮件地址和文字描述。然后，我在后端使用 Nodemailer 使用来自 Angular 2 的 POST 请求将该信息发送到 gmail。我访问通过 req.on('data') 和 req.on('end') 发送的数据并对其进行处理。我担心的是，如何确保我不会通过该 API 收到垃圾邮件并收到 10k 封电子邮件，因此我希望以某种方式使该 API 只能通过前端访问。

我有一个Angular项目设置与angular-cli.我想将Roboto字体与我的网站捆绑在一起,所以我这样做是因为我在styles.scss中声明它

/* You can add global styles to this file, and also import other style files */
@import url('https://fonts.googleapis.com/css?family=Roboto');

// Set Global Font
body {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}

但是,似乎字体默认为sans-serif而不是Roboto.我尝试在index.html中添加一个链接,效果相同.

PS不确定是否相关,但我也添加了材料图标

// Import Material Icons
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url('../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff2') format('woff2'),
       url('../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff') format('woff'),
       url('../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf') format('truetype');
}

在同一个文件中,这可能会对项目产生影响吗？