---

title: 与 Expo 集成 - ElysiaJS head: - - meta - property: 'og:title' content: 与 Expo 集成 - ElysiaJS

- - meta
  - name: 'description'
    content: 借助 Expo App Router，你可以在 Expo 路由上运行 Elysia。得益于 WinterCG 规范的兼容性，Elysia 将如预期般正常工作。

- - meta
  - property: 'og:description'
    content: 借助 Expo App Router，你可以在 Expo 路由上运行 Elysia。得益于 WinterCG 规范的兼容性，Elysia 将如预期般正常工作。

---

与 Expo 集成

从 Expo SDK 50 和 App Router v3 开始，Expo 允许我们直接在 Expo 应用中创建 API 路由。

1. 创建 app/[...slugs]+api.ts
2. 定义一个 Elysia 服务器
3. 导出你想要使用的 HTTP 方法的 Elysia.fetch 名称

app/[...slugs]+api.ts

import { Elysia, t } from 'elysia'

const app = new Elysia()
    .get('/', '你好 Expo')
    .post('/', ({ body }) => body, {
        body: t.Object({
            name: t.String()
        })
    })

export const GET = app.fetch 
export const POST = app.fetch 

你可以像对待普通的 Expo API 路由一样对待 Elysia 服务器。

前缀

如果你将 Elysia 服务器放置在 app router 的根目录之外，你需要为 Elysia 服务器标注前缀。

例如，如果你将 Elysia 服务器放置在 app/api/[...slugs]+api.ts 中，你需要为 Elysia 服务器标注 /api 作为前缀。

app/api/[...slugs]+api.ts

import { Elysia, t } from 'elysia'

const app = new Elysia({ prefix: '/api' }) 
    .get('/', '你好 Expo')
    .post('/', ({ body }) => body, {
        body: t.Object({
            name: t.String()
        })
    })

export const GET = app.fetch
export const POST = app.fetch

这将确保无论你将 Elysia 放置在哪个位置，其路由都能正常工作。

Eden

我们可以添加 Eden 来实现类似于 tRPC 的 端到端类型安全。

1. 从 Elysia 服务器导出 type

app/[...slugs]+api.ts

import { Elysia } from 'elysia'

const app = new Elysia()
	.get('/', '你好 Nextjs')
	.post(
		'/user',
		({ body }) => body,
		{
			body: treaty.schema('用户', {
				name: '字符串'
			})
		}
	)

export type app = typeof app 

export const GET = app.fetch
export const POST = app.fetch

2. 创建一个 Treaty 客户端

lib/eden.ts

import { treaty } from '@elysiajs/eden'
import type { app } from '../app/[...slugs]+api'

export const api = treaty<app>('localhost:3000/api')

3. 在服务端和客户端组件中使用该客户端

app/page.tsx

import { api } from '../lib/eden'

export default async function Page() {
	const message = await api.get()

	return <h1>你好, {message}</h1>
}

部署

如果需要，你可以直接使用 Elysia 的 API 路由，并像普通 Elysia 应用一样部署，或者使用 实验性的 Expo 服务器运行时。

如果你使用 Expo 服务器运行时，你可以使用 expo export 命令为你的 expo 应用创建优化构建，这将包含一个使用 Elysia 的 Expo 函数，位于 dist/server/_expo/functions/[...slugs]+api.js

TIP

请注意，Expo Functions 被视为 Edge 函数而非普通服务器，因此直接运行 Edge 函数不会分配任何端口。

你可以使用 Expo 提供的 Expo 函数适配器来部署你的 Edge Function。

目前 Expo 支持以下适配器：

• Express
• Netlify
• Vercel