快速入门 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就可以看到日志。

总结

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

参考资料

相关文章
|
6月前
基于edge的wetab插件使用
基于edge的wetab插件使用
55 0
|
3月前
|
JavaScript 前端开发 C++
【Azure Function】调试 VS Code Javascript Function本地不能运行,报错 Value cannot be null. (Parameter 'provider')问题
【Azure Function】调试 VS Code Javascript Function本地不能运行,报错 Value cannot be null. (Parameter 'provider')问题
|
5月前
|
JavaScript 前端开发
JavaScript进阶-ES6新特性概览:let, const, arrow functions
【6月更文挑战第19天】ES6的`let`和`const`带来了变量声明的变革,解决了`var`的提升和作用域问题。`let`有块级作用域,避免了循环中的变量共享;`const`声明常量,值不可变但内容可变(如数组和对象)。箭头函数简化了函数定义,其`this`绑定遵循上下文,不具自己的`arguments`。这些特性提升了代码质量和可读性。
131 2
|
5月前
|
搜索推荐 Java 程序员
Microsoft Edge使用方法和心得
Microsoft Edge使用方法和心得
31 0
|
Web App开发 前端开发 测试技术
Xpath Helper 在新版Edge中的安装及解决快捷键冲突问题
Xpath Helper 在新版Edge中的安装及解决快捷键冲突问题
479 0
|
6月前
|
Web App开发 搜索推荐 算法
Edge插件推荐
Edge插件推荐
157 0
|
存储
函数简介(function)
函数简介(function)自制脑图 函数也是一个对象,对象是内存中专门用来存储数据的一块区域。函数可以用来保存一些可执行的代码,并且可以在需要时,对这些语句进行多次的调用。函数名必须要符号标识符的规范 可以包含字母,数字,下划线,但是不能以数字开头)函数中保存的代码不会立即执行,需要调用函数代码才会执行 调用函数: 函数对象() 定义函数一般都是要实现某种功能
91 0
函数简介(function)
|
前端开发
Element-UI快速入门(三)
Element-UI快速入门
159 0
Element-UI快速入门(三)
|
传感器 边缘计算 数据安全/隐私保护
Link Edge快速入门| 学习笔记
快速学习Link Edge快速入门
275 0
|
边缘计算 算法 物联网
Link Edge函数计算介绍| 学习笔记
快速学习Link Edge函数计算介绍
145 0