Loving Tina? us on GitHub0.0k
v.Latest
Documentation

自托管手动设置

Loading last updated info...
在此页面上

1. 选择一个Git提供商、数据库适配器和认证提供商

您需要选择一个Git提供商、数据库适配器和认证提供商。您可以使用我们创建的任何提供商，或者您可以创建自己的。在下面的示例中，我们将使用GitHub、Vercel KV和TinaCMS Auth.js提供商。

如果您需要的Git提供商、数据库适配器或认证提供商不可用，您可以选择创建自己的。有关此过程的帮助，请参阅自托管解决方案的文档，其中提供了详细的指导。

2. 安装依赖项

yarn add tinacms @tinacms/datalayer
yarn add --dev @tinacms/cli

安装您选择的git提供商、数据库适配器和认证提供商的任何依赖项（这可能会根据您的选择而有所不同）

yarn add tinacms-gitprovider-github tinacms-authjs upstash-redis-level @upstash/redis

3. 创建一个数据库文件

在项目的tina文件夹中创建一个名为database.{js,ts}的文件。此文件将用于创建数据库。

tina/database.{ts,js}

import { createDatabase, createLocalDatabase } from '@tinacms/datalayer'


// 将此更改为您选择的git提供商
import { GitHubProvider } from 'tinacms-gitprovider-github'


// 将此更改为您选择的数据库适配器
import { Redis } from '@upstash/redis'
import { RedisLevel } from 'upstash-redis-level'


// 在您的CI/CD管道中管理此标志，并确保在生产环境中将其设置为false
const isLocal = process.env.TINA_PUBLIC_IS_LOCAL === 'true'


const branch =
  process.env.GITHUB_BRANCH || process.env.VERCEL_GIT_COMMIT_REF || 'main'


if (!branch) {
  throw new Error(
    '未找到分支。请确保已设置GITHUB_BRANCH或process.env.VERCEL_GIT_COMMIT_REF环境变量。'
  )
}


export default isLocal
  ? // 如果我们在本地运行，使用一个在内存中存储数据并在保存时写入本地文件系统的本地数据库
    createLocalDatabase()
  : // 如果我们不在本地运行，使用一个在redis中存储数据并将数据保存到github的数据库
    createDatabase({
      // 可能会根据您的git提供商有所不同
      gitProvider: new GitHubProvider({
        repo: process.env.GITHUB_REPO || process.env.VERCEL_GIT_REPO_SLUG,
        owner: process.env.GITHUB_OWNER || process.env.VERCEL_GIT_REPO_OWNER,
        token: process.env.GITHUB_PERSONAL_ACCESS_TOKEN,
        branch,
      }),
      // 可能会根据您的数据库适配器有所不同
      databaseAdapter: new RedisLevel<string, Record<string, any>>({
        redis: new Redis({
          url:
            (process.env.KV_REST_API_URL as string) || 'http://localhost:8079',
          token: (process.env.KV_REST_API_TOKEN as string) || 'example_token',
        }),
        debug: process.env.DEBUG === 'true' || false,
        namespace: branch,
      }),
    })

4. 托管Tina后端

您将需要一个后端端点来托管GraphQL和认证API端点。

在此示例中，我们将展示如何在Vercel上托管GraphQL API。您可以使用任何您想要的托管提供商（代码可能需要根据您选择的框架进行调整）。

// pages/api/tina/[...routes].{ts,js}


import { TinaNodeBackend, LocalBackendAuthProvider } from '@tinacms/datalayer'
import { TinaAuthJSOptions, AuthJsBackendAuthProvider } from 'tinacms-authjs'


import databaseClient from '../../../tina/__generated__/databaseClient'


const isLocal = process.env.TINA_PUBLIC_IS_LOCAL === 'true'


const handler = TinaNodeBackend({
  authProvider: isLocal
    ? LocalBackendAuthProvider()
    : AuthJsBackendAuthProvider({
        authOptions: TinaAuthJSOptions({
          databaseClient: databaseClient,
          secret: process.env.NEXTAUTH_SECRET,
        }),
      }),
  databaseClient,
})


export default (req, res) => {
  // 如果需要，可以在此处修改请求
  return handler(req, res)
}
更多信息请参见后端托管

在Next.js之外托管

上面的示例是一个Next.js API路由，但TinaNodeBackend本身并不依赖于Next。它是一个简单的Node (req, res)处理程序，期望一个已解析的req.body，因此任何能够提供该对的东西都可以为其服务。

它不能直接挂载在一个签名为web Request / Response API的路由中，这是Astro的APIRoute和SvelteKit的+server.ts提供的。两种形状可以替代：

  • 将其挂载在Node服务器中。 可以构建为Connect/Express中间件的框架，例如Astro通过@astrojs/node在mode: 'middleware'中，让一个服务器使用TinaNodeBackend处理/api/tina/*，并将其他所有内容传递给框架。将body解析器限定在该路径上，app.use('/api/tina', express.json())：TinaNodeBackend需要填充req.body，但解析每个路由会消耗框架需要用于其自身表单提交的流。
  • 将其作为独立的无服务器函数部署在您的站点旁边：Vercel Functions或Netlify Functions。tina-self-hosted-static-demo是一个静态站点的工作示例，后端作为其自身的函数。

5. 更新TinaCMS配置

更新TinaCMS配置以使用您在上一步中创建的GraphQL API。

// tina/config.{js,ts}


export default defineConfig({
  // 确保将此设置为您的GraphQL API的URL
  contentApiUrlOverride: '/api/tina/gql',
  authProvider:  // 添加您的认证提供商。请参阅您选择的认证提供商的文档。
  //...
})

现在您应该能够运行您的站点并使用TinaCMS编辑您的内容。有关如何自托管TinaCMS的更多信息，请参阅配置组件的文档。

下一步

  • 如果您想更改您的Git提供商、数据库适配器或认证提供商，请查看参考。
  • 有问题吗？请在我们的Discord中询问
上一页
在Next.js站点上自托管设置
下一页
从TinaCloud迁移到自托管