乐闻世界logo
搜索文章和话题

服务端面试题手册

什么是 Vercel 及其核心功能?

什么是 Vercel 及其核心功能?Vercel 是一个基于云的静态网站托管和部署平台,专为现代前端开发而设计。它提供了以下核心功能:核心功能自动部署:与 GitHub、GitLab、Bitbucket 等代码托管服务集成,当代码推送到仓库时自动触发构建和部署流程。全球 CDN:利用全球分布的边缘网络,确保用户能够快速访问部署的网站,提供低延迟的访问体验。零配置部署:支持多种前端框架(如 Next.js、React、Vue、Angular 等),无需复杂的配置即可实现自动化部署。预览环境:为每个 Pull Request 或分支自动生成预览 URL,方便团队进行代码审查和测试。自定义域名:支持绑定自定义域名,并自动配置 SSL 证书,确保网站安全访问。环境变量管理:提供安全的环境变量管理功能,支持不同环境(开发、预览、生产)的变量配置。Serverless Functions:支持部署无服务器函数,允许在 Vercel 平台上运行后端逻辑。边缘网络:利用边缘计算能力,在离用户最近的节点执行代码,提升性能。技术特点基于 HTTP/2 和 HTTP/3 协议,提供更快的加载速度支持增量静态再生成(ISR)和静态站点生成(SSG)提供实时日志和性能监控支持团队协作和权限管理适用场景Vercel 特别适合以下场景:静态网站和单页应用(SPA)Next.js 应用的部署Jamstack 架构项目需要快速迭代和预览的项目全球化部署需求的应用与传统部署的区别传统部署通常需要手动配置服务器、设置 CI/CD 流程、管理 SSL 证书等,而 Vercel 将这些流程自动化,大大简化了部署流程,让开发者能够专注于代码本身而非基础设施管理。
阅读 0·2月21日 16:45

什么是 Nginx?它的主要特点是什么?

什么是 Nginx?它的主要特点是什么?Nginx 是一个高性能的 HTTP 和反向代理服务器,同时也是一个 IMAP/POP3 代理服务器。它由 Igor Sysoev 开发,最初发布于2004年,旨在解决 C10k 问题,即同时处理大量客户端连接的需求。Nginx 的主要特点:高性能:采用事件驱动架构,能够处理数以万计的并发连接,内存占用低稳定性强:在高并发环境下表现稳定,能够长时间运行而不崩溃反向代理:可以作为反向代理服务器,将请求转发到后端服务器负载均衡:支持多种负载均衡算法,如轮询、最少连接、IP 哈希等静态文件服务:高效地提供静态文件服务,如 HTML、CSS、JavaScript、图片等缓存功能:支持 FastCGI、uWSGI、SCGI、memcached 等缓存SSL/TLS 支持:支持 HTTPS 协议,可以配置 SSL 证书模块化设计:通过模块扩展功能,支持第三方模块热部署:支持在不中断服务的情况下重新加载配置跨平台:支持 Linux、Windows、macOS 等多种操作系统与 Apache 的区别:Nginx 采用事件驱动、非阻塞 I/O 模型,Apache 采用进程/线程模型Nginx 在高并发场景下性能更好,资源消耗更低Apache 模块更丰富,动态处理能力更强Nginx 配置相对简单,学习曲线较平缓适用场景:高并发 Web 服务器反向代理服务器负载均衡器静态资源服务器API 网关WebSocket 代理
阅读 0·2月21日 16:45

Vercel 的定价模式是怎样的?

