blackteay/fes.js
1
0
Fork 0
mirror of https://github.com/WeBankFinTech/fes.js.git synced 2025-04-06 03:59:53 +08:00
Code Issues Projects Releases Wiki Activity
fes.js/reference/plugin/plugins/request.html

168 lines
56 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="generator" content="VuePress 2.0.0-beta.28">
<link rel="manifest" href="/manifest.webmanifest"><link rel="icon" href="/logo.png"><title>@fesjs/plugin-request | Fes.js</title><meta name="description" content="一个好用的前端应用解决方案">
<link rel="preload" href="/fes.js/assets/js/runtime~app.66f16f0f.js" as="script"><link rel="preload" href="/fes.js/assets/css/styles.b00c68fc.css" as="style"><link rel="preload" href="/fes.js/assets/js/399.ea3dd8a2.js" as="script"><link rel="preload" href="/fes.js/assets/js/app.3337659a.js" as="script">
<link rel="stylesheet" href="/fes.js/assets/css/styles.b00c68fc.css">
</head>
<body>
<div id="app"><!--[--><div class="theme-container"><!--[--><header class="navbar"><div class="toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a href="/fes.js/" class=""><!----><span class="site-name can-hide">Fes.js</span></a></span><div class="navbar-links-wrapper" style=""><!--[--><!--]--><nav class="navbar-links can-hide"><!--[--><div class="navbar-links-item"><a href="/fes.js/guide/" class="nav-link" aria-label="指南"><!--[--><!--]--> 指南 <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/config/" class="nav-link" aria-label="配置"><!--[--><!--]--> 配置 <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/api/" class="nav-link" aria-label="API"><!--[--><!--]--> API <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/plugin/" class="nav-link router-link-active" aria-label="插件"><!--[--><!--]--> 插件 <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/cli/" class="nav-link" aria-label="CLI"><!--[--><!--]--> CLI <!--[--><!--]--></a></div><div class="navbar-links-item"><div class="dropdown-wrapper"><button class="dropdown-title" type="button" aria-label="v2.0"><span class="title">v2.0</span><span class="arrow down"></span></button><button class="mobile-dropdown-title" type="button" aria-label="v2.0"><span class="title">v2.0</span><span class="right arrow"></span></button><ul style="display:none;" class="nav-dropdown"><!--[--><li class="dropdown-item"><a class="nav-link external" href="https://fesjs.mumblefe.cn/next" rel="noopener noreferrer" target="_blank" aria-label="v3.0.0-rc.1"><!--[--><!--]--> v3.0.0-rc.1 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><li class="dropdown-item"><a class="nav-link external" href="https://fesjs.mumblefe.cn/1.0" rel="noopener noreferrer" target="_blank" aria-label="v1.0"><!--[--><!--]--> v1.0 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><!--]--></ul></div></div><div class="navbar-links-item"><div class="dropdown-wrapper"><button class="dropdown-title" type="button" aria-label="了解更多"><span class="title">了解更多</span><span class="arrow down"></span></button><button class="mobile-dropdown-title" type="button" aria-label="了解更多"><span class="title">了解更多</span><span class="right arrow"></span></button><ul style="display:none;" class="nav-dropdown"><!--[--><li class="dropdown-item"><a class="nav-link external" href="https://github.com/WeBankFinTech/fes.js/blob/master/CHANGELOG.md" rel="noopener noreferrer" target="_blank" aria-label="更新日志"><!--[--><!--]--> 更新日志 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><li class="dropdown-item"><a class="nav-link external" href="http://fes-design.mumblefe.cn/" rel="noopener noreferrer" target="_blank" aria-label="fes-design"><!--[--><!--]--> fes-design <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><!--]--></ul></div></div><div class="navbar-links-item"><a class="nav-link external" href="https://github.com/WeBankFinTech/fes.js" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><button class="toggle-dark-button" title="toggle dark mode"><svg style="" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg style="display:none;" class="icon" focusable="false" viewBox="0 0 32 32"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><div id="docsearch-container"></div></div></header><!--]--><div class="sidebar-mask"></div><!--[--><aside class="sidebar"><nav class="navbar-links"><!--[--><div class="navbar-links-item"><a href="/fes.js/guide/" class="nav-link" aria-label="指南"><!--[--><!--]--> 指南 <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/config/" class="nav-link" aria-label="配置"><!--[--><!--]--> 配置 <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/api/" class="nav-link" aria-label="API"><!--[--><!--]--> API <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/plugin/" class="nav-link router-link-active" aria-label="插件"><!--[--><!--]--> 插件 <!--[--><!--]--></a></div><div class="navbar-links-item"><a href="/fes.js/reference/cli/" class="nav-link" aria-label="CLI"><!--[--><!--]--> CLI <!--[--><!--]--></a></div><div class="navbar-links-item"><div class="dropdown-wrapper"><button class="dropdown-title" type="button" aria-label="v2.0"><span class="title">v2.0</span><span class="arrow down"></span></button><button class="mobile-dropdown-title" type="button" aria-label="v2.0"><span class="title">v2.0</span><span class="right arrow"></span></button><ul style="display:none;" class="nav-dropdown"><!--[--><li class="dropdown-item"><a class="nav-link external" href="https://fesjs.mumblefe.cn/next" rel="noopener noreferrer" target="_blank" aria-label="v3.0.0-rc.1"><!--[--><!--]--> v3.0.0-rc.1 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><li class="dropdown-item"><a class="nav-link external" href="https://fesjs.mumblefe.cn/1.0" rel="noopener noreferrer" target="_blank" aria-label="v1.0"><!--[--><!--]--> v1.0 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><!--]--></ul></div></div><div class="navbar-links-item"><div class="dropdown-wrapper"><button class="dropdown-title" type="button" aria-label="了解更多"><span class="title">了解更多</span><span class="arrow down"></span></button><button class="mobile-dropdown-title" type="button" aria-label="了解更多"><span class="title">了解更多</span><span class="right arrow"></span></button><ul style="display:none;" class="nav-dropdown"><!--[--><li class="dropdown-item"><a class="nav-link external" href="https://github.com/WeBankFinTech/fes.js/blob/master/CHANGELOG.md" rel="noopener noreferrer" target="_blank" aria-label="更新日志"><!--[--><!--]--> 更新日志 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><li class="dropdown-item"><a class="nav-link external" href="http://fes-design.mumblefe.cn/" rel="noopener noreferrer" target="_blank" aria-label="fes-design"><!--[--><!--]--> fes-design <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></li><!--]--></ul></div></div><div class="navbar-links-item"><a class="nav-link external" href="https://github.com/WeBankFinTech/fes.js" rel="noopener noreferrer" target="_blank" aria-label="GitHub"><!--[--><!--]--> GitHub <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></div><!--]--></nav><!--[--><!--]--><ul class="sidebar-links"><!--[--><!--[--><a href="/fes.js/reference/plugin/" class="nav-link router-link-active sidebar-heading sidebar-item" aria-label="介绍"><!--[--><!--]--> 介绍 <!--[--><!--]--></a><!----><!--]--><!--[--><p class="sidebar-heading sidebar-item active">Plugins</p><ul class=""><li><!--[--><a href="/fes.js/reference/plugin/plugins/access.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-access"><!--[--><!--]--> @fesjs/plugin-access <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/enums.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-enums"><!--[--><!--]--> @fesjs/plugin-enums <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/icon.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-icon"><!--[--><!--]--> @fesjs/plugin-icon <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/jest.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-jest"><!--[--><!--]--> @fesjs/plugin-jest <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/layout.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-layout"><!--[--><!--]--> @fesjs/plugin-layout <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/locale.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-locale"><!--[--><!--]--> @fesjs/plugin-locale <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/model.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-model"><!--[--><!--]--> @fesjs/plugin-model <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html" class="router-link-active router-link-exact-active nav-link router-link-active sidebar-item active" aria-label="@fesjs/plugin-request"><!--[--><!--]--> @fesjs/plugin-request <!--[--><!--]--></a><ul class="sidebar-sub-items"><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#启用方式" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="启用方式"><!--[--><!--]--> 启用方式 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#配置" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="配置"><!--[--><!--]--> 配置 <!--[--><!--]--></a><ul class="sidebar-sub-items"><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#构建时配置" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="构建时配置"><!--[--><!--]--> 构建时配置 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#运行时配置" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="运行时配置"><!--[--><!--]--> 运行时配置 <!--[--><!--]--></a><!----><!--]--></li></ul><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#使用" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="使用"><!--[--><!--]--> 使用 <!--[--><!--]--></a><ul class="sidebar-sub-items"><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#发起一个普通-post-请求" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="发起一个普通 post 请求"><!--[--><!--]--> 发起一个普通 post 请求 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#merge-重复请求" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="merge 重复请求"><!--[--><!--]--> merge 重复请求 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#请求节流-即将废弃" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="请求节流(即将废弃)"><!--[--><!--]--> 请求节流(即将废弃) <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#请求缓存" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="请求缓存"><!--[--><!--]--> 请求缓存 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#结合-use-使用" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="结合 use 使用"><!--[--><!--]--> 结合 use 使用 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#配置拦截器" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="配置拦截器"><!--[--><!--]--> 配置拦截器 <!--[--><!--]--></a><!----><!--]--></li></ul><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#api" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="API"><!--[--><!--]--> API <!--[--><!--]--></a><ul class="sidebar-sub-items"><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#request" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="request"><!--[--><!--]--> request <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a aria-current="page" href="/fes.js/reference/plugin/plugins/request.html#userequest" class="router-link-active router-link-exact-active nav-link sidebar-item" aria-label="useRequest"><!--[--><!--]--> useRequest <!--[--><!--]--></a><!----><!--]--></li></ul><!--]--></li></ul><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/vuex.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-vuex"><!--[--><!--]--> @fesjs/plugin-vuex <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/qiankun.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-qiankun"><!--[--><!--]--> @fesjs/plugin-qiankun <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/windicss.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-windicss"><!--[--><!--]--> @fesjs/plugin-windicss <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/sass.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-sass"><!--[--><!--]--> @fesjs/plugin-sass <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/editor.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-monaco-editor"><!--[--><!--]--> @fesjs/plugin-monaco-editor <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/pinia.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-pinia"><!--[--><!--]--> @fesjs/plugin-pinia <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/plugins/watermark.html" class="nav-link sidebar-item" aria-label="@fesjs/plugin-watermark"><!--[--><!--]--> @fesjs/plugin-watermark <!--[--><!--]--></a><!----><!--]--></li></ul><!--]--><!--[--><p class="sidebar-heading sidebar-item">插件开发</p><ul class=""><li><!--[--><a href="/fes.js/reference/plugin/dev/" class="nav-link sidebar-item" aria-label="插件介绍"><!--[--><!--]--> 插件介绍 <!--[--><!--]--></a><!----><!--]--></li><li><!--[--><a href="/fes.js/reference/plugin/dev/api.html" class="nav-link sidebar-item" aria-label="插件 API"><!--[--><!--]--> 插件 API <!--[--><!--]--></a><!----><!--]--></li></ul><!--]--><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="page"><!--[--><!--]--><div class="theme-default-content"><!--[--><h1 id="fesjs-plugin-request" tabindex="-1"><a class="header-anchor" href="#fesjs-plugin-request" aria-hidden="true">#</a> @fesjs/plugin-request</h1><p>基于 axios 封装的 request，内置防止重复请求、请求节流、错误处理等功能。</p><h2 id="启用方式" tabindex="-1"><a class="header-anchor" href="#启用方式" aria-hidden="true">#</a> 启用方式</h2><p>在 <code>package.json</code> 中引入依赖：</p><div class="language-json ext-json line-numbers-mode"><pre class="language-json"><code><span class="token punctuation">{</span>
<span class="token property">&quot;dependencies&quot;</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token property">&quot;@fesjs/fes&quot;</span><span class="token operator">:</span> <span class="token string">&quot;^2.0.0&quot;</span><span class="token punctuation">,</span>
<span class="token property">&quot;@fesjs/plugin-request&quot;</span><span class="token operator">:</span> <span class="token string">&quot;^2.0.0&quot;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><h2 id="配置" tabindex="-1"><a class="header-anchor" href="#配置" aria-hidden="true">#</a> 配置</h2><h3 id="构建时配置" tabindex="-1"><a class="header-anchor" href="#构建时配置" aria-hidden="true">#</a> 构建时配置</h3><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
<span class="token literal-property property">request</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token literal-property property">dataField</span><span class="token operator">:</span> <span class="token string">&#39;result&#39;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br></div></div><h4 id="datafield" tabindex="-1"><a class="header-anchor" href="#datafield" aria-hidden="true">#</a> dataField</h4><ul><li><p>类型： <code>string</code></p></li><li><p>默认值： <code>&#39;&#39;</code></p></li><li><p>详情：</p><p><code>dataField</code> 对应接口统一格式中的数据字段，比如接口如果统一的规范是 <code>{ success: boolean, result: any}</code> ，那么就不需要配置，这样你通过 <code>useRequest</code> 消费的时候会生成一个默认的 <code>formatResult</code>，直接返回 <code>result</code> 中的数据，方便使用。如果你的后端接口不符合这个规范，可以自行配置 <code>dataField</code>。配置为 <code>&#39;&#39;</code>（空字符串）的时候不做处理。</p></li></ul><h4 id="base-即将废弃" tabindex="-1"><a class="header-anchor" href="#base-即将废弃" aria-hidden="true">#</a> base(即将废弃)</h4><ul><li><p>类型： <code>string</code></p></li><li><p>默认值： <code>&#39;&#39;</code></p></li><li><p>详情：</p><p><code>base</code> 接口前缀。</p></li></ul><div class="custom-container warning"><p class="custom-container-title">即将废弃</p><p>这个字段将在下个版本废弃，推荐使用 <a href="https://github.com/axios/axios" target="_blank" rel="noopener noreferrer">axios baseURL<span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span></a>。</p></div><h3 id="运行时配置" tabindex="-1"><a class="header-anchor" href="#运行时配置" aria-hidden="true">#</a> 运行时配置</h3><p>在 <code>app.js</code> 中进行运行时配置。</p><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">export</span> <span class="token keyword">const</span> request <span class="token operator">=</span> <span class="token punctuation">{</span>
<span class="token comment">// 格式化 response.data (只有 response.data 类型为 object 才会调用)</span>
<span class="token function-variable function">responseDataAdaptor</span><span class="token operator">:</span> <span class="token punctuation">(</span><span class="token parameter">data</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
data<span class="token punctuation">.</span>code <span class="token operator">=</span> data<span class="token punctuation">.</span>code <span class="token operator">===</span> <span class="token string">&#39;200&#39;</span> <span class="token operator">?</span> <span class="token string">&#39;0&#39;</span> <span class="token operator">:</span> data<span class="token punctuation">.</span>code<span class="token punctuation">;</span>
<span class="token keyword">return</span> data<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token comment">// 关闭 response data 校验（只判断 xhr status）</span>
<span class="token literal-property property">closeResDataCheck</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
<span class="token comment">// 请求拦截器 http://axios-js.com/zh-cn/docs/#%E6%8B%A6%E6%88%AA%E5%99%A8</span>
<span class="token literal-property property">requestInterceptors</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
<span class="token comment">// 响应拦截器</span>
<span class="token literal-property property">responseInterceptors</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">,</span>
<span class="token comment">// 错误处理</span>
<span class="token comment">// 内部以 reponse.data.code === &#39;0&#39; 判断请求是否成功</span>
<span class="token comment">// 若使用其他字段判断，可以使用 responseDataAdaptor 对响应数据进行格式</span>
<span class="token literal-property property">errorHandler</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token number">11199</span><span class="token punctuation">(</span>response<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 特殊 code 处理逻辑</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token number">404</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span> <span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token keyword">default</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 异常统一处理</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token comment">// 其他 axios 配置</span>
<span class="token operator">...</span>otherConfigs
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br></div></div><h4 id="skiperrorhandler" tabindex="-1"><a class="header-anchor" href="#skiperrorhandler" aria-hidden="true">#</a> skipErrorHandler</h4><ul><li><p>类型： <code>boolean | string | number | array&lt;string | number&gt;</code></p></li><li><p>默认值： ``</p></li><li><p>详情：</p><p>指定当前请求的某些错误状态不走 <code>errorHandler</code>，单独进行处理。如果设置为 <code>true</code>，当前请求的错误处理都不走 <code>errorHandler</code>。</p></li><li><p>示列：</p></li></ul><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> request <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@fesjs/fes&#39;</span><span class="token punctuation">;</span>
<span class="token function">request</span><span class="token punctuation">(</span><span class="token string">&#39;/api/login&#39;</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
<span class="token literal-property property">skipErrorHandler</span><span class="token operator">:</span> <span class="token string">&#39;110&#39;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">catch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">err</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// 这里处理 code 为 110 的异常</span>
<span class="token comment">// 此时 errorHandler[110] 函数不会生效，也不会执行 errorHandler.default</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h2 id="使用" tabindex="-1"><a class="header-anchor" href="#使用" aria-hidden="true">#</a> 使用</h2><h3 id="发起一个普通-post-请求" tabindex="-1"><a class="header-anchor" href="#发起一个普通-post-请求" aria-hidden="true">#</a> 发起一个普通 post 请求</h3><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> request <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@fesjs/fes&#39;</span><span class="token punctuation">;</span>
<span class="token function">request</span><span class="token punctuation">(</span><span class="token string">&#39;/api/login&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
<span class="token literal-property property">username</span><span class="token operator">:</span> <span class="token string">&#39;robby&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">password</span><span class="token operator">:</span> <span class="token string">&#39;123456&#39;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">catch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">err</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// 处理异常</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br></div></div><h3 id="merge-重复请求" tabindex="-1"><a class="header-anchor" href="#merge-重复请求" aria-hidden="true">#</a> merge 重复请求</h3><p>连续发送多个请求，会被合并成一个请求，不会报 <code>REPEAT</code> 接口错误。</p><p>当发生 <code>REPEAT</code> 请求异常，并且确保自身代码合理的情况下，可以使用该配置。</p><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> request <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@fesjs/fes&#39;</span><span class="token punctuation">;</span>
<span class="token function">request</span><span class="token punctuation">(</span>
<span class="token string">&#39;/api/login&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">{</span>
<span class="token literal-property property">username</span><span class="token operator">:</span> <span class="token string">&#39;robby&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">password</span><span class="token operator">:</span> <span class="token string">&#39;123456&#39;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">{</span>
<span class="token literal-property property">mergeRequest</span><span class="token operator">:</span> <span class="token boolean">true</span> <span class="token comment">// 在一个请求没有回来前，重复发送的请求会合并成一个请求</span>
<span class="token punctuation">}</span>
<span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">catch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">err</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// 处理异常</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div><h3 id="请求节流-即将废弃" tabindex="-1"><a class="header-anchor" href="#请求节流-即将废弃" aria-hidden="true">#</a> 请求节流(即将废弃)</h3><div class="custom-container warning"><p class="custom-container-title">即将废弃</p><p>因为 request 的请求总会有一个 promise 结果，要么成功，要么失败，和防抖、节流的语义不一致，防抖、节流只是函数的不执行</p></div><h3 id="请求缓存" tabindex="-1"><a class="header-anchor" href="#请求缓存" aria-hidden="true">#</a> 请求缓存</h3><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> request <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@fesjs/fes&#39;</span><span class="token punctuation">;</span>
<span class="token function">request</span><span class="token punctuation">(</span>
<span class="token string">&#39;/api/login&#39;</span><span class="token punctuation">,</span>
<span class="token punctuation">{</span>
<span class="token literal-property property">username</span><span class="token operator">:</span> <span class="token string">&#39;robby&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">password</span><span class="token operator">:</span> <span class="token string">&#39;123456&#39;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">{</span>
<span class="token literal-property property">cache</span><span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token literal-property property">cacheType</span><span class="token operator">:</span> <span class="token string">&#39;ram&#39;</span><span class="token punctuation">,</span> <span class="token comment">// ram: 内存，session: sessionStorage，local：localStorage</span>
<span class="token literal-property property">cacheTime</span><span class="token operator">:</span> <span class="token number">1000</span> <span class="token operator">*</span> <span class="token number">60</span> <span class="token operator">*</span> <span class="token number">3</span> <span class="token comment">// 缓存时间：默认3min</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
<span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// do something</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">catch</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">err</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
<span class="token comment">// 处理异常</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br></div></div><p>若 <code>cache</code> 传 <code>true</code>，则默认使用 <code>ram</code> 缓存类型，缓存时间 3min。</p><h3 id="结合-use-使用" tabindex="-1"><a class="header-anchor" href="#结合-use-使用" aria-hidden="true">#</a> 结合 use 使用</h3><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> useRequest <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@fesjs/fes&#39;</span><span class="token punctuation">;</span>
<span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
<span class="token function">setup</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">const</span> <span class="token punctuation">{</span> loading<span class="token punctuation">,</span> data<span class="token punctuation">,</span> error <span class="token punctuation">}</span> <span class="token operator">=</span> <span class="token function">useRequest</span><span class="token punctuation">(</span><span class="token string">&#39;/api/login&#39;</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
<span class="token literal-property property">username</span><span class="token operator">:</span> <span class="token string">&#39;robby&#39;</span><span class="token punctuation">,</span>
<span class="token literal-property property">password</span><span class="token operator">:</span> <span class="token string">&#39;123456&#39;</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">return</span> <span class="token punctuation">{</span>
loading<span class="token punctuation">,</span>
data<span class="token punctuation">,</span>
error
<span class="token punctuation">}</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br></div></div><h3 id="配置拦截器" tabindex="-1"><a class="header-anchor" href="#配置拦截器" aria-hidden="true">#</a> 配置拦截器</h3><p>函数的参数格式：<a href="http://axios-js.com/zh-cn/docs/#%E6%8B%A6%E6%88%AA%E5%99%A8" target="_blank" rel="noopener noreferrer">传送门<span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span></a>;</p><div class="language-javascript ext-js line-numbers-mode"><pre class="language-javascript"><code><span class="token keyword">export</span> <span class="token keyword">const</span> request <span class="token operator">=</span> <span class="token punctuation">{</span>
<span class="token literal-property property">requestInterceptors</span><span class="token operator">:</span> <span class="token punctuation">[</span>
<span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">config</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 在发送请求之前做些什么</span>
<span class="token keyword">return</span> config<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">[</span>
<span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">config</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 在发送请求之前做些什么</span>
<span class="token keyword">return</span> config<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">error</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 对请求错误做些什么</span>
<span class="token keyword">return</span> Promise<span class="token punctuation">.</span><span class="token function">reject</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">]</span>
<span class="token punctuation">]</span><span class="token punctuation">,</span>
<span class="token comment">// 响应拦截器</span>
<span class="token literal-property property">responseInterceptors</span><span class="token operator">:</span> <span class="token punctuation">[</span>
<span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">response</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 对响应数据做点什么</span>
<span class="token keyword">return</span> response<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">[</span>
<span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">response</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 对响应数据做点什么</span>
<span class="token keyword">return</span> response<span class="token punctuation">;</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">error</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token comment">// 对响应错误做点什么</span>
<span class="token keyword">return</span> Promise<span class="token punctuation">.</span><span class="token function">reject</span><span class="token punctuation">(</span>error<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">]</span>
<span class="token punctuation">]</span>
<span class="token punctuation">}</span><span class="token punctuation">;</span>
</code></pre><div class="line-numbers"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div><h2 id="api" tabindex="-1"><a class="header-anchor" href="#api" aria-hidden="true">#</a> API</h2><h3 id="request" tabindex="-1"><a class="header-anchor" href="#request" aria-hidden="true">#</a> request</h3><ul><li><p><strong>类型</strong>：函数</p></li><li><p><strong>详情</strong>：请求后端接口</p></li><li><p><strong>参数</strong>：</p><ul><li>url: 后端接口 url</li><li>data: 参数</li><li>options:  配置（ 支持 axios 所有配置）</li></ul></li><li><p><strong>返回值</strong>: Promise</p></li></ul><h3 id="userequest" tabindex="-1"><a class="header-anchor" href="#userequest" aria-hidden="true">#</a> useRequest</h3><p>request 的封装，返回响应式 <code>loading</code>、<code>error</code>、 <code>data</code></p><!--]--></div><footer class="page-meta"><div class="meta-item edit-link"><a class="nav-link external meta-item-label" href="https://github.com/WeBankFinTech/fes.js/edit/master/docs/reference/plugin/plugins/request.md" rel="noopener noreferrer" target="_blank" aria-label="在 GitHub 上编辑此页"><!--[--><!--]--> 在 GitHub 上编辑此页 <span><svg class="icon outbound" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewbox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><!--[--><span class="sr-only">在新窗口打开</span><!--]--></span><!--[--><!--]--></a></div><div class="meta-item last-updated"><span class="meta-item-label">上次更新: </span><!----></div><div class="meta-item contributors"><span class="meta-item-label">贡献者: </span><span class="meta-item-info"><!--[--><!--[--><span class="contributor" title="email: 445436867@qq.com">wanchun</span><!----><!--]--><!--]--></span></div></footer><nav class="page-nav"><p class="inner"><span class="prev"><a href="/fes.js/reference/plugin/plugins/model.html" class="nav-link" aria-label="@fesjs/plugin-model"><!--[--><!--]--> @fesjs/plugin-model <!--[--><!--]--></a></span><span class="next"><a href="/fes.js/reference/plugin/plugins/vuex.html" class="nav-link" aria-label="@fesjs/plugin-vuex"><!--[--><!--]--> @fesjs/plugin-vuex <!--[--><!--]--></a></span></p></nav><!--[--><!--]--></main><!--]--></div><!----><!----><!--]--></div>
<script src="/fes.js/assets/js/runtime~app.66f16f0f.js" defer></script><script src="/fes.js/assets/js/399.ea3dd8a2.js" defer></script><script src="/fes.js/assets/js/app.3337659a.js" defer></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink