通过NetLify功能使自己有点API

利用Netlify Functions构建微型API：一个实用案例

云函数为我们提供了许多巧妙的应用场景。例如，Glitch提供了一个很棒的“友好词汇”包，可以随机生成诸如“快乐的大象”或“行走的树”之类的词组。如果要在JavaScript网页中实现此功能，直接使用这个包可能会有些问题，因为它体积较大（约200KB），包含大量的词汇字典。为了避免增加客户端JavaScript的负担，我们可以利用云函数构建一个微型API。

云函数的优势在于，我们可以将大型资源放在服务器端，而无需将其加载到客户端。Netlify平台使得创建此类API变得非常简单。

以下是一个简单的示例，代码量极少：

函数文件夹及Node文件

在项目根目录下创建文件夹/functions/，并在其中添加文件random.js。此文件将引入friendly-words包，并导出一个函数。该函数的功能是随机获取两个单词，组合在一起并返回结果。

const friendlyWords = require("friendly-words");

exports.handler = function(event, context, callback) {
  const { predicates, objects } = friendlyWords;
  const numberOfPredicates = predicates.length;
  const numbersOfObjects = objects.length;

  const randomPredicate = predicates[Math.floor(Math.random() * numberOfPredicates)];
  const randomObject = objects[Math.floor(Math.random() * numbersOfObjects)];

  const output = `${randomPredicate}-${randomObject}`;

  callback(null, {
    headers: {
      "Access-Control-Allow-Origin": "*"
    },
    statusCode: 200,
    body: output
  });
};

部署到Netlify

我们可以通过netlify.toml文件配置Netlify，告知其函数文件的位置，从而避免使用UI界面进行配置。

[build]
  command = "#"
  functions = "functions/"

当然，也可以在Netlify的设置中直接进行配置。

部署完成后，为其设置一个友好的站点名称，云函数将可以通过一个URL访问。您甚至可以在浏览器中直接查看：

https://www.php.cn/link/8441c6ab9e88ee3764bd79b6d72269a1

现在，我们无需在客户端JavaScript中包含该包，只需访问此URL即可获取所需结果。

CORS跨域资源共享

如果从同样部署在friendly-words.netlify.com的网站访问此URL，则无需考虑CORS问题。但如果需要从其他网站访问，则需要处理CORS。请注意上述Node.js代码中的Access-Control-Allow-Origin设置，它解决了跨域问题。

演示

要使用这个微型API，只需使用fetch函数即可。

Netlify提供了许多使用函数的示例，有兴趣的话可以进一步探索。

在编写此示例的过程中，我参考了Paul Kinlan的文章，该文章实现了几乎相同的功能，并额外提供了一些API功能，值得一看。

以上是通过NetLify功能使自己有点API的详细内容。更多信息请关注PHP中文网其他相关文章！