Vercel 的定价模式是怎样的?Vercel 提供了灵活的定价模式,从免费计划到企业级解决方案,满足不同规模团队和项目的需求。了解 Vercel 的定价结构对于选择合适的计划和控制成本非常重要。免费计划(Hobby)适用对象个人开发者学习和实验项目小型个人网站开源项目包含功能部署功能:无限项目数量无限部署次数自动 Git 集成预览部署(无限)生产部署(无限)性能特性:100GB 带宽/月6,000 分钟构建时间/月100GB-Hours Serverless Functions全球 CDN自动 SSL 证书开发工具:实时日志错误追踪部署历史环境变量管理团队协作(最多 1 人)限制:无团队协作功能无优先支持无高级分析无自定义区域Pro 计划适用对象专业开发者小型团队商业项目需要更多资源的个人项目价格个人 Pro:$20/月团队 Pro:$20/用户/月包含功能部署功能:所有免费计划功能1TB 带宽/月10,000 分钟构建时间/月1,000GB-Hours Serverless Functions无限团队成员性能特性:更快的构建速度优先队列处理自定义区域选择更长的函数执行时间(60 秒)更大的函数内存(最高 3008 MB)开发工具:高级分析性能监控错误追踪集成Slack 通知更详细的日志团队功能:团队协作权限管理SSO(单点登录)审计日志项目共享支持:邮件支持(24 小时响应)Discord 社区支持文档访问Enterprise 计划适用对象大型企业高流量网站需要定制化解决方案有合规性要求的组织价格定制定价需要联系销售团队包含功能部署功能:所有 Pro 计划功能无限带宽无限构建时间无限 Serverless Functions自定义 SLA专属基础设施性能特性:最高性能保证自定义区域部署专属边缘节点更长的函数执行时间(可协商)更大的函数内存(可协商)安全与合规:SOC 2 Type II 合规HIPAA 合规(可选)SSO/SAMLIP 白名单数据驻留选项高级安全功能团队功能:无限团队成员高级权限管理组织级管理审计日志合规报告支持:专属客户成功经理24/7 优先支持技术顾问培训和入职支持定期业务审查按需付费功能超出配额的使用带宽:Pro 计划:$40/100GBEnterprise:包含无限带宽构建时间:Pro 计划:$0.10/分钟Enterprise:包含无限构建时间Serverless Functions:Pro 计划:$0.60/GB-HourEnterprise:包含无限 Functions额外功能自定义域名:免费:无限自定义域名SSL 证书:免费自动颁发团队协作:Pro 计划:$20/用户/月Enterprise:包含无限用户成本优化策略1. 合理使用资源监控使用情况:定期检查 Dashboard 中的使用统计设置使用量告警分析资源使用模式优化构建时间:利用 Vercel 的缓存机制使用增量构建优化依赖安装减少函数调用:实现缓存策略使用 CDN 缓存优化 API 设计2. 选择合适的计划评估需求:估算带宽使用量评估构建时间需求考虑团队规模分析性能要求从免费开始:先使用免费计划监控实际使用情况根据需要升级3. 利用免费额度预览部署:充分利用无限预览部署在合并前测试所有更改减少生产环境问题缓存策略:合理配置 CDN 缓存使用 ISR 减少函数调用实现客户端缓存计划对比| 功能 | Hobby | Pro | Enterprise ||------|-------|-----|------------|| 价格 | 免费 | $20/月 | 定制 || 带宽 | 100GB/月 | 1TB/月 | 无限 || 构建时间 | 6,000 分钟/月 | 10,000 分钟/月 | 无限 || Serverless Functions | 100GB-Hours | 1,000GB-Hours | 无限 || 团队成员 | 1 人 | 无限 | 无限 || 自定义域名 | 无限 | 无限 | 无限 || SSL 证书 | 自动 | 自动 | 自动 || 预览部署 | 无限 | 无限 | 无限 || 自定义区域 | ❌ | ✅ | ✅ || 优先支持 | ❌ | ✅ | ✅ || SSO | ❌ | ✅ | ✅ || 审计日志 | ❌ | ✅ | ✅ || SLA | ❌ | 99.95% | 99.99%+ |计费周期月度计费按月计费灵活取消适合短期项目年度计费享受折扣(通常 10-20%)一次性支付适合长期项目免费试用Pro 计划试用14 天免费试用无需信用卡包含所有 Pro 功能试用期结束后自动降级Enterprise 试用需要联系销售定制试用方案包含专属支持付款方式支持的付款方式信用卡(Visa、MasterCard、American Express)借记卡PayPal(部分地区)银行转账(Enterprise)发票自动生成发票PDF 格式下载发送到注册邮箱支持自定义发票信息(Enterprise)常见问题Q1: 可以随时更改计划吗?A: 是的,可以随时升级或降级计划。升级立即生效,降级在下一个计费周期生效。Q2: 超出配额会发生什么?A: 超出配额后,服务会继续运行,但会按使用量计费。可以设置使用上限以避免意外费用。Q3: 免费计划适合生产环境吗?A: 免费计划可以用于小型生产项目,但有限制。对于商业项目,建议使用 Pro 或 Enterprise 计划。Q4: 如何监控使用情况?A: 在 Vercel Dashboard 的 "Usage" 页面可以查看详细的使用统计和成本分析。Q5: 可以暂停项目吗?A: 可以暂停项目以停止产生费用。暂停的项目不会产生带宽和函数使用费用。成本估算示例小型博客网站月访问量:10,000带宽使用:约 5GB构建次数:约 10 次推荐计划:Hobby(免费)中型电商网站月访问量:100,000带宽使用:约 50GB构建次数:约 50 次Serverless Functions:约 200GB-Hours推荐计划:Pro($20/月)大型企业应用月访问量:1,000,000+带宽使用:500GB+构建次数:200+Serverless Functions:1,000GB-Hours+推荐计划:Enterprise(定制)节省成本的技巧1. 优化资源使用压缩图片和静态资源使用 CDN 缓存实现代码分割优化数据库查询2. 利用免费功能使用预览部署进行测试利用无限自定义域名使用自动 SSL 证书利用免费的分析工具3. 团队协作优化合理分配团队成员使用项目共享功能定期审查访问权限利用 SSO 简化管理4. 监控和告警设置使用量告警定期审查账单分析成本趋势优化高成本项目总结Vercel 的定价模式提供了:灵活性:从免费到企业级,满足不同需求透明度:清晰的价格和配额可预测性:按月计费,易于预算可扩展性:随着业务增长轻松升级价值导向:付费计划提供更多功能和更好的支持选择合适的计划需要综合考虑项目规模、团队大小、性能要求和预算。建议从免费计划开始,根据实际使用情况逐步升级。
阅读 0·2月21日 16:45

