LogoTanStarter 文档
LogoTanStarter 文档
首页模板介绍代码库快速开始环境配置
网站配置
部署

功能集成

Cloudflare数据库身份验证邮件邮件订阅存储支付通知分析聊天框联盟营销

功能定制

元数据页面落地页博客组件用户管理密钥管理

代码库

项目结构代码检查编辑器设置更新代码库
X (Twitter)

邮件订阅

学习如何设置和使用 Resend 进行邮件订阅管理

TanStarter 使用 Resend 来管理邮件订阅。

设置

创建 Resend 账户

在 resend.com 创建 Resend 账户。

获取 API 密钥

点击 API Keys > Create API Key,设置权限为 Send emails 或 Full access。复制 API Key,并添加到环境变量文件:

.env
RESEND_API_KEY=your-resend-api-key

更新网站配置

更新网站配置以使用 Resend 进行邮件订阅管理:

src/config/website.ts
export const websiteConfig = {
  // ...其他配置
  newsletter: {
    enable: true,
    provider: 'resend',
    autoSubscribeAfterSignUp: true, // 是否在用户注册后自动订阅
  },
  // ...其他配置
}

如果您正在设置环境,现在可以回到环境配置文档并继续。本文档的其余部分可以稍后阅读。

环境配置

设置环境变量


自定义

创建自定义提供商

如果您需要使用不同的邮件订阅服务,您可以创建自定义邮件订阅服务提供商:

  1. 在 src/newsletter/provider 目录中创建新的文件
  2. 实现 NewsletterProvider 接口
src/newsletter/provider/custom-provider.ts
import type {
  CheckSubscribeStatusParams,
  NewsletterProvider,
  SubscribeNewsletterParams,
  UnsubscribeNewsletterParams,
} from '@/newsletter/types';

export class CustomNewsletterProvider implements NewsletterProvider {
  constructor() {
    // 初始化您的邮件订阅服务提供商
  }

  public getProviderName(): string {
    return 'custom';
  }

  async subscribe({ email }: SubscribeNewsletterParams): Promise<boolean> {
    // 订阅用户的实现
    return true;
  }

  async unsubscribe({ email }: UnsubscribeNewsletterParams): Promise<boolean> {
    // 取消订阅用户的实现
    return true;
  }

  async checkSubscribeStatus({ email }: CheckSubscribeStatusParams): Promise<boolean> {
    // 检查订阅状态的实现
    return true;
  }
}
  1. 在 src/newsletter/index.ts 中的 providerRegistry 注册新的邮件订阅服务提供商:
src/newsletter/index.ts
import { CustomNewsletterProvider } from './provider/custom-provider';

const providerRegistry: Record<NewsletterProviderName, ProviderFactory> = {
  resend: () => new ResendNewsletterProvider(),
  custom: () => new CustomNewsletterProvider(),
};

下一步

现在您了解了如何在 TanStarter 中使用邮件订阅,您可能想要探索这些相关功能:

邮件

配置邮件服务

身份验证

配置用户身份验证

统计分析

配置统计分析服务

存储

配置存储服务

邮件

学习如何使用 Resend 和 React Email 模板设置和使用邮件功能

存储

学习如何设置和使用 Cloudflare R2 进行文件上传和媒体处理

目录

设置
创建 Resend 账户
获取 API 密钥
更新网站配置
自定义
创建自定义提供商
下一步