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

功能集成

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

功能定制

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

代码库

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

产品示例

MkImage
X (Twitter)

MkImage

了解如何部署 MkImage - 基于 TanStarter 构建的 AI 生图网站

MkImage 是一个基于 TanStarter 模板开发的 AI 生图网站。源码可在 mkfast-app 获取。

由于 MkImage 基于 TanStarter 模板开发，配置和部署流程与模板基本一致。请参考 快速开始、环境配置 和 网站部署 文档完成基础设置。

本文档重点介绍 MkImage 特有的额外配置。

AI 生图模型服务商

MkImage 支持两个 AI 生图服务商。你需要注册账号并在其管理后台生成 API Key。

Fal.ai 是一个快速的 AI 模型推理平台。

  1. 在 fal.ai 创建账号
  2. 进入管理后台的 API Keys 页面
  3. 点击 Create API Key 生成新的密钥
  4. 复制密钥并设置为 FAL_KEY 环境变量
.env
IMAGE_MODEL_PROVIDER='fal'
FAL_KEY='your-fal-api-key'

APIMart 是一个提供多种 AI 模型访问的 API 市场。

  1. 在 apimart.com 创建账号
  2. 进入管理后台的 API Keys 管理页面
  3. 生成新的 API Key
  4. 复制密钥并设置为 APIMART_KEY 环境变量
.env
IMAGE_MODEL_PROVIDER='apimart'
APIMART_KEY='your-apimart-api-key'

其他生图相关配置

变量说明
IMAGE_MODEL_PROVIDER生图服务商：fal 或 apimart
VITE_SHOW_IMAGE_PROVIDER在生成页面显示服务商选择器（true/false）
VITE_ENABLE_IMAGE_GENERATION启用生图功能（true/false）

存储（Cloudflare R2）

MkImage 使用 Cloudflare R2 来存储提示词数据和提示词预览图片。你需要配置 R2 来导入和展示这些内容。

创建 Cloudflare R2 存储桶

  1. 在 cloudflare.com 创建 Cloudflare 账户
  2. 创建新的 R2 存储桶：
    • 选择全局唯一的存储桶名称（例如 mkimage）
    • 选择靠近目标受众的区域

启用公共访问

允许对存储桶的公共访问：

  • Settings > Public Development URL，点击 Enable
  • 将公共访问 URL 保存为 R2_PUBLIC_URL
  • 为存储桶的公共访问设置自定义域名（推荐使用自定义域名以提高安全性）

创建 API 令牌

创建新的 API 令牌：

  • Storage & databases > R2 object storage > API Tokens > Manage，点击 Create User API Token
  • 将权限设置为对存储桶的 Object Read & Write
  • 创建 API 令牌，获取 Access Key ID 和 Secret Access Key

设置环境变量

设置以下环境变量：

.env
R2_BUCKET_NAME='your-bucket-name'
R2_ACCESS_KEY_ID='your-access-key-id'
R2_SECRET_ACCESS_KEY='your-secret-access-key'
R2_PUBLIC_URL='https://your-r2-public-url.com'

导入内置提示词

MkImage 内置了一套提示词数据集，你可以将其导入到数据库中。导入脚本会将提示词数据和预览图片同步到 D1 数据库和 R2 存储。

下载提示词数据集

首先，下载最新的提示词数据集：

pnpm prompt:download

执行数据库迁移

确保提示词相关的数据库表已创建：

# 本地开发
pnpm db:migrate:local

# 远程 / 生产环境
pnpm db:migrate:remote

同步提示词到本地

将提示词导入本地 D1 数据库和 R2 存储：

pnpm prompts:sync:local

这将把提示词记录插入数据库，并将预览图片上传到 R2。

同步提示词到远程（生产环境）

在本地验证无误后，将提示词同步到远程生产环境：

pnpm prompts:sync:remote

常用参数

同步脚本支持以下可选参数：

参数说明
--limit=<n>只导入前 N 条记录（适合测试）
--skip-images跳过图片下载/上传（仅导入文本）
--force强制重新导入已存在的提示词
--dry-run预览变更，不写入 DB/R2
--concurrency=<n>并行导入数量（默认：10）

更新提示词

未来更新提示词数据集：

# 拉取最新数据集
pnpm prompt:download

# 先同步到本地验证
pnpm prompts:sync:local

# 确认无误后同步到生产环境
pnpm prompts:sync:remote

已存在的提示词默认会被跳过，只有新提示词和缺失的图片会被导入，除非你传入 --force 参数。

环境变量汇总

以下是在 TanStarter 基础配置之上，MkImage 需要额外配置的所有环境变量：

.env
# 生图服务商 (apimart 或 fal)
IMAGE_MODEL_PROVIDER='apimart'
VITE_SHOW_IMAGE_PROVIDER='false'
VITE_ENABLE_IMAGE_GENERATION='true'

# Fal
FAL_KEY=''

# APIMart
APIMART_KEY=''

# 存储 (R2) - 用于提示词和提示词图片
R2_BUCKET_NAME=''
R2_ACCESS_KEY_ID=''
R2_SECRET_ACCESS_KEY=''
R2_PUBLIC_URL=''

下一步

快速开始

快速开始指南

环境配置

配置所有环境变量

部署

部署到 Cloudflare Workers

Cloudflare

配置 Cloudflare 服务

更新代码库

如何保持您的 TanStarter 项目与最新仓库代码同步

目录

AI 生图模型服务商
其他生图相关配置
存储（Cloudflare R2）
创建 Cloudflare R2 存储桶
启用公共访问
创建 API 令牌
设置环境变量
导入内置提示词
下载提示词数据集
执行数据库迁移
同步提示词到本地
同步提示词到远程（生产环境）
常用参数
更新提示词
环境变量汇总
下一步