Vercel 的部署流程是怎样的?

Vercel 的部署流程是怎样的?Vercel 的部署流程设计得非常简洁高效,从代码提交到网站上线通常只需要几分钟时间。以下是详细的部署流程说明:部署触发方式1. Git 集成部署(推荐)这是最常用的部署方式,通过连接代码仓库实现自动化部署:支持的代码托管平台:GitHubGitLabBitbucket部署触发条件:推送代码到主分支(触发生产部署)创建或更新 Pull Request(触发预览部署)推送代码到其他分支(触发预览部署)设置步骤:在 Vercel Dashboard 中创建新项目选择导入 Git 仓库授权 Vercel 访问你的代码仓库选择要部署的仓库和分支配置构建设置(通常自动检测)点击 "Deploy" 完成首次部署2. Vercel CLI 部署使用命令行工具进行手动部署:# 安装 Vercel CLInpm i -g vercel# 登录 Vercelvercel login# 部署到预览环境vercel# 部署到生产环境vercel --prod# 部署特定目录vercel --path ./dist3. API 部署通过 Vercel API 进行程序化部署:const { createDeployment } = require('@vercel/client');const deployment = await createDeployment({ token: process.env.VERCEL_TOKEN, path: './dist', projectSettings: { projectName: 'my-project' }});部署流程详解阶段 1:代码拉取Vercel 从 Git 仓库拉取最新代码检查 .gitignore 文件,排除不需要的文件解析项目的依赖关系阶段 2:依赖安装检测包管理器:自动检测项目使用的包管理器(npm、yarn、pnpm)安装依赖:运行相应的安装命令npm: npm installyarn: yarn installpnpm: pnpm install缓存优化:Vercel 会缓存 node_modules 以加速后续部署阶段 3:构建过程构建命令执行:运行配置的构建命令默认:npm run build可在 vercel.json 中自定义框架检测:识别项目使用的框架并应用优化静态资源生成:生成 HTML、CSS、JavaScript 等静态文件代码分割:自动进行代码分割以优化加载性能阶段 4:部署上传文件上传:将构建产物上传到 Vercel 的边缘网络CDN 分发:将文件分发到全球各地的边缘节点缓存配置:配置适当的缓存策略阶段 5:域名配置SSL 证书:自动配置和更新 SSL 证书(Let's Encrypt)域名解析:配置 DNS 记录自定义域名:如果配置了自定义域名,进行相应的 DNS 设置预览部署 vs 生产部署预览部署(Preview Deployments)特点:为每个 Pull Request 或分支生成唯一的 URLURL 格式:https://project-name-branch-name.vercel.app自动更新:每次推送都会更新预览部署独立环境:使用预览环境的环境变量用途:代码审查功能测试团队协作客户演示生产部署(Production Deployments)特点:部署到主域名URL 格式:https://project-name.vercel.app 或自定义域名使用生产环境的环境变量更严格的构建检查触发条件:代码合并到主分支手动触发生产部署使用 vercel --prod 命令部署优化策略1. 构建缓存Vercel 自动缓存以下内容以加速构建:node_modules 目录构建产物依赖下载2. 增量构建对于支持的项目,Vercel 可以进行增量构建:只重新构建修改的页面复用未改变的构建产物大幅减少构建时间3. 并行构建Vercel 支持并行构建多个项目或部署:同时处理多个 Pull Request并行执行构建步骤提高团队开发效率部署监控和日志1. 实时日志Vercel 提供实时的构建和部署日志:查看构建过程的每一步识别构建错误监控部署进度2. 部署历史可以查看所有历史部署:部署时间部署状态部署者信息Git commit 信息3. 错误通知当部署失败时,Vercel 会:在 Dashboard 中显示错误信息发送邮件通知(如果配置)在 Slack 或其他集成工具中通知常见问题和解决方案1. 构建失败常见原因:依赖版本冲突构建命令错误环境变量缺失内存不足解决方案:检查构建日志找出具体错误确保所有依赖正确安装验证环境变量配置增加函数内存限制2. 部署超时原因:构建时间过长网络问题资源限制解决方案:优化构建流程使用增量构建检查网络连接升级到付费计划获得更长构建时间3. 部署后页面 404原因:输出目录配置错误路由配置问题文件未正确生成解决方案:检查 outputDirectory 配置验证路由设置确认构建产物包含所有必要文件最佳实践1. 使用预览部署在合并代码前 always 使用预览部署进行测试为每个功能分支创建预览部署在 Pull Request 中分享预览 URL2. 配置正确的构建命令确保 package.json 中有正确的 build 脚本使用生产环境构建(如 NODE_ENV=production)优化构建输出大小3. 管理环境变量为不同环境配置不同的环境变量不要在代码中硬编码敏感信息定期更新和轮换 API 密钥4. 监控部署状态设置部署失败通知定期检查部署日志使用 Vercel Analytics 监控性能5. 优化构建时间利用 Vercel 的缓存机制使用增量静态再生成(ISR)避免不必要的构建步骤
阅读 0·2月21日 16:45

