logan
ec9a7b8695
- 删「打印/导出 PDF」按钮与「是否有帮助」反馈组件（静态站无后端，纯摆设）及未使用 SVG 图标 - 文档去 Tauri/Gin 等实现层名词（本地代理/隧道等用户语义保留） - 5 页 markdown 首行 H1 与页面标题去重 - homepage dist 同步重建
238 lines
10 KiB
HTML
238 lines
10 KiB
HTML
<!doctype html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>环境与变量 · OpsxAPI 文档</title>
|
||
<meta name="description" content="OpsxAPI 接口工作台用户文档 — HTTP、GraphQL、WebSocket、SSE、Socket.IO、MQTT 一站式调试，支持 OpenAPI/Postman/cURL 等格式导入导出。">
|
||
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='7' fill='%232563eb'/%3E%3Ctext x='16' y='22' font-size='18' font-weight='bold' fill='%23fff' text-anchor='middle' font-family='sans-serif'%3EO%3C/text%3E%3C/svg%3E">
|
||
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%2264%22%20y2%3D%2264%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%232563EB%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2306B6D4%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D%2264%22%20height%3D%2264%22%20rx%3D%2214%22%20fill%3D%22url%28%23g%29%22%2F%3E%3Cg%20stroke%3D%22%23fff%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M17%2025h26%22%2F%3E%3Cpath%20d%3D%22M37%2019l6%206-6%206%22%2F%3E%3Cpath%20d%3D%22M47%2039H21%22%2F%3E%3Cpath%20d%3D%22M27%2033l-6%206%206%206%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E">
|
||
<link rel="stylesheet" href="/docs/assets/docs.css">
|
||
</head>
|
||
<body>
|
||
<svg xmlns="http://www.w3.org/2000/svg" style="display:none" aria-hidden="true">
|
||
<symbol id="i-menu" viewBox="0 0 24 24"><path d="M4 5h16" /> <path d="M4 12h16" /> <path d="M4 19h16" /></symbol>
|
||
<symbol id="i-search" viewBox="0 0 24 24"><path d="m21 21-4.34-4.34" /> <circle cx="11" cy="11" r="8" /></symbol>
|
||
</svg>
|
||
<header class="topbar">
|
||
<div class="topbar-inner">
|
||
<button class="menu-btn" id="menu-btn" aria-label="打开导航"><svg class="i"><use href="#i-menu"/></svg></button>
|
||
<a class="brand" href="/docs">
|
||
<span class="brand-logo"><svg width="28" height="28" viewBox="0 0 64 64" aria-label="OpsxAPI"><defs><linearGradient id="lg-docs" x1="0" y1="0" x2="64" y2="64" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2563EB"/><stop offset="1" stop-color="#06B6D4"/></linearGradient></defs><rect width="64" height="64" rx="14" fill="url(#lg-docs)"/><g stroke="#fff" stroke-width="5" stroke-linecap="round" stroke-linejoin="round" fill="none"><path d="M17 25h26"/><path d="M37 19l6 6-6 6"/><path d="M47 39H21"/><path d="M27 33l-6 6 6 6"/></g></svg></span>
|
||
<span class="brand-name">OpsxAPI <em>文档</em></span>
|
||
</a>
|
||
<span class="ver-badge">v1.0</span>
|
||
<div class="search">
|
||
<input id="search-input" type="search" placeholder="搜索文档…" autocomplete="off" spellcheck="false">
|
||
<div class="search-panel" id="search-panel" hidden></div>
|
||
</div>
|
||
<nav class="top-links">
|
||
<a href="/home">官网</a>
|
||
<a href="/" target="_blank" rel="noopener">打开工作台 ↗</a>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="layout" id="layout">
|
||
<aside class="sidebar" id="sidebar">
|
||
|
||
<div class="nav-group">
|
||
<div class="nav-group-title">开始使用</div>
|
||
|
||
<a class="nav-link" href="/docs/intro">产品介绍</a>
|
||
|
||
<a class="nav-link" href="/docs/quickstart">快速开始</a>
|
||
|
||
<a class="nav-link" href="/docs/interface">界面导览</a>
|
||
|
||
</div>
|
||
|
||
<div class="nav-group">
|
||
<div class="nav-group-title">请求调试</div>
|
||
|
||
<a class="nav-link" href="/docs/http">发送 HTTP 请求</a>
|
||
|
||
<a class="nav-link" href="/docs/auth">接口鉴权</a>
|
||
|
||
<a class="nav-link active" href="/docs/env">环境与变量</a>
|
||
|
||
<a class="nav-link" href="/docs/graphql">GraphQL</a>
|
||
|
||
<a class="nav-link" href="/docs/websocket">WebSocket</a>
|
||
|
||
<a class="nav-link" href="/docs/sse">SSE 事件流</a>
|
||
|
||
<a class="nav-link" href="/docs/socketio">Socket.IO</a>
|
||
|
||
<a class="nav-link" href="/docs/mqtt">MQTT</a>
|
||
|
||
</div>
|
||
|
||
<div class="nav-group">
|
||
<div class="nav-group-title">数据管理</div>
|
||
|
||
<a class="nav-link" href="/docs/import">数据导入</a>
|
||
|
||
<a class="nav-link" href="/docs/export">导出与代码生成</a>
|
||
|
||
<a class="nav-link" href="/docs/mock">Mock 数据</a>
|
||
|
||
<a class="nav-link" href="/docs/manage">集合与历史</a>
|
||
|
||
</div>
|
||
|
||
<div class="nav-group">
|
||
<div class="nav-group-title">自动化测试与 AI</div>
|
||
|
||
<a class="nav-link" href="/docs/testing">自动化测试</a>
|
||
|
||
<a class="nav-link" href="/docs/ai">AI 助手</a>
|
||
|
||
</div>
|
||
|
||
<div class="nav-group">
|
||
<div class="nav-group-title">账号与团队</div>
|
||
|
||
<a class="nav-link" href="/docs/account">账号与团队</a>
|
||
|
||
</div>
|
||
|
||
<div class="nav-group">
|
||
<div class="nav-group-title">参考</div>
|
||
|
||
<a class="nav-link" href="/docs/license">授权与激活</a>
|
||
|
||
<a class="nav-link" href="/docs/server-api">服务端 API 参考</a>
|
||
|
||
<a class="nav-link" href="/docs/faq">常见问题</a>
|
||
|
||
</div>
|
||
|
||
<div class="sidebar-foot">© 2026 OpsxAPI · 本地优先的接口工作台</div>
|
||
</aside>
|
||
|
||
<main class="content">
|
||
<div class="breadcrumb">文档 <span>/</span> 请求调试 <span>/</span> 环境与变量</div>
|
||
<h1 class="page-title">环境与变量</h1>
|
||
<div class="page-meta">更新于 2026-09-17</div>
|
||
<article class="md">
|
||
<h2 id="sec-1">前置 URL</h2>
|
||
<p>环境可配置<strong>前置 URL</strong>（如 <code>https://api.example.com</code>）。配置后，请求里只需写相对路径：</p>
|
||
<pre><code class="language-text">前置 URL：https://api.example.com
|
||
请求路径：/graphql
|
||
实际请求：https://api.example.com/graphql
|
||
</code></pre>
|
||
<ul>
|
||
<li>URL 输入框会以<strong>前缀块 + 路径</strong>的形式一体展示，前缀部分不可误编辑（点击可跳转环境管理）；</li>
|
||
<li><strong>切换环境即自动换成对应服务地址</strong>，无需改请求；</li>
|
||
<li>路径以 <code>/</code> 开头（或为空）才启用拼接；写完整 <code>https://…</code> 地址的请求不受影响；</li>
|
||
<li>未配置前置 URL 的环境，请求仍可写完整 URL 或用 <code>{{变量名}}</code>。</li>
|
||
</ul>
|
||
<blockquote>
|
||
<p>历史数据自动迁移：旧的 <code>{{baseUrl}}/path</code> 会被自动转为「前置 URL + /path」，<code>baseUrl</code> 变量写入环境的前置 URL 字段。</p>
|
||
</blockquote>
|
||
<h2 id="sec-2">变量语法</h2>
|
||
<p>在 URL、Params、Headers、Cookies、Body、鉴权字段中，使用双花括号引用变量：</p>
|
||
<pre><code class="language-text">{{baseUrl}}/v1/users?page={{page}}
|
||
Authorization: Bearer {{token}}
|
||
</code></pre>
|
||
<p>发送时统一替换为<strong>当前启用环境</strong>中同名变量的值；未定义的变量保留原样，便于发现遗漏。</p>
|
||
<h2 id="sec-3">切换环境</h2>
|
||
<p>顶栏环境切换器显示<strong>彩色单字徽标 + 环境名 + 变量数</strong>，点击弹出环境列表（当前环境带「当前」标记），一眼防误发；底部可进入「管理环境」或「不使用环境」。</p>
|
||
<h2 id="sec-4">管理环境</h2>
|
||
<p>顶栏 <strong>环境</strong> 按钮打开管理弹窗（左侧环境列表 + 右侧编辑区）：</p>
|
||
<ul>
|
||
<li><strong>左栏</strong>：环境列表（徽标 + 名称 + 当前标记），底部虚线按钮新建环境。</li>
|
||
<li><strong>右栏</strong>：提示条（变量引用语法 + 文档直达）、环境重命名、设为当前 / 取消使用、<strong>复制环境</strong>、删除；变量表支持<strong>按名称 / 描述搜索</strong>、逐行启用停用、内联编辑。</li>
|
||
<li>所有修改即时生效并自动保存。</li>
|
||
</ul>
|
||
<h2 id="sec-5">输入 {{ 自动补全</h2>
|
||
<p>在 URL 输入框或任意「值」输入框键入 <code>{{</code>，会弹出当前环境的变量浮层：</p>
|
||
<ul>
|
||
<li>↑↓ 选择、Enter / Tab 插入完整的 <code>{{变量名}}</code>；Esc 关闭。</li>
|
||
<li>浮层同时显示变量值，选之前即可确认。</li>
|
||
</ul>
|
||
<p>内置示例环境：</p>
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>环境</th>
|
||
<th>baseUrl</th>
|
||
<th>token</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>正式</td>
|
||
<td><code>https://httpbin.org</code></td>
|
||
<td>demo-token</td>
|
||
</tr>
|
||
<tr>
|
||
<td>本地</td>
|
||
<td><code>http://127.0.0.1:8787</code></td>
|
||
<td>dev-token</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h2 id="sec-6">变量从哪来自动生成</h2>
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>来源</th>
|
||
<th>行为</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>导入 OpenAPI / Swagger</td>
|
||
<td><code>servers</code> 地址写入 <code>baseUrl</code>；路径参数 <code>{id}</code> 转为 <code>{{id}}</code> 并写入示例值</td>
|
||
</tr>
|
||
<tr>
|
||
<td>导入 Postman</td>
|
||
<td><code>collection.variable</code> 写入当前环境</td>
|
||
</tr>
|
||
<tr>
|
||
<td>手动输入</td>
|
||
<td>在环境面板随时增改</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h2 id="sec-7">实际地址预览</h2>
|
||
<p>URL 含 <code>{{ }}</code> 时，编辑器会在 URL 栏下方实时显示替换后的实际地址，切换环境立即更新。</p>
|
||
<blockquote>
|
||
<p><strong>提示</strong>：路径参数用变量而不是写死，是接口可复用的关键 —— 复制接口后只改变量值即可调试另一个资源。</p>
|
||
</blockquote>
|
||
|
||
</article>
|
||
|
||
<div class="pn-nav">
|
||
|
||
<a class="pn prev" href="/docs/auth"><span class="pn-label">← 上一页</span><span class="pn-title">接口鉴权</span></a>
|
||
|
||
|
||
<a class="pn next" href="/docs/graphql"><span class="pn-label">下一页 →</span><span class="pn-title">GraphQL</span></a>
|
||
|
||
</div>
|
||
|
||
|
||
</main>
|
||
|
||
<aside class="toc">
|
||
<div class="toc-title">本页目录</div>
|
||
<nav class="toc-nav">
|
||
<a class="toc-l2" href="#sec-1">前置 URL</a>
|
||
<a class="toc-l2" href="#sec-2">变量语法</a>
|
||
<a class="toc-l2" href="#sec-3">切换环境</a>
|
||
<a class="toc-l2" href="#sec-4">管理环境</a>
|
||
<a class="toc-l2" href="#sec-5">输入 {{ 自动补全</a>
|
||
<a class="toc-l2" href="#sec-6">变量从哪来自动生成</a>
|
||
<a class="toc-l2" href="#sec-7">实际地址预览</a>
|
||
|
||
</nav>
|
||
</aside>
|
||
</div>
|
||
|
||
<script src="/docs/assets/docs.js" defer></script>
|
||
</body>
|
||
</html>
|