出海技术栈集成教程(六):Upstash 集成 Redis 与请求限流器

我开发了 next.js saas 模板 Nexty.dev,很多用户告诉我文档太详细了,于是我决定把出海技术栈、海外第三方服务集成的文档发出来,希望帮到更多出海的朋友。👉 原文链接

本系列分享的内容包含:

  • 域名购买、解析与配置
  • Supabase 集成教程:登录与数据库
  • Stripe 集成教程:支付配置与开发
  • Resend 集成教程:邮件服务
  • 域名邮箱配置教程:域名邮箱
  • Upstash 集成教程:Redis 与限流器
  • Cloudflare R2集成教程:免费图片存储
  • Cloudflare Turnstile集成教程:免费人机检测

Upstash 是一项现代化的无服务器数据基础设施服务,专门为云原生应用设计。它提供 Redis 和 Kafka 的托管服务,具有以下核心特性:

主要优势

特性 传统 Redis Upstash Redis
计费模式 按时间计费 按请求计费
运维成本 需要维护服务器 零运维
扩展性 手动扩缩容 自动扩缩容
全球分布 需要自建 内置全球分布
冷启动 毫秒级冷启动

适用场景

  • 缓存系统:提升应用响应速度
  • 会话存储:用户登录状态管理
  • 限流器:API 访问频率控制
  • 计数器:实时统计数据
  • 消息队列:异步任务处理
  • 实时数据:聊天、通知等功能

Redis 在 SaaS 项目中的作用

在复杂商业化项目中,Redis 通常是必不可少的基础设施,主要应用场景包括:

1. 缓存层

javascript 复制代码
// 缓存用户数据
await redis.setex(`user:${userId}`, 3600, JSON.stringify(userData));

// 缓存 API 响应
await redis.setex(`api:posts:${page}`, 300, JSON.stringify(posts));

2. 限流器

javascript 复制代码
// API 限流
const key = `rate_limit:${userId}:${endpoint}`;
const current = await redis.incr(key);
if (current === 1) {
  await redis.expire(key, 60); // 1分钟窗口
}
if (current > 100) {
  throw new Error('Rate limit exceeded');
}

3. 会话管理

javascript 复制代码
// 存储用户会话
await redis.setex(`session:${sessionId}`, 86400, JSON.stringify({
  userId,
  permissions,
  lastActivity: Date.now()
}));

4. 实时计数

javascript 复制代码
// 文章浏览量
await redis.incr(`views:article:${articleId}`);

// 在线用户数
await redis.sadd('online_users', userId);

Nexty 模板中的 Redis 集成

为了满足不同使用场景,Nexty 模板对 Redis 和限流器进行了封装,并采用了灵活的兼容设计:

  • 如果配置了 Upstash 环境变量,则支持调用封装好的 Redis 和限流器方法
  • 如果未配置 Upstash 环境变量,相关功能会自动降级,不会影响其他业务逻辑

为了大家更快上手,模板在邮件订阅功能中集成了限流器示例,它会根据是否配置了 Upstash 环境变量,自动决定是否启用限流功能。

本章我们来完成 Upstash 的注册与配置。

注册与基础配置

  1. 访问 Upstash,使用邮箱注册账号

  2. 进入 Dashboard 页面,点击 Create database 按钮

  1. 进入数据库详情页面,在 REST API 模块复制 UPSTASH_REDIS_REST_URLUPSTASH_REDIS_REST_TOKEN 到环境变量

验证

现在你可以再次尝试提交邮件订阅,并查看 Upstash Redis 的 Data Browser 页面,有新增数据,则说明订阅的限流器生效了。

总结

出海技术栈集成系列文章会同步发布到我的掘金专栏,欢迎订阅关注。

同时也欢迎出海的朋友了解 Top3 的出海 Next.js SaaS 模板 Nexty.dev

相关推荐
@大迁世界13 分钟前
TypeScript 的本质并非类型,而是信任
开发语言·前端·javascript·typescript·ecmascript
GIS之路22 分钟前
GDAL 实现矢量裁剪
前端·python·信息可视化
是一个Bug25 分钟前
后端开发者视角的前端开发面试题清单(50道)
前端
Amumu1213827 分钟前
React面向组件编程
开发语言·前端·javascript
持续升级打怪中1 小时前
Vue3 中虚拟滚动与分页加载的实现原理与实践
前端·性能优化
GIS之路1 小时前
GDAL 实现矢量合并
前端
hxjhnct1 小时前
React useContext的缺陷
前端·react.js·前端框架
前端 贾公子1 小时前
从入门到实践:前端 Monorepo 工程化实战(4)
前端
菩提小狗1 小时前
Sqlmap双击运行脚本,双击直接打开。
前端·笔记·安全·web安全
前端工作日常2 小时前
我学习到的AG-UI的概念
前端