发布于 2026-01-06 1 阅读
0

使用 JavaScript 部署您的第一个无服务器函数

使用 JavaScript 部署您的第一个无服务器函数

无服务器函数是为 JAMstack 网站添加额外功能的强大解决方案。在本文中,我们将逐步介绍如何使用Netlify Functions创建和部署您的第一个无服务器函数。

编写你的第一个无服务器函数

第一步是编写无服务器函数本身。在一个空文件夹中,创建一个名为 `<serverless_function_name>` 的文件夹functions,并在其中创建一个名为 `<serverless_function_name>` 的新文件,my-first-function.js并添加以下代码:

exports.handler = async () => ({
  statusCode: 200,
  body: 'boop',
});

就这么简单——你已经编写了你的​​第一个无服务器函数!🎉 本文的其余部分将介绍如何将此函数上线;我们现在已经完成了编码工作。

无服务器函数需要满足哪些要求?

无服务器函数包含三个必要组件:

  1. 该文件需要导出一个名为 `<function_name>` 的函数handler——这就是exports.handler上面第 1 行所做的。
  2. 该函数需要返回一个包含statusCode匹配的有效 HTTP 响应代码的对象。
  3. 响应对象还需要包含一个body值,默认情况下为纯文本。

配置您的项目以部署到 Netlify。

使用 Netlify Functions,我们只需要两行配置,并将其保存在netlify.toml文件夹根目录下:

[build]
  functions = "functions"

这告诉 Netlify 我们的函数位于该functions文件夹中。

注意!请查看文档以了解Netlify 配置文件的工作原理详情。

创建仓库并推送到 GitHub

现在,我们已经准备好将此功能上线了!

在 GitHub 上创建一个新仓库,然后将我们的代码添加到该仓库并推送:

# add your new repo as an origin
# IMPORTANT: make sure to use your own username/repo name!
git remote add origin git@github.com:yourusername/yourreponame.git

# add all the files
git add -A

# commit the files
git commit -m 'my first serverless function'

# push the changes to GitHub
git push -u origin master

重要提示:添加上述 origin 时,请务必使用您自己的用户名和仓库名称!

创建一个新的 Netlify 站点

您可以通过 Netlify 控制面板或 CLI 创建您的网站。CLI 非常方便且功能强大,所以我们将使用它来创建这个网站。

# install the Netlify CLI globally
npm install --global netlify-cli

# log into your Netlify account
netlify login

# initialize a new site
netlify init

此命令将在您的帐户中设置一个新的 Netlify 站点,该站点连接到我们刚刚创建的 GitHub 存储库。

它会问几个问题:

  1. 您想做什么? ——请选择“创建并配置新站点”。
  2. 团队— 选择要将此站点添加到哪个 Netlify 团队
  3. 网站名称(可选) — 为您的网站选择一个名称,或按回车键获取随机生成的名称。
  4. 您的构建命令——按回车键可将其留空;运行函数不需要它。
  5. 要部署的目录——按退格键删除建议值,然后按回车键将其留空。

使用上述设置运行 netlify init 后,终端输出的屏幕截图。

网站创建完成后,我们可以从终端输出中获取其 URL。在上面的截图中,生成的网站名称为:

https://confident-nightingale-4e5a0b.netlify.com/

默认情况下,Netlify 函数位于 URL 端点/.netlify/functions/<function-name>——这是为了最大限度地减少路由与网站上其他路由冲突的可能性。(如果需要,我们可以使用重定向来自定义函数 URL 。)

我们的函数文件名为my-first-function my-first-function.js,因此可以通过以下链接访问:https://confident-nightingale-4e5a0b.netlify.com/.netlify/functions/my-first-function。点击该链接即可访问!

浏览器显示无服务器函数返回的“boop”信号。

就这么简单!您已成功将第一个无服务器函数部署到 Netlify。

接下来该做什么

更多类似文章

文章来源:https://dev.to/jlengstorf/deploy-your-first-serverless-function-using-javascript-1g4e