入门
使用 Hono 非常容易。我们可以设置项目,编写代码,使用本地服务器进行开发,并快速部署。相同的代码将在任何运行时都能正常工作,只是入口点不同。让我们看一下 Hono 的基本用法。
入门项目
每个平台都提供入门项目模板。使用以下 "create-hono" 命令。
npm create hono@latest my-app
yarn create hono my-app
pnpm create hono@latest my-app
bun create hono@latest my-app
deno run -A npm:create-hono@latest my-app
然后,您将被询问要使用哪个模板。在本例中,我们选择 Cloudflare Workers。
? Which template do you want to use?
aws-lambda
bun
cloudflare-pages
❯ cloudflare-workers
deno
fastly
nextjs
nodejs
vercel
模板将被拉取到 my-app
中,所以进入该目录并安装依赖项。
cd my-app
npm i
cd my-app
yarn
cd my-app
pnpm i
cd my-app
bun i
包安装完成后,运行以下命令启动本地服务器。
npm run dev
yarn dev
pnpm dev
bun run dev
Hello World
您可以使用 Cloudflare Workers 开发工具 "Wrangler"、Deno、Bun 或其他工具以 TypeScript 编写代码,而无需担心转译。
在 src/index.ts
中使用 Hono 编写您的第一个应用程序。以下示例是一个 Hono 入门应用程序。
import
和最终的 export default
部分可能因运行时而异,但所有应用程序代码都将在任何地方运行相同的代码。
import { Hono } from 'hono'
const app = new Hono()
app.get('/', (c) => {
return c.text('Hello Hono!')
})
export default app
启动开发服务器并使用浏览器访问 https://127.0.0.1:8787
。
npm run dev
yarn dev
pnpm dev
bun run dev
返回 JSON
返回 JSON 也很容易。以下示例演示了如何处理对 /api/hello
的 GET 请求并返回一个 application/json
响应。
app.get('/api/hello', (c) => {
return c.json({
ok: true,
message: 'Hello Hono!',
})
})
请求和响应
获取路径参数、URL 查询值以及附加响应头,代码如下。
app.get('/posts/:id', (c) => {
const page = c.req.query('page')
const id = c.req.param('id')
c.header('X-Message', 'Hi!')
return c.text(`You want see ${page} of ${id}`)
})
我们可以轻松地处理 GET 以外的 POST、PUT 和 DELETE 请求。
app.post('/posts', (c) => c.text('Created!', 201))
app.delete('/posts/:id', (c) =>
c.text(`${c.req.param('id')} is deleted!`)
)
返回 HTML
您可以使用 html 助手 或使用 JSX 语法编写 HTML。如果您想使用 JSX,请将文件重命名为 src/index.tsx
并进行配置(请根据不同的运行时进行检查,因为它们有所不同)。以下示例使用 JSX。
const View = () => {
return (
<html>
<body>
<h1>Hello Hono!</h1>
</body>
</html>
)
}
app.get('/page', (c) => {
return c.html(<View />)
})
返回原始响应
您还可以返回原始 响应。
app.get('/', (c) => {
return new Response('Good morning!')
})
使用中间件
中间件可以为您完成繁重的工作。例如,添加基本身份验证。
import { basicAuth } from 'hono/basic-auth'
// ...
app.use(
'/admin/*',
basicAuth({
username: 'admin',
password: 'secret',
})
)
app.get('/admin', (c) => {
return c.text('You are authorized!')
})
Hono 提供了许多实用的内置中间件,包括使用 JWT 的 Bearer 身份验证、CORS 和 ETag。Hono 还使用外部库(如 GraphQL Server 和 Firebase Auth)提供第三方中间件。此外,您还可以创建自己的中间件。
适配器
对于特定于平台的功能,例如处理静态文件或 WebSocket,存在相应的适配器。例如,要在 Cloudflare Workers 中处理 WebSocket,请导入 hono/cloudflare-workers
。
import { upgradeWebSocket } from 'hono/cloudflare-workers'
app.get(
'/ws',
upgradeWebSocket((c) => {
// ...
})
)
下一步
大多数代码都可以在任何平台上运行,但每个平台都有相应的指南。例如,如何设置项目或如何部署。请查看您要用于创建应用程序的特定平台的页面!