Nginx 的事件驱动模型是什么?如何实现高并发?

Nginx 的事件驱动模型是什么?如何实现高并发?Nginx 采用事件驱动、非阻塞 I/O 模型,这是其能够处理高并发连接的核心原因。理解 Nginx 的事件驱动模型对于优化性能和解决高并发问题至关重要。事件驱动模型原理:Nginx 使用事件驱动架构,通过事件通知机制来处理 I/O 操作,而不是传统的多进程或多线程模型。核心概念:事件循环(Event Loop):主循环监听和处理各种事件事件处理器:处理特定类型事件的函数非阻塞 I/O:I/O 操作不会阻塞进程异步处理:通过回调函数处理 I/O 完成事件工作流程:1. Master 进程启动,监听端口2. Fork 多个 Worker 进程3. 每个 Worker 进程独立运行事件循环4. 事件循环监听连接、读写事件5. 事件触发时调用对应的处理器6. 处理完成后继续监听Nginx 进程模型:# nginx.conf 配置worker_processes auto; # 自动设置 worker 进程数,通常等于 CPU 核心数worker_rlimit_nofile 65535; # 每个 worker 打开的文件描述符限制events { worker_connections 10240; # 每个 worker 的最大连接数 use epoll; # 使用 epoll 事件模型(Linux) multi_accept on; # 允许同时接受多个连接}理论并发连接数:最大并发连接数 = worker_processes × worker_connections例如:4 个 worker,每个 10240 连接 = 40960 并发连接事件模型类型:Linux - epoll:events { use epoll;}高效处理大量连接O(1) 时间复杂度支持边缘触发和水平触发BSD/macOS - kqueue:events { use kqueue;}Windows - select/poll:events { use select;}高并发优化配置:# 全局配置user nginx;worker_processes auto;worker_rlimit_nofile 100000;events { worker_connections 65535; use epoll; multi_accept on; accept_mutex off; # 关闭互斥锁,提高并发性能}http { # 连接优化 keepalive_timeout 65; keepalive_requests 100; # 缓冲区优化 client_body_buffer_size 128k; client_max_body_size 10m; client_header_buffer_size 1k; large_client_header_buffers 4 4k; # 输出缓冲 output_buffers 1 32k; postpone_output 1460; # 文件描述符 open_file_cache max=100000 inactive=20s; open_file_cache_valid 30s; open_file_cache_min_uses 2; open_file_cache_errors on;}性能调优参数:worker_processes:设置为 auto 或 CPU 核心数worker_connections:根据内存和业务需求调整workerrlimitnofile:设置足够大的文件描述符限制multi_accept:允许同时接受多个新连接accept_mutex:高并发时关闭,减少锁竞争系统级优化:# /etc/sysctl.conf# 增加系统文件描述符限制fs.file-max = 1000000# 优化 TCP 参数net.ipv4.tcp_max_tw_buckets = 6000net.ipv4.tcp_sack = 1net.ipv4.tcp_window_scaling = 1net.ipv4.tcp_rmem = 4096 87380 4194304net.ipv4.tcp_wmem = 4096 65536 4194304net.core.rmem_max = 16777216net.core.wmem_max = 16777216net.core.netdev_max_backlog = 262144net.ipv4.tcp_max_syn_backlog = 262144net.ipv4.tcp_fin_timeout = 30net.ipv4.tcp_keepalive_time = 1200net.ipv4.tcp_tw_reuse = 1与 Apache 的对比:| 特性 | Nginx | Apache ||------|-------|--------|| 模型 | 事件驱动 | 进程/线程 || 内存占用 | 低 | 高 || 并发能力 | 高 | 中等 || CPU 使用 | 低 | 高 || 动态处理 | 较弱 | 强 |监控和诊断:# 启用状态监控location /nginx_status { stub_status on; access_log off; allow 127.0.0.1; deny all;}状态信息包括:Active connections:当前活动连接数accepts:已接受的连接总数handled:已处理的连接总数requests:已处理的请求总数Reading:正在读取请求头的连接数Writing:正在发送响应的连接数Waiting:空闲连接数实际应用场景:高并发 Web 服务器:处理数万并发连接反向代理:作为入口网关负载均衡:分发请求到后端静态资源服务:高效提供静态文件性能测试:使用 wrk 或 ab 进行压力测试:# 使用 wrk 测试wrk -t12 -c4000 -d30s http://example.com/# 使用 ab 测试ab -n 10000 -c 1000 http://example.com/常见问题解决:连接数不足:增加 worker_connections 和系统文件描述符限制CPU 使用率高:检查 worker_processes 设置,避免过多内存不足:优化缓冲区大小,减少 worker_connections性能瓶颈:使用 epoll,开启 multiaccept,关闭 acceptmutex
阅读 0·2月21日 16:45

