Jamdesk Documentation logo

示例

在桌面端的粘性右侧栏中固定代码块,并可选择语言标签页,读者滚动页面时代码始终保持可见。

这些组件在桌面端将代码块固定在粘性右侧栏中。读者滚动页面时,代码始终保持可见。在移动端,代码块以内联方式显示。

RequestExample

使用 RequestExample 展示 API 请求代码。每增加一个代码块,就会增加一个标签页。

curl -X POST https://api.example.com/users \
  -H "Authorization: Bearer $TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"name": "John Doe", "email": "john@example.com"}'

用法:

<RequestExample>
```bash cURL
curl -X POST https://api.example.com/users \
  -H "Authorization: Bearer $TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"name": "John Doe", "email": "john@example.com"}'
```
</RequestExample>

ResponseExample

使用 ResponseExample 展示 API 响应。在语言标识符后添加状态码和描述。

{
  "id": "usr_123",
  "name": "John Doe",
  "email": "john@example.com",
  "created_at": "2024-01-15T10:30:00Z"
}

用法:

<ResponseExample>
```json 200: Success
{
  "id": "usr_123",
  "name": "John Doe",
  "email": "john@example.com",
  "created_at": "2024-01-15T10:30:00Z"
}
```
</ResponseExample>

状态码决定指示器的颜色:

  • 绿色:2xx 成功状态码
  • 蓝色:3xx 重定向状态码
  • 琥珀色:4xx 客户端错误
  • 红色:5xx 服务器错误

多种语言

添加多个代码块即可生成标签页:

curl -X GET https://api.example.com/users/123 \
  -H "Authorization: Bearer $TOKEN"

用法:

<RequestExample>
```bash cURL
curl -X GET https://api.example.com/users/123 \
  -H "Authorization: Bearer $TOKEN"
```

```python Python
import requests

response = requests.get(
    "https://api.example.com/users/123",
    headers={"Authorization": f"Bearer {TOKEN}"}
)
user = response.json()
```

```javascript JavaScript
const response = await fetch("https://api.example.com/users/123", {
  headers: {
    "Authorization": `Bearer ${TOKEN}`
  }
});
const user = await response.json();
```

```go Go
package main

import (
  "fmt"
  "io"
  "net/http"
)

func main() {
  req, _ := http.NewRequest("GET", "https://api.example.com/users/123", nil)
  req.Header.Set("Authorization", "Bearer TOKEN")

  resp, _ := (&http.Client{}).Do(req)
  defer resp.Body.Close()

  body, _ := io.ReadAll(resp.Body)
  fmt.Println(string(body))
}
```

```ruby Ruby
require 'net/http'
require 'uri'
require 'json'

uri = URI("https://api.example.com/users/123")
http = Net::HTTP.new(uri.host, uri.port)
http.use_ssl = true

request = Net::HTTP::Get.new(uri)
request["Authorization"] = "Bearer TOKEN"

response = http.request(request)
puts JSON.parse(response.body)
```
</RequestExample>

多种响应状态码

每个响应状态码显示在各自的标签页中:

{
  "id": "usr_123",
  "name": "John Doe",
  "email": "john@example.com"
}

用法:

<ResponseExample>
```json 200: Success
{
  "id": "usr_123",
  "name": "John Doe",
  "email": "john@example.com"
}
```

```json 400: Bad Request
{
  "error": "validation_error",
  "message": "Email is required"
}
```

```json 404: Not Found
{
  "error": "not_found",
  "message": "User not found"
}
```
</ResponseExample>

组合用法

在 API 页面中同时使用 RequestExample 和 ResponseExample。请求会显示在侧边栏中响应的上方:

curl -X POST https://api.example.com/orders \
  -H "Authorization: Bearer $TOKEN" \
  -H "Content-Type: application/json" \
  -d '{
    "product_id": "prod_456",
    "quantity": 2
  }'
{
  "id": "ord_789",
  "product_id": "prod_456",
  "quantity": 2,
  "status": "pending",
  "created_at": "2024-01-15T10:30:00Z"
}

用法:

<RequestExample>
```bash cURL
curl -X POST https://api.example.com/orders \
  -H "Authorization: Bearer $TOKEN" \
  -H "Content-Type: application/json" \
  -d '{
    "product_id": "prod_456",
    "quantity": 2
  }'
```
</RequestExample>

<ResponseExample>
```json 201: Created
{
  "id": "ord_789",
  "product_id": "prod_456",
  "quantity": 2,
  "status": "pending",
  "created_at": "2024-01-15T10:30:00Z"
}
```
</ResponseExample>

状态码格式

ResponseExample 支持两种状态码格式:

```json 200: Success      // Colon separator

```json 400 - Bad Request // Dash separator

Jamdesk 对两者的解析方式相同。标签页会显示状态码及其描述。

接下来呢?

组件概览

浏览所有可用组件

MDX 基础

了解如何在 MDX 中使用组件

API 示例

查看完整的请求/响应页面示例

OpenAPI 支持

从 OpenAPI 规范自动生成 API 文档