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

总结

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

参考资料

相关文章
|
IDE 开发工具 Windows
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之ScrollBar组件
 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之ScrollBar组件
282 0
|
Web App开发 域名解析 缓存
如何在 Ubuntu 20.04 上安装 Node.js 和 npm
本文我们主要为大家介绍在 Ubuntu 20.04 上安装 Node.js 和 npm 的三种不同的方式。
162270 7
如何在 Ubuntu 20.04 上安装 Node.js 和 npm
|
前端开发 JavaScript 容器
前端实现旗帜飘动效果系列 (Ⅰ):dom+css实现
hello,民娜桑~~我又来开新坑了( ̄ε(# ̄)╰╮o( ̄皿 ̄///),这次尽量保证把这个坑填完~本系列我会分四篇来完成主题,分别是① DIV+CSS的实现,② canvas2D的简单实现,③ canvas2D的进阶实现,④ webgl+着色器的实现 以及 ⑤ 包装成jquery插件并发布为npm模块 。
3970 0
|
11月前
|
前端开发 JavaScript API
2025年前端框架是该选vue还是react?有了大模型-例如通义灵码辅助编码,就不用纠结了!vue用的多选react,react用的多选vue
本文比较了Vue和React两大前端框架,从状态管理、数据流、依赖注入、组件管理等方面进行了详细对比。当前版本和下载量数据显示React更为流行,但Vue在国内用户量增长迅速。Vue 3通过组合式API提供了更灵活的状态管理和组件逻辑复用,适合中小型项目;React则更适合大型项目和复杂交互逻辑。文章还给出了选型建议,强调了多框架学习的重要性,认为技术问题已不再是选型的关键,熟悉各框架的最佳实践更为重要。
6752 1
|
11月前
|
人工智能 JavaScript 数据可视化
Cursor、v0 和 Bolt.new:当今 AI 编程工具的全面解析与对比
本文深入解析了 Cursor AI、v0 和 Bolt.new 三大 AI 编程工具的特点与应用场景。Cursor 适合日常编码与团队协作,v0 专注于 UI 原型设计,Bolt.new 擅长全栈原型开发。各工具在功能上互为补充,开发者可根据需求灵活选择,以提升工作效率。
4872 1
|
6月前
|
存储 缓存 Java
极速启动,SAE弹性加速全面解读
在云计算快速发展的今天,业务稳定性与响应速度成为企业竞争力的关键。阿里云Serverless应用引擎(SAE)通过镜像加速、启动加速及CPU Burst等核心技术,大幅提升弹性能力。其中,镜像加速利用预热机制与按需加载技术减少拉取时间;启动加速针对Java应用优化,采用Dragonwell 11的Quickstart能力和Wisp2协程技术;CPU Burst则在应用启动阶段临时提升CPU规格,确保高效运行。
极速启动,SAE弹性加速全面解读
|
11月前
|
前端开发 JavaScript 安全
探索 JAMstack 架构:现代Web开发的新范式
【10月更文挑战第20天】JAMstack(JavaScript、APIs、Markup)架构是一种现代Web开发方法,通过预构建静态页面、动态功能通过APIs实现和依赖JavaScript,提供高性能、安全和可扩展的Web开发新范式。本文深入探讨其核心理念、优势、工具和最佳实践,帮助开发者理解和应用JAMstack。
|
11月前
|
IDE 开发者 iOS开发
京东开源的 JD-Hotkey:高效热键管理的技术巅峰
【10月更文挑战第5天】在快节奏的工作与学习中,提高操作效率是每位技术爱好者不懈追求的目标。今天,我们将深入探讨京东开源的 JD-Hotkey 项目,它不仅是一个强大的热键管理工具,更是我们在日常工作中提升生产力的秘密武器。通过本文,你将了解到 JD-Hotkey 的核心功能、技术亮点以及在实际应用中的卓越表现,一同感受其带来的高效与便捷。
645 4
|
测试技术 程序员 C语言
『软件测试4』耗子尾汁!2021年了,你还不知道这4种白盒测试方法吗?
该文章深入介绍了四种常用的白盒测试方法,包括语句覆盖、判定覆盖、条件覆盖以及路径覆盖,并探讨了这些方法在软件测试中的应用。
『软件测试4』耗子尾汁!2021年了,你还不知道这4种白盒测试方法吗?
|
前端开发 JavaScript Serverless
「译文」目前大火的 Jamstack 到底是什么?
「译文」目前大火的 Jamstack 到底是什么?

热门文章

最新文章