快速入门 Edge Function

简介: 将你的动态网站或应用程序像静态资源一样部署在全球多台服务器上,始终靠近用户。

什么是 Edge?

当人们说“the edge”时,他们的意思是您的网站或应用程序将同时托管在全球多台服务器上,始终靠近用户。当有人请求您的网站/应用程序时,他们将被定向到地理位置最接近他们的网站/应用程序。这些分布式服务器不仅服务于静态资源,而且还可以执行可为动态 Web 应用程序提供支持的自定义代码。

Edge 的优势

平均而言,Edge Functions 比 Serverless Functions 具有更高的性能和成本效益。Edge Functions 在全球范围内部署在服务提供商的 Edge Network 上,并且可以在离触发它们的用户最近的区域自动执行。它们也没有冷启动,这意味着它们在执行代码之前不需要额外的时间来启动。

快速开始

Vercel 为开发人员提供了相应的服务,本文将以 Vercel 为平台,Next.js为基础框架,带你部署你的第一个边缘函数。在开始之前,你应该拥有:

第一步:创建一个新的 Next.js 项目

npx create-next-app@latest --typescript

第二步:将代码添加到您的函数

创建pages/api/hello.ts文件:

import { NextRequest, NextResponse } from 'next/server';

export const config = {
  runtime: 'edge', // 指定函数的运行时
};

export default (req: NextRequest) => {
  return NextResponse.json({
    name: `Hello, from ${req.url} I'm now an Edge Function!`,
  });
};

第三步:部署

将创建的 Next.js 项目提交到Github。登录 Vercel 平台后,在 dashboard 上添加一个新项目。

image-20230220135607842.png

绑定你的 Github 账号后,选择刚才提交到 Github 的项目,开始部署!

image-20230220135815069.png

访问 vercel 给你的域名就可以访问你的项目,如:https://your-project-name.vercel.app/

访问 域名+/api/hello 就会执行 Edge Function 了。

第四步:查看日志

dashboard中,单击已部署的项目并选择Functions选项卡。此选项卡显示项目中任何正在运行的函数的日志。使用下拉菜单选择函数api/hello就可以看到日志。

总结

你已经初步认识并部署了你的第一个边缘函数。希望能对你有帮助!

参考资料

相关文章
|
16天前
|
JavaScript 前端开发 开发者
Element-UI快速入门
Element-UI 是一个功能强大的 Vue 组件库,非常适合快速开发高质量的企业级前端应用。通过本文的快速入门指南,你应该能够开始使用 Element-UI,并将其组件应用到你的项目中。不断探索和实践将帮助你更好地理解和利用这个工具库为你的应用增添独特的价值。 希望这篇博客能够帮助你快速上手 Element-UI,为你的 Vue 项目加速开发。
20 1
|
1月前
|
JavaScript Windows
Element-ui快速入门
Element-ui快速入门
20 0
|
9月前
|
Web App开发 前端开发 测试技术
Xpath Helper 在新版Edge中的安装及解决快捷键冲突问题
Xpath Helper 在新版Edge中的安装及解决快捷键冲突问题
341 0
|
8月前
Element-UI快速入门 (二)
5.表格:查询列表 测试页面
48 0
|
8月前
|
前端开发
Element-UI快速入门 (三)
7.常见组件 按钮 Button
34 0
|
8月前
|
JavaScript 前端开发 开发者
Element-UI快速入门(一)
什么是Element UI Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库 Element UI是基于Vue 2.0的 Element UI 提供一组组件 Element UI 提供组件的参考实例, 直接复制
129 0
|
前端开发
Element-UI快速入门(三)
Element-UI快速入门
127 0
Element-UI快速入门(三)
|
传感器 边缘计算 数据安全/隐私保护
Link Edge快速入门| 学习笔记
快速学习Link Edge快速入门
236 0
|
边缘计算 算法 物联网
Link Edge函数计算介绍| 学习笔记
快速学习Link Edge函数计算介绍
125 0