Nginx 的负载均衡有哪些策略?如何配置?

Nginx 的负载均衡有哪些策略?如何配置?Nginx 提供了多种负载均衡策略,可以根据不同的业务需求选择合适的算法。负载均衡通过 upstream 模块实现,可以将请求分发到多个后端服务器。主要负载均衡策略:1. 轮询(Round Robin,默认)按顺序依次将请求分配给每个服务器,适用于服务器性能相近的场景。upstream backend { server 192.168.1.100:8080; server 192.168.1.101:8080; server 192.168.1.102:8080;}2. 最少连接(Least Connections)将请求分配给当前活动连接数最少的服务器,适用于请求处理时间差异较大的场景。upstream backend { least_conn; server 192.168.1.100:8080; server 192.168.1.101:8080; server 192.168.1.102:8080;}3. IP 哈希(IP Hash)根据客户端 IP 地址进行哈希计算,确保同一 IP 的请求总是分配到同一台服务器,适用于需要会话保持的场景。upstream backend { ip_hash; server 192.168.1.100:8080; server 192.168.1.101:8080; server 192.168.1.102:8080;}4. 加权轮询(Weighted Round Robin)为每台服务器设置权重,权重高的服务器接收更多请求,适用于服务器性能不均衡的场景。upstream backend { server 192.168.1.100:8080 weight=3; server 192.168.1.101:8080 weight=2; server 192.168.1.102:8080 weight=1;}5. 哈希(Hash)根据指定的 key 进行哈希计算,可以是变量如 $requesturi、$cookiename 等。upstream backend { hash $request_uri consistent; server 192.168.1.100:8080; server 192.168.1.101:8080;}服务器状态参数:upstream backend { server 192.168.1.100:8080 weight=3 max_fails=3 fail_timeout=30s; server 192.168.1.101:8080 weight=2 max_fails=3 fail_timeout=30s; server 192.168.1.102:8080 down; server 192.168.1.103:8080 backup;}weight:服务器权重,默认为 1max_fails:允许的最大失败次数,超过则标记为不可用fail_timeout:失败超时时间,在标记不可用后的等待时间down:标记服务器为永久不可用backup:标记为备用服务器,只在主服务器都不可用时使用max_conns:限制最大并发连接数完整配置示例:http { upstream backend { least_conn; server 192.168.1.100:8080 weight=3 max_fails=3 fail_timeout=30s; server 192.168.1.101:8080 weight=2 max_fails=3 fail_timeout=30s; server 192.168.1.102:8080 weight=1 max_fails=3 fail_timeout=30s; server 192.168.1.103:8080 backup; keepalive 32; } server { listen 80; server_name example.com; location / { proxy_pass http://backend; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }}健康检查:Nginx 开源版本不提供主动健康检查,但可以通过被动健康检查(maxfails/failtimeout)实现。商业版 Nginx Plus 提供主动健康检查功能。选择策略建议:服务器性能相近:使用轮询请求处理时间差异大:使用最少连接需要会话保持:使用 IP 哈希服务器性能不均衡:使用加权轮询需要基于特定 key 分发:使用 hash
阅读 0·2月21日 16:45

Vercel 的 Edge Functions 和 Serverless Functions 有什么区别?

Vercel 的 Edge Functions 和 Serverless Functions 有什么区别?Vercel 提供了两种主要的计算服务:Edge Functions 和 Serverless Functions。虽然它们都用于运行后端代码,但在架构、性能、使用场景等方面有显著差异。理解这些区别对于选择合适的计算服务至关重要。Serverless Functions定义和架构什么是 Serverless Functions:运行在 Vercel 的无服务器计算平台上基于 AWS Lambda 或类似技术支持长时间运行的计算任务适合处理复杂的业务逻辑架构特点:分布式服务器集群冷启动时间较长(几百毫秒到几秒)更长的执行时间限制更大的内存配额支持完整的 Node.js 运行时特性执行环境:Node.js 运行时支持所有 Node.js 模块完整的文件系统访问(只读)支持数据库连接支持外部 API 调用性能特点:执行时间:最长 60 秒(Pro 计划)内存:最高 3008 MB(Pro 计划)冷启动:较慢(500ms - 3s)并发:受限于计划配额使用场景:复杂的数据处理长时间运行的 API数据库操作文件处理第三方 API 集成代码示例// pages/api/hello.jsexport default async function handler(req, res) { // 复杂的数据处理 const data = await fetchComplexData(); // 数据库操作 const result = await database.query(data); // 文件处理 const processed = await processFile(result); res.status(200).json({ data: processed });}export const config = { maxDuration: 30, // 30 秒执行时间 memory: 2048, // 2GB 内存};Edge Functions定义和架构什么是 Edge Functions:运行在 Vercel 的全球边缘网络上基于 V8 JavaScript 引擎极快的响应时间适合处理轻量级、低延迟的任务架构特点:全球分布的边缘节点极快的冷启动时间(几毫秒)更短的执行时间限制较小的内存配额受限的运行时环境特性执行环境:Edge Runtime(基于 V8)支持标准的 Web API受限的 Node.js API不支持文件系统访问不支持数据库连接池性能特点:执行时间:最长 30 秒内存:128 MB冷启动:极快(< 50ms)并发:高并发能力使用场景:请求路由和重定向A/B 测试地理位置路由认证和授权内容个性化缓存控制代码示例// middleware.jsimport { NextResponse } from 'next/server';import type { NextRequest } from 'next/server';export const runtime = 'edge';export function middleware(request: NextRequest) { // 极快的响应 const geo = request.geo; // 地理位置路由 if (geo?.country === 'CN') { return NextResponse.rewrite(new URL('/zh', request.url)); } // A/B 测试 const abTest = Math.random() > 0.5 ? 'A' : 'B'; const response = NextResponse.next(); response.cookies.set('ab-test', abTest); return response;}export const config = { matcher: '/((?!api|_next/static|_next/image|favicon.ico).*)',};详细对比1. 性能对比| 特性 | Serverless Functions | Edge Functions ||------|-------------------|----------------|| 冷启动时间 | 500ms - 3s | < 50ms || 执行时间限制 | 60s (Pro) | 30s || 内存限制 | 3008 MB (Pro) | 128 MB || 响应延迟 | 中等 | 极低 || 并发能力 | 中等 | 高 |2. 运行时对比| 特性 | Serverless Functions | Edge Functions ||------|-------------------|----------------|| 运行时 | Node.js | Edge Runtime (V8) || Node.js API | 完整支持 | 受限支持 || Web API | 支持 | 完整支持 || 文件系统 | 只读访问 | 不支持 || 数据库连接 | 支持 | 受限 |3. 使用场景对比| 场景 | Serverless Functions | Edge Functions ||------|-------------------|----------------|| 复杂计算 | ✅ 适合 | ❌ 不适合 || 数据处理 | ✅ 适合 | ❌ 不适合 || 请求路由 | ⚠️ 可以 | ✅ 最佳 || A/B 测试 | ⚠️ 可以 | ✅ 最佳 || 认证授权 | ⚠️ 可以 | ✅ 最佳 || 文件处理 | ✅ 适合 | ❌ 不适合 || API 集成 | ✅ 适合 | ⚠️ 受限 |选择指南选择 Serverless Functions 的场景1. 需要长时间运行的任务// 处理大型数据集export default async function handler(req, res) { const largeDataset = await fetchLargeDataset(); const processed = await processLargeData(largeDataset); res.status(200).json({ data: processed });}export const config = { maxDuration: 60, // 需要更长的执行时间};2. 需要数据库操作import { PrismaClient } from '@prisma/client';const prisma = new PrismaClient();export default async function handler(req, res) { // 复杂的数据库查询 const users = await prisma.user.findMany({ include: { posts: true, comments: true, }, }); res.status(200).json({ users });}3. 需要文件处理import formidable from 'formidable';export default async function handler(req, res) { const form = formidable({ multiples: true }); const [fields, files] = await form.parse(req); // 处理上传的文件 const processed = await processFiles(files); res.status(200).json({ processed });}4. 需要完整的 Node.js APIimport fs from 'fs/promises';import path from 'path';export default async function handler(req, res) { // 使用 Node.js 文件系统 const filePath = path.join(process.cwd(), 'data.json'); const data = await fs.readFile(filePath, 'utf-8'); res.status(200).json(JSON.parse(data));}选择 Edge Functions 的场景1. 需要极快响应的路由// middleware.jsimport { NextResponse } from 'next/server';export const runtime = 'edge';export function middleware(request: NextRequest) { // 极快的路由决策 if (request.nextUrl.pathname.startsWith('/api')) { return NextResponse.rewrite(new URL('/api-handler', request.url)); } return NextResponse.next();}2. 需要地理位置路由export function middleware(request: NextRequest) { const geo = request.geo; // 基于地理位置的路由 if (geo?.country === 'US') { return NextResponse.rewrite(new URL('/us', request.url)); } else if (geo?.country === 'CN') { return NextResponse.rewrite(new URL('/zh', request.url)); } return NextResponse.next();}3. 需要 A/B 测试export function middleware(request: NextRequest) { // A/B 测试逻辑 const variant = Math.random() > 0.5 ? 'A' : 'B'; const response = NextResponse.next(); response.cookies.set('ab-variant', variant); // 根据变体修改响应 if (variant === 'B') { response.headers.set('X-Experiment', 'B'); } return response;}4. 需要认证和授权export function middleware(request: NextRequest) { const token = request.cookies.get('auth-token'); // 快速认证检查 if (!token) { return NextResponse.redirect(new URL('/login', request.url)); } // 验证 token const isValid = verifyToken(token.value); if (!isValid) { return NextResponse.redirect(new URL('/login', request.url)); } return NextResponse.next();}混合使用策略1. 分层架构Edge Functions 处理路由和认证:// middleware.jsexport function middleware(request: NextRequest) { // 快速路由和认证 if (!isAuthenticated(request)) { return NextResponse.redirect(new URL('/login', request.url)); } return NextResponse.next();}Serverless Functions 处理业务逻辑:// pages/api/data.jsexport default async function handler(req, res) { // 复杂的业务逻辑 const data = await processBusinessLogic(req.body); res.status(200).json({ data });}2. 缓存策略Edge Functions 处理缓存:export function middleware(request: NextRequest) { const cacheKey = request.url; // 检查缓存 const cached = cache.get(cacheKey); if (cached) { return new Response(cached, { headers: { 'X-Cache': 'HIT' } }); } return NextResponse.next();}Serverless Functions 生成数据:export default async function handler(req, res) { // 生成数据 const data = await generateData(); // 设置缓存头 res.setHeader('Cache-Control', 'public, max-age=3600'); res.status(200).json(data);}性能优化建议1. Serverless Functions 优化减少冷启动:保持函数热状态使用连接池优化依赖加载使用预编译优化执行时间:避免长时间运行的任务使用异步处理优化数据库查询使用缓存2. Edge Functions 优化极简代码:只包含必要的逻辑避免复杂的计算使用轻量级依赖优化代码大小利用缓存:使用 KV 存储实现智能缓存设置合理的缓存时间使用 CDN 缓存成本考虑1. Serverless Functions 成本计费方式:按执行时间计费按内存使用计费按请求次数计费成本优化:优化执行时间减少内存使用实现缓存策略批量处理请求2. Edge Functions 成本计费方式:按请求次数计费按执行时间计费成本优化:减少不必要的 Edge Functions优化代码逻辑使用缓存减少调用合理使用路由规则最佳实践1. 架构设计分层设计:Edge Functions:路由、认证、缓存Serverless Functions:业务逻辑、数据处理数据库:数据存储和查询职责分离:每个函数只做一件事避免过度复杂便于测试和维护2. 监控和调试性能监控:监控执行时间监控冷启动时间监控错误率监控资源使用日志记录:记录关键操作记录错误信息记录性能指标使用结构化日志3. 测试策略单元测试:测试函数逻辑测试边界条件测试错误处理集成测试:测试函数间交互测试数据库集成测试 API 集成性能测试:测试响应时间测试并发能力测试冷启动时间总结Serverless Functions 适合:复杂的业务逻辑长时间运行的任务数据库操作文件处理需要完整 Node.js APIEdge Functions 适合:极快响应的路由地理位置路由A/B 测试认证和授权内容个性化缓存控制最佳实践:根据需求选择合适的函数类型混合使用两种函数类型实现分层架构优化性能和成本持续监控和改进通过理解 Serverless Functions 和 Edge Functions 的区别,开发者可以更好地设计应用架构,选择合适的计算服务,实现最佳的性能和成本效益。
阅读 0·2月21日 16:45

如何在 Vercel 上配置自定义域名和 SSL 证书?

如何在 Vercel 上配置自定义域名和 SSL 证书?在 Vercel 上配置自定义域名和 SSL 证书是一个简单直接的过程,Vercel 提供了自动化的 SSL 证书管理,使得这一过程变得非常便捷。自定义域名配置1. 添加自定义域名通过 Vercel Dashboard 添加:登录 Vercel Dashboard选择你的项目进入 "Settings" → "Domains"点击 "Add Domain"输入你的域名(如 example.com 或 www.example.com)选择域名类型:Production:用于生产环境Preview:用于预览部署通过 Vercel CLI 添加:# 添加生产域名vercel domains add example.com# 添加预览域名vercel domains add preview.example.com --preview2. 域名类型Vercel 支持以下域名类型:根域名:example.com需要配置 A 记录或 CNAME 别名记录子域名:www.example.comblog.example.comapi.example.com使用 CNAME 记录通配符域名:*.example.com匹配所有子域名需要付费计划3. DNS 配置配置步骤:在 Vercel Dashboard 中查看 DNS 配置要求登录你的域名注册商(如 GoDaddy、Namecheap、Cloudflare)根据类型添加相应的 DNS 记录A 记录配置(用于根域名):Type: AName: @Value: 76.76.21.21TTL: 3600 (或默认值)CNAME 记录配置(用于子域名):Type: CNAMEName: wwwValue: cname.vercel-dns.comTTL: 3600 (或默认值)使用 Cloudflare 时的特殊配置:如果你使用 Cloudflare 作为 DNS 提供商,需要注意:代理模式:启用 Cloudflare 代理(橙色云朵)时,Vercel 可能无法正确验证域名所有权建议先禁用代理(灰色云朵),等待验证通过后再启用SSL 模式:设置为 "Full" 或 "Full (strict)"不要使用 "Flexible" 模式4. 域名验证验证过程:添加 DNS 记录后,Vercel 会自动验证域名配置验证通常需要几分钟到几小时(取决于 DNS 传播)验证成功后,域名状态会显示为 "Valid Configuration"验证检查:# 检查 DNS 记录是否生效dig example.com# 检查 CNAME 记录dig www.example.com CNAME# 检查 DNS 传播nslookup example.comSSL 证书配置1. 自动 SSL 证书Vercel 使用 Let's Encrypt 自动为你的域名提供 SSL 证书:特点:完全免费自动续期支持 HTTP/2 和 HTTP/3自动配置证书类型:单域名证书:保护单个域名通配符证书:保护主域名及其所有子域名(需要付费计划)2. SSL 证书自动管理自动颁发:域名验证通过后,Vercel 自动颁发 SSL 证书通常在几分钟内完成无需手动操作自动续期:证书到期前 30 天自动续期无需担心证书过期完全自动化证书监控:Vercel 持续监控证书状态发现问题时自动修复在 Dashboard 中可以查看证书详情3. 强制 HTTPS自动重定向:Vercel 默认将所有 HTTP 请求重定向到 HTTPS:// 在 vercel.json 中配置{ "redirects": [ { "source": "/:path*", "has": [ { "type": "host", "value": "example.com" } ], "destination": "https://example.com/:path*", "permanent": true } ]}HSTS 配置:{ "headers": [ { "source": "/(.*)", "headers": [ { "key": "Strict-Transport-Security", "value": "max-age=31536000; includeSubDomains" } ] } ]}高级配置1. 多域名配置添加多个域名:在 Domains 设置中逐个添加域名为每个域名配置 DNS 记录等待所有域名验证通过主域名设置:// 在 vercel.json 中设置主域名{ "name": "my-project", "alias": ["example.com", "www.example.com"]}2. 环境特定域名预览环境域名:# 为预览部署添加特定域名vercel domains add preview.example.com --preview开发环境域名:# 为开发环境添加域名vercel domains add dev.example.com --dev3. 自定义 404 页面配置自定义 404 页面:// 在 vercel.json 中配置{ "rewrites": [ { "source": "/404", "destination": "/custom-404.html" } ], "notFound": true}故障排除1. 域名验证失败常见原因:DNS 记录配置错误DNS 传播未完成域名已被其他服务使用Cloudflare 代理模式问题解决方案:检查 DNS 记录是否正确使用 DNS 检查工具验证记录等待 DNS 传播完成(最多 48 小时)如果使用 Cloudflare,暂时禁用代理# 检查 DNS 记录dig example.com +short# 检查 WHOIS 信息whois example.com# 检查 DNS 传播dig example.com @8.8.8.82. SSL 证书颁发失败常见原因:域名验证未通过DNS 记录配置错误防火墙阻止 Let's Encrypt 验证域名已被其他证书使用解决方案:确保域名验证通过检查 DNS 记录配置检查防火墙设置在 Dashboard 中手动触发证书重新颁发3. HTTPS 重定向不工作检查清单:确认 SSL 证书已颁发检查 Vercel 配置中的重定向设置清除浏览器缓存使用隐私模式测试最佳实践1. 域名管理使用版本控制管理域名配置定期检查域名到期时间为重要域名设置自动续费保留域名访问权限的备份2. SSL 安全启用 HSTS 以强制 HTTPS定期检查 SSL 证书状态使用强密码保护域名账户启用双因素认证3. 监控和告警设置域名到期提醒监控 SSL 证书状态配置网站可用性监控设置错误告警4. 性能优化使用 CDN 加速静态资源启用 HTTP/2 和 HTTP/3优化 DNS 解析时间使用现代 TLS 版本常见问题解答Q1: 可以使用免费域名吗?A: 可以,Vercel 支持任何合法的域名,包括免费域名。但建议使用付费域名以获得更好的稳定性和支持。Q2: SSL 证书有数量限制吗?A: 免费计划中,每个项目可以添加无限数量的域名,每个域名都会自动获得 SSL 证书。Q3: 如何迁移现有域名到 Vercel?A: 在 Vercel 中添加域名更新 DNS 记录指向 Vercel等待 DNS 传播验证配置正确Q4: 可以使用自己的 SSL 证书吗?A: Vercel 不支持上传自定义 SSL 证书,必须使用 Vercel 自动颁发的 Let's Encrypt 证书。Q5: 域名配置需要多长时间生效?A: 通常需要几分钟到几小时,最长可能需要 48 小时(DNS 传播时间)。总结在 Vercel 上配置自定义域名和 SSL 证书的主要优势:自动化:SSL 证书自动颁发和续期简单:直观的配置界面免费:Let's Encrypt SSL 证书完全免费安全:自动 HTTPS 重定向可靠:99.99% 的正常运行时间保证通过遵循上述步骤和最佳实践,你可以轻松地在 Vercel 上配置自定义域名和 SSL 证书,为你的网站提供安全、专业的访问体验。
阅读 0·2月21日 16:28