axios全攻略

<div id="article_details" class="details">
    <div class="article_title">   
         <span class="ico ico_type_Repost"></span>

    <h1>
        <span class="link_title"><a href="/hsany330/article/details/71079745">
        axios全攻略        
           
        </a>
        </span>

         
    </h1>
</div>

   

        <div class="article_manage clearfix">
        <div class="article_r">
            <span class="link_postdate">2017-05-02 12:03</span>
            <span class="link_view" title="閱讀次數">1192人閱讀</span>
            <span class="link_comments" title="評論次數"> <a href="#comments" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_pinglun'])">評論</a>(0)</span>
            <span class="link_collect tracking-ad" data-mod="popu_171"> <a href="javascript:void(0);" onclick="javascript:collectArticle('axios%e5%85%a8%e6%94%bb%e7%95%a5','71079745');return false;" title="收藏" target="_blank">收藏</a></span>
             <span class="link_report"> <a href="#report" onclick="javascript:report(71079745,2);return false;" title="舉報">舉報</a></span>

        </div>
    </div>    <style type="text/css">        
            .embody{
                padding:10px 10px 10px;
                margin:0 -20px;
                border-bottom:solid 1px #ededed;                
            }
            .embody_b{
                margin:0 ;
                padding:10px 0;
            }
            .embody .embody_t,.embody .embody_c{
                display: inline-block;
                margin-right:10px;
            }
            .embody_t{
                font-size: 12px;
                color:#999;
            }
            .embody_c{
                font-size: 12px;
            }
            .embody_c img,.embody_c em{
                display: inline-block;
                vertical-align: middle;               
            }
             .embody_c img{               
                width:30px;
                height:30px;
            }
            .embody_c em{
                margin: 0 20px 0 10px;
                color:#333;
                font-style: normal;
            }
    </style>
    <script type="text/javascript">
        $(function () {
            try
            {
                var lib = eval("("+$("#lib").attr("value")+")");
                var html = "";
                if (lib.err == 0) {
                    $.each(lib.data, function (i) {
                        var obj = lib.data[i];
                        //html += '<img src="' + obj.logo + '"/>' + obj.name + "  ";
                        html += ' <a href="' + obj.url + '" target="_blank">';
                        html += ' <img src="' + obj.logo + '">';
                        html += ' <em><b>' + obj.name + '</b></em>';
                        html += ' </a>';
                    });
                    if (html != "") {
                        setTimeout(function () {
                            $("#lib").html(html);                      
                            $("#embody").show();
                        }, 100);
                    }
                }      
            } catch (err)
            { }
            
        });
    </script>

  

  
  
     


<div style="clear:both"></div><div style="border:solid 1px #ccc; background:#eee; float:left; min-width:200px;padding:4px 10px;"><p style="text-align:right;margin:0;"><span style="float:left;">目錄<a href="#" title="系統根據文章中H1到H6標籤自動生成文章目錄">(?)</a></span><a href="#" onclick="javascript:return openct(this);" title="展開">[+]</a></p><ol style="display:none;margin-left:14px;padding-left:14px;line-height:160%;"><li><a href="#t0">
axios 簡介</a></li><li><a href="#t1">
瀏覽器兼容性</a></li><li><a href="#t2">
引入方式</a></li><li><a href="#t3">
舉個栗子</a></li><ol><li><a href="#t4">
執行 GET 請求</a></li><li><a href="#t5">
執行 POST 請求</a></li><li><a href="#t6">
執行多個併發請求</a></li></ol><li><a href="#t7">
axios API</a></li><ol><li><a href="#t8">
axiosconfig</a></li><li><a href="#t9">
axiosurl config</a></li><li><a href="#t10">
請求方法別名</a></li><li><a href="#t11">
併發</a></li><li><a href="#t12">
創建實例</a></li><li><a href="#t13">
實例方法</a></li></ol><li><a href="#t14">
請求配置</a></li><li><a href="#t15">
配置默認值</a></li><ol><li><a href="#t16">
全局axios默認值</a></li><li><a href="#t17">
自定義實例默認值</a></li><li><a href="#t18">
配置優先級順序</a></li></ol><li><a href="#t19">
攔截器</a></li><li><a href="#t20">
處理錯誤</a></li><li><a href="#t21">
消除</a></li><li><a href="#t22">
使用application  x-www-form-urlencoded格式</a></li><ol><li><a href="#t23">
瀏覽器</a></li><li><a href="#t24">
Nodejs</a></li></ol><li><a href="#t25">
Promise</a></li><li><a href="#t26">
TypeScript</a></li></ol></div><div style="clear:both"></div><div id="article_content" class="article_content tracking-ad" data-mod="popu_307" data-dsm="post">

<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
隨着 vuejs 作者尤雨溪發佈消息，不再繼續維護vue-resource，並推薦大家使用 axios 開始，axios 被越來越多的人所瞭解。本來想在網上找找詳細攻略，突然發現，axios 的官方文檔本身就非常詳細！！有這個還要什麼自行車！！所以推薦大家學習這種庫，最好詳細閱讀其官方文檔。大概翻譯了一下 axios 的官方文檔，相信大家只要吃透本文再加以實踐，axios 就是小意思啦！！</p>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
如果您覺得本文對您有幫助，不妨點個贊或關注收藏一下，您的鼓勵對我非常重要。</p>
<h2 id="axios-簡介" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t0" target="_blank"></a>
axios 簡介</h2>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
axios 是一個基於Promise 用於瀏覽器和 nodejs 的 HTTP 客戶端，它本身具有以下特徵：</p>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<ul style="margin:0px 0px 1em 40px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<li style="margin:0px; padding:0px; list-style-type:disc">從瀏覽器中創建 XMLHttpRequest</li><li style="margin:0px; padding:0px; list-style-type:disc">從 node.js 發出 http 請求</li><li style="margin:0px; padding:0px; list-style-type:disc">支持 Promise API</li><li style="margin:0px; padding:0px; list-style-type:disc">攔截請求和響應</li><li style="margin:0px; padding:0px; list-style-type:disc">轉換請求和響應數據</li><li style="margin:0px; padding:0px; list-style-type:disc">取消請求</li><li style="margin:0px; padding:0px; list-style-type:disc">自動轉換JSON數據</li><li style="margin:0px; padding:0px; list-style-type:disc">客戶端支持防止 <a target="_blank" href="http://baike.baidu.com/link?url=iUceAfgyfJOacUtjPgT4ifaSOxDULAc_MzcLEOTySflAn5iLlHfMGsZMtthBm5sK4y6skrSvJ1HOO2qKtV1ej_" rel="external" style="margin:0px; padding:0px; color:rgb(0,0,0)">CSRF/XSRF</a></li></ul>
<h2 id="瀏覽器兼容性" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t1" target="_blank"></a>
瀏覽器兼容性</h2>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<a target="_blank" class="fancybox" href="http://p1.bpimg.com/567571/991b798df8c9a528.png" rel="group" style="margin:0px; padding:0px; color:rgb(0,0,0)"></a></p>
<h2 id="引入方式：" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t2" target="_blank"></a>
引入方式：</h2>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">$ npm install axios</div>
<div class="line" style="margin:0px; padding:0px">$ cnpm install axios <span class="comment" style="margin:0px; padding:0px">//taobao源</span></div>
<div class="line" style="margin:0px; padding:0px">$ bower install axios</div>
<div class="line" style="margin:0px; padding:0px">或者使用cdn：</div>
<div class="line" style="margin:0px; padding:0px"><script src=<span class="string" style="margin:0px; padding:0px">"https://unpkg.com/axios/dist/axios.min.js"></script></span></div>
</td>
</tr>
</tbody>
</table>
<h2 id="舉個栗子：" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t3" target="_blank"></a>
舉個栗子：</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<h3 id="執行-GET-請求" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t4" target="_blank"></a>
執行 GET 請求</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
<div class="line" style="margin:0px; padding:0px">13</div>
<div class="line" style="margin:0px; padding:0px">14</div>
<div class="line" style="margin:0px; padding:0px">15</div>
<div class="line" style="margin:0px; padding:0px">16</div>
<div class="line" style="margin:0px; padding:0px">17</div>
<div class="line" style="margin:0px; padding:0px">18</div>
<div class="line" style="margin:0px; padding:0px">19</div>
<div class="line" style="margin:0px; padding:0px">20</div>
<div class="line" style="margin:0px; padding:0px">21</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 向具有指定ID的用戶發出請求</span></div>
<div class="line" style="margin:0px; padding:0px">axios.get(<span class="string" style="margin:0px; padding:0px">'/user?ID=12345')</span></div>
<div class="line" style="margin:0px; padding:0px">.then(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">response) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response);</span></div>
<div class="line" style="margin:0px; padding:0px">})</div>
<div class="line" style="margin:0px; padding:0px">.catch(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">error) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(error);</span></div>
<div class="line" style="margin:0px; padding:0px">});</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 也可以通過 params 對象傳遞參數</span></div>
<div class="line" style="margin:0px; padding:0px">axios.get(<span class="string" style="margin:0px; padding:0px">'/user', {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">params: {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">ID: <span class="number" style="margin:0px; padding:0px">12345</span></span></div>
<div class="line" style="margin:0px; padding:0px">}</div>
<div class="line" style="margin:0px; padding:0px">})</div>
<div class="line" style="margin:0px; padding:0px">.then(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">response) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response);</span></div>
<div class="line" style="margin:0px; padding:0px">})</div>
<div class="line" style="margin:0px; padding:0px">.catch(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">error) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(error);</span></div>
<div class="line" style="margin:0px; padding:0px">});</div>
</td>
</tr>
</tbody>
</table>
<h3 id="執行-POST-請求" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t5" target="_blank"></a>
執行 POST 請求</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">axios.post(<span class="string" style="margin:0px; padding:0px">'/user', {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">firstName: <span class="string" style="margin:0px; padding:0px">'Fred',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">lastName: <span class="string" style="margin:0px; padding:0px">'Flintstone'</span></span></div>
<div class="line" style="margin:0px; padding:0px">})</div>
<div class="line" style="margin:0px; padding:0px">.then(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">response) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response);</span></div>
<div class="line" style="margin:0px; padding:0px">})</div>
<div class="line" style="margin:0px; padding:0px">.catch(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">error) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(error);</span></div>
<div class="line" style="margin:0px; padding:0px">});</div>
</td>
</tr>
</tbody>
</table>
<h3 id="執行多個併發請求" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t6" target="_blank"></a>
執行多個併發請求</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function <span class="title" style="margin:0px; padding:0px">getUserAccount(<span class="params" style="margin:0px; padding:0px">)
 {</span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">return axios.get(<span class="string" style="margin:0px; padding:0px">'/user/12345');</span></span></div>
<div class="line" style="margin:0px; padding:0px">}</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function <span class="title" style="margin:0px; padding:0px">getUserPermissions(<span class="params" style="margin:0px; padding:0px">)
 {</span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">return axios.get(<span class="string" style="margin:0px; padding:0px">'/user/12345/permissions');</span></span></div>
<div class="line" style="margin:0px; padding:0px">}</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px">axios.all([getUserAccount(), getUserPermissions()])</div>
<div class="line" style="margin:0px; padding:0px">.then(axios.spread(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">acct, perms) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//兩個請求現已完成</span></div>
<div class="line" style="margin:0px; padding:0px">}));</div>
</td>
</tr>
</tbody>
</table>
<h2 id="axios-API" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t7" target="_blank"></a>
axios API</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
可以通過將相關配置傳遞給 axios 來進行請求。</p>
<h3 id="axios-config" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t8" target="_blank"></a>
axios(config)</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 發送一個 POST 請求</span></div>
<div class="line" style="margin:0px; padding:0px">axios({</div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">method: <span class="string" style="margin:0px; padding:0px">'post',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">url: <span class="string" style="margin:0px; padding:0px">'/user/12345',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">data: {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">firstName: <span class="string" style="margin:0px; padding:0px">'Fred',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">lastName: <span class="string" style="margin:0px; padding:0px">'Flintstone'</span></span></div>
<div class="line" style="margin:0px; padding:0px">}</div>
<div class="line" style="margin:0px; padding:0px">});</div>
</td>
</tr>
</tbody>
</table>
<h3 id="axios-url-config" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t9" target="_blank"></a>
axios(url[, config])</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 發送一個 GET 請求 (GET請求是默認請求模式)</span></div>
<div class="line" style="margin:0px; padding:0px">axios(<span class="string" style="margin:0px; padding:0px">'/user/12345');</span></div>
</td>
</tr>
</tbody>
</table>
<h3 id="請求方法別名" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t10" target="_blank"></a>
請求方法別名</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
爲了方便起見，已經爲所有支持的請求方法提供了別名。</p>
<ul style="margin:0px 0px 1em 40px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<li style="margin:0px; padding:0px; list-style-type:disc">axios.request（config）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.get（url [，config]）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.delete（url [，config]）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.head（url [，config]）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.post（url [，data [，config]]）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.put（url [，data [，config]]）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.patch（url [，data [，config]]）</li></ul>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<span style="margin:0px; padding:0px">注意</span><br style="margin:0px; padding:0px">
當使用別名方法時，不需要在config中指定url，method和data屬性。</p>
<h3 id="併發" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t11" target="_blank"></a>
併發</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
幫助函數處理併發請求。</p>
<ul style="margin:0px 0px 1em 40px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<li style="margin:0px; padding:0px; list-style-type:disc">axios.all（iterable）</li><li style="margin:0px; padding:0px; list-style-type:disc">axios.spread（callback）</li></ul>
<h3 id="創建實例" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t12" target="_blank"></a>
創建實例</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
您可以使用自定義配置創建axios的新實例。</p>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
axios.create（[config]）</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var instance = axios.create({</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">baseURL: <span class="string" style="margin:0px; padding:0px">'https://some-domain.com/api/',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">timeout: <span class="number" style="margin:0px; padding:0px">1000,</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">headers: {<span class="string" style="margin:0px; padding:0px">'X-Custom-Header': <span class="string" style="margin:0px; padding:0px">'foobar'}</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">});</div>
</td>
</tr>
</tbody>
</table>
<h3 id="實例方法" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t13" target="_blank"></a>
實例方法</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
可用的實例方法如下所示。 指定的配置將與實例配置合併。</p>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
axios＃request（config）<br style="margin:0px; padding:0px">
axios＃get（url [，config]）<br style="margin:0px; padding:0px">
axios＃delete（url [，config]）<br style="margin:0px; padding:0px">
axios＃head（url [，config]）<br style="margin:0px; padding:0px">
axios＃post（url [，data [，config]]）<br style="margin:0px; padding:0px">
axios＃put（url [，data [，config]]）<br style="margin:0px; padding:0px">
axios＃patch（url [，data [，config]]）</p>
<h2 id="請求配置" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t14" target="_blank"></a>
請求配置</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
這些是用於發出請求的可用配置選項。 只有url是必需的。 如果未指定方法，請求將默認爲GET。</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
<div class="line" style="margin:0px; padding:0px">13</div>
<div class="line" style="margin:0px; padding:0px">14</div>
<div class="line" style="margin:0px; padding:0px">15</div>
<div class="line" style="margin:0px; padding:0px">16</div>
<div class="line" style="margin:0px; padding:0px">17</div>
<div class="line" style="margin:0px; padding:0px">18</div>
<div class="line" style="margin:0px; padding:0px">19</div>
<div class="line" style="margin:0px; padding:0px">20</div>
<div class="line" style="margin:0px; padding:0px">21</div>
<div class="line" style="margin:0px; padding:0px">22</div>
<div class="line" style="margin:0px; padding:0px">23</div>
<div class="line" style="margin:0px; padding:0px">24</div>
<div class="line" style="margin:0px; padding:0px">25</div>
<div class="line" style="margin:0px; padding:0px">26</div>
<div class="line" style="margin:0px; padding:0px">27</div>
<div class="line" style="margin:0px; padding:0px">28</div>
<div class="line" style="margin:0px; padding:0px">29</div>
<div class="line" style="margin:0px; padding:0px">30</div>
<div class="line" style="margin:0px; padding:0px">31</div>
<div class="line" style="margin:0px; padding:0px">32</div>
<div class="line" style="margin:0px; padding:0px">33</div>
<div class="line" style="margin:0px; padding:0px">34</div>
<div class="line" style="margin:0px; padding:0px">35</div>
<div class="line" style="margin:0px; padding:0px">36</div>
<div class="line" style="margin:0px; padding:0px">37</div>
<div class="line" style="margin:0px; padding:0px">38</div>
<div class="line" style="margin:0px; padding:0px">39</div>
<div class="line" style="margin:0px; padding:0px">40</div>
<div class="line" style="margin:0px; padding:0px">41</div>
<div class="line" style="margin:0px; padding:0px">42</div>
<div class="line" style="margin:0px; padding:0px">43</div>
<div class="line" style="margin:0px; padding:0px">44</div>
<div class="line" style="margin:0px; padding:0px">45</div>
<div class="line" style="margin:0px; padding:0px">46</div>
<div class="line" style="margin:0px; padding:0px">47</div>
<div class="line" style="margin:0px; padding:0px">48</div>
<div class="line" style="margin:0px; padding:0px">49</div>
<div class="line" style="margin:0px; padding:0px">50</div>
<div class="line" style="margin:0px; padding:0px">51</div>
<div class="line" style="margin:0px; padding:0px">52</div>
<div class="line" style="margin:0px; padding:0px">53</div>
<div class="line" style="margin:0px; padding:0px">54</div>
<div class="line" style="margin:0px; padding:0px">55</div>
<div class="line" style="margin:0px; padding:0px">56</div>
<div class="line" style="margin:0px; padding:0px">57</div>
<div class="line" style="margin:0px; padding:0px">58</div>
<div class="line" style="margin:0px; padding:0px">59</div>
<div class="line" style="margin:0px; padding:0px">60</div>
<div class="line" style="margin:0px; padding:0px">61</div>
<div class="line" style="margin:0px; padding:0px">62</div>
<div class="line" style="margin:0px; padding:0px">63</div>
<div class="line" style="margin:0px; padding:0px">64</div>
<div class="line" style="margin:0px; padding:0px">65</div>
<div class="line" style="margin:0px; padding:0px">66</div>
<div class="line" style="margin:0px; padding:0px">67</div>
<div class="line" style="margin:0px; padding:0px">68</div>
<div class="line" style="margin:0px; padding:0px">69</div>
<div class="line" style="margin:0px; padding:0px">70</div>
<div class="line" style="margin:0px; padding:0px">71</div>
<div class="line" style="margin:0px; padding:0px">72</div>
<div class="line" style="margin:0px; padding:0px">73</div>
<div class="line" style="margin:0px; padding:0px">74</div>
<div class="line" style="margin:0px; padding:0px">75</div>
<div class="line" style="margin:0px; padding:0px">76</div>
<div class="line" style="margin:0px; padding:0px">77</div>
<div class="line" style="margin:0px; padding:0px">78</div>
<div class="line" style="margin:0px; padding:0px">79</div>
<div class="line" style="margin:0px; padding:0px">80</div>
<div class="line" style="margin:0px; padding:0px">81</div>
<div class="line" style="margin:0px; padding:0px">82</div>
<div class="line" style="margin:0px; padding:0px">83</div>
<div class="line" style="margin:0px; padding:0px">84</div>
<div class="line" style="margin:0px; padding:0px">85</div>
<div class="line" style="margin:0px; padding:0px">86</div>
<div class="line" style="margin:0px; padding:0px">87</div>
<div class="line" style="margin:0px; padding:0px">88</div>
<div class="line" style="margin:0px; padding:0px">89</div>
<div class="line" style="margin:0px; padding:0px">90</div>
<div class="line" style="margin:0px; padding:0px">91</div>
<div class="line" style="margin:0px; padding:0px">92</div>
<div class="line" style="margin:0px; padding:0px">93</div>
<div class="line" style="margin:0px; padding:0px">94</div>
<div class="line" style="margin:0px; padding:0px">95</div>
<div class="line" style="margin:0px; padding:0px">96</div>
<div class="line" style="margin:0px; padding:0px">97</div>
<div class="line" style="margin:0px; padding:0px">98</div>
<div class="line" style="margin:0px; padding:0px">99</div>
<div class="line" style="margin:0px; padding:0px">100</div>
<div class="line" style="margin:0px; padding:0px">101</div>
<div class="line" style="margin:0px; padding:0px">102</div>
<div class="line" style="margin:0px; padding:0px">103</div>
<div class="line" style="margin:0px; padding:0px">104</div>
<div class="line" style="margin:0px; padding:0px">105</div>
<div class="line" style="margin:0px; padding:0px">106</div>
<div class="line" style="margin:0px; padding:0px">107</div>
<div class="line" style="margin:0px; padding:0px">108</div>
<div class="line" style="margin:0px; padding:0px">109</div>
<div class="line" style="margin:0px; padding:0px">110</div>
<div class="line" style="margin:0px; padding:0px">111</div>
<div class="line" style="margin:0px; padding:0px">112</div>
<div class="line" style="margin:0px; padding:0px">113</div>
<div class="line" style="margin:0px; padding:0px">114</div>
<div class="line" style="margin:0px; padding:0px">115</div>
<div class="line" style="margin:0px; padding:0px">116</div>
<div class="line" style="margin:0px; padding:0px">117</div>
<div class="line" style="margin:0px; padding:0px">118</div>
<div class="line" style="margin:0px; padding:0px">119</div>
<div class="line" style="margin:0px; padding:0px">120</div>
<div class="line" style="margin:0px; padding:0px">121</div>
<div class="line" style="margin:0px; padding:0px">122</div>
<div class="line" style="margin:0px; padding:0px">123</div>
<div class="line" style="margin:0px; padding:0px">124</div>
<div class="line" style="margin:0px; padding:0px">125</div>
<div class="line" style="margin:0px; padding:0px">126</div>
<div class="line" style="margin:0px; padding:0px">127</div>
<div class="line" style="margin:0px; padding:0px">128</div>
<div class="line" style="margin:0px; padding:0px">129</div>
<div class="line" style="margin:0px; padding:0px">130</div>
<div class="line" style="margin:0px; padding:0px">131</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">{</div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `url`是將用於請求的服務器URL</span></div>
<div class="line" style="margin:0px; padding:0px">url: <span class="string" style="margin:0px; padding:0px">'/user',</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `method`是發出請求時使用的請求方法</span></div>
<div class="line" style="margin:0px; padding:0px">method: <span class="string" style="margin:0px; padding:0px">'get', <span class="comment" style="margin:0px; padding:0px">// 默認</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `baseURL`將被添加到`url`前面，除非`url`是絕對的。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 可以方便地爲 axios 的實例設置`baseURL`，以便將相對 URL 傳遞給該實例的方法。</span></div>
<div class="line" style="margin:0px; padding:0px">baseURL: <span class="string" style="margin:0px; padding:0px">'https://some-domain.com/api/',</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `transformRequest`允許在請求數據發送到服務器之前對其進行更改</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 這隻適用於請求方法'PUT'，'POST'和'PATCH'</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 數組中的最後一個函數必須返回一個字符串，一個 ArrayBuffer或一個 Stream</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px">transformRequest: [<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">data) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 做任何你想要的數據轉換</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">return data;</span></div>
<div class="line" style="margin:0px; padding:0px">}],</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `transformResponse`允許在 then / catch之前對響應數據進行更改</span></div>
<div class="line" style="margin:0px; padding:0px">transformResponse: [<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">data) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// Do whatever you want to transform the data</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">return data;</span></div>
<div class="line" style="margin:0px; padding:0px">}],</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `headers`是要發送的自定義 headers</span></div>
<div class="line" style="margin:0px; padding:0px">headers: {<span class="string" style="margin:0px; padding:0px">'X-Requested-With': <span class="string" style="margin:0px; padding:0px">'XMLHttpRequest'},</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `params`是要與請求一起發送的URL參數</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 必須是純對象或URLSearchParams對象</span></div>
<div class="line" style="margin:0px; padding:0px">params: {</div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">ID: <span class="number" style="margin:0px; padding:0px">12345</span></span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `paramsSerializer`是一個可選的函數，負責序列化`params`</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// (e.g. https://www.npmjs.com/package/qs, http://api.jquery.com/jquery.param/)</span></div>
<div class="line" style="margin:0px; padding:0px">paramsSerializer: <span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function(<span class="params" style="margin:0px; padding:0px">params) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">return Qs.stringify(params, {<span class="attr" style="margin:0px; padding:0px">arrayFormat: <span class="string" style="margin:0px; padding:0px">'brackets'})</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `data`是要作爲請求主體發送的數據</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 僅適用於請求方法“PUT”，“POST”和“PATCH”</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 當沒有設置`transformRequest`時，必須是以下類型之一：</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// - Browser only: FormData, File, Blob</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// - Node only: Stream</span></div>
<div class="line" style="margin:0px; padding:0px">data: {</div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">firstName: <span class="string" style="margin:0px; padding:0px">'Fred'</span></span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `timeout`指定請求超時之前的毫秒數。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 如果請求的時間超過'timeout'，請求將被中止。</span></div>
<div class="line" style="margin:0px; padding:0px">timeout: <span class="number" style="margin:0px; padding:0px">1000,</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `withCredentials`指示是否跨站點訪問控制請求</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// should be made using credentials</span></div>
<div class="line" style="margin:0px; padding:0px">withCredentials: <span class="literal" style="margin:0px; padding:0px">false, <span class="comment" style="margin:0px; padding:0px">// default</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `adapter'允許自定義處理請求，這使得測試更容易。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 返回一個promise並提供一個有效的響應（參見[response docs]（＃response-api））</span></div>
<div class="line" style="margin:0px; padding:0px">adapter: <span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">config) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">/* ... */</span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `auth'表示應該使用 HTTP 基本認證，並提供憑據。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 這將設置一個`Authorization'頭，覆蓋任何現有的`Authorization'自定義頭，使用`headers`設置。</span></div>
<div class="line" style="margin:0px; padding:0px">auth: {</div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">username: <span class="string" style="margin:0px; padding:0px">'janedoe',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">password: <span class="string" style="margin:0px; padding:0px">'s00pers3cret'</span></span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// “responseType”表示服務器將響應的數據類型</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 包括 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'</span></div>
<div class="line" style="margin:0px; padding:0px">responseType: <span class="string" style="margin:0px; padding:0px">'json', <span class="comment" style="margin:0px; padding:0px">// default</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//`xsrfCookieName`是要用作 xsrf 令牌的值的cookie的名稱</span></div>
<div class="line" style="margin:0px; padding:0px">xsrfCookieName: <span class="string" style="margin:0px; padding:0px">'XSRF-TOKEN', <span class="comment" style="margin:0px; padding:0px">// default</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `xsrfHeaderName`是攜帶xsrf令牌值的http頭的名稱</span></div>
<div class="line" style="margin:0px; padding:0px">xsrfHeaderName: <span class="string" style="margin:0px; padding:0px">'X-XSRF-TOKEN', <span class="comment" style="margin:0px; padding:0px">// default</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `onUploadProgress`允許處理上傳的進度事件</span></div>
<div class="line" style="margin:0px; padding:0px">onUploadProgress: <span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">progressEvent) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 使用本地 progress 事件做任何你想要做的</span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `onDownloadProgress`允許處理下載的進度事件</span></div>
<div class="line" style="margin:0px; padding:0px">onDownloadProgress: <span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">progressEvent)
 {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// Do whatever you want with the native progress event</span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `maxContentLength`定義允許的http響應內容的最大大小</span></div>
<div class="line" style="margin:0px; padding:0px">maxContentLength: <span class="number" style="margin:0px; padding:0px">2000,</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `validateStatus`定義是否解析或拒絕給定的promise</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// HTTP響應狀態碼。如果`validateStatus`返回`true`（或被設置爲`null` promise將被解析;否則，promise將被</span></div>
<div class="line" style="margin:0px; padding:0px">  <span class="comment" style="margin:0px; padding:0px">// 拒絕。</span></div>
<div class="line" style="margin:0px; padding:0px">validateStatus: <span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">status) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">return status >= <span class="number" style="margin:0px; padding:0px">200 && status < <span class="number" style="margin:0px; padding:0px">300; <span class="comment" style="margin:0px; padding:0px">//
 default</span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `maxRedirects`定義在node.js中要遵循的重定向的最大數量。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 如果設置爲0，則不會遵循重定向。</span></div>
<div class="line" style="margin:0px; padding:0px">maxRedirects: <span class="number" style="margin:0px; padding:0px">5, <span class="comment" style="margin:0px; padding:0px">// 默認</span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `httpAgent`和`httpsAgent`用於定義在node.js中分別執行http和https請求時使用的自定義代理。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 允許配置類似`keepAlive`的選項，</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 默認情況下不啓用。</span></div>
<div class="line" style="margin:0px; padding:0px">httpAgent: <span class="keyword" style="margin:0px; padding:0px">new http.Agent({ <span class="attr" style="margin:0px; padding:0px">keepAlive: <span class="literal" style="margin:0px; padding:0px">true }),</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">httpsAgent: <span class="keyword" style="margin:0px; padding:0px">new https.Agent({ <span class="attr" style="margin:0px; padding:0px">keepAlive: <span class="literal" style="margin:0px; padding:0px">true
 }),</span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 'proxy'定義代理服務器的主機名和端口</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// `auth`表示HTTP Basic auth應該用於連接到代理，並提供credentials。</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 這將設置一個`Proxy-Authorization` header，覆蓋任何使用`headers`設置的現有的`Proxy-Authorization` 自定義 headers。</span></div>
<div class="line" style="margin:0px; padding:0px">proxy: {</div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">host: <span class="string" style="margin:0px; padding:0px">'127.0.0.1',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">port: <span class="number" style="margin:0px; padding:0px">9000,</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">auth: : {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">username: <span class="string" style="margin:0px; padding:0px">'mikeymike',</span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">password: <span class="string" style="margin:0px; padding:0px">'rapunz3l'</span></span></div>
<div class="line" style="margin:0px; padding:0px">}</div>
<div class="line" style="margin:0px; padding:0px">},</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// “cancelToken”指定可用於取消請求的取消令牌</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// (see Cancellation section below for details)</span></div>
<div class="line" style="margin:0px; padding:0px">cancelToken: <span class="keyword" style="margin:0px; padding:0px">new CancelToken(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">cancel)
 {</span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px">})</div>
<div class="line" style="margin:0px; padding:0px">}</div>
</td>
</tr>
</tbody>
</table>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
使用 then 時，您將收到如下響應：</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">axios.get(<span class="string" style="margin:0px; padding:0px">'/user/12345')</span></div>
<div class="line" style="margin:0px; padding:0px">.then(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function(<span class="params" style="margin:0px; padding:0px">response) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response.data);</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response.status);</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response.statusText);</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response.headers);</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(response.config);</span></div>
<div class="line" style="margin:0px; padding:0px">});</div>
</td>
</tr>
</tbody>
</table>
<h2 id="配置默認值" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t15" target="_blank"></a>
配置默認值</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
您可以指定將應用於每個請求的配置默認值。</p>
<h3 id="全局axios默認值" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t16" target="_blank"></a>
全局axios默認值</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">axios.defaults.baseURL = <span class="string" style="margin:0px; padding:0px">'https://api.example.com';</span></div>
<div class="line" style="margin:0px; padding:0px">axios.defaults.headers.common[<span class="string" style="margin:0px; padding:0px">'Authorization'] = AUTH_TOKEN;</span></div>
<div class="line" style="margin:0px; padding:0px">axios.defaults.headers.post[<span class="string" style="margin:0px; padding:0px">'Content-Type'] = <span class="string" style="margin:0px; padding:0px">'application/x-www-form-urlencoded';</span></span></div>
</td>
</tr>
</tbody>
</table>
<h3 id="自定義實例默認值" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t17" target="_blank"></a>
自定義實例默認值</h3>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//在創建實例時設置配置默認值</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var instance = axios.create（{</span></div>
<div class="line" style="margin:0px; padding:0px">   baseURL：<span class="string" style="margin:0px; padding:0px">'https://api.example.com'</span></div>
<div class="line" style="margin:0px; padding:0px">}）;</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//在實例創建後改變默認值</span></div>
<div class="line" style="margin:0px; padding:0px">instance.defaults.headers.common [<span class="string" style="margin:0px; padding:0px">'Authorization'] = AUTH_TOKEN;</span></div>
</td>
</tr>
</tbody>
</table>
<h3 id="配置優先級順序" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t18" target="_blank"></a>
配置優先級順序</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
配置將與優先順序合併。 順序是lib / defaults.<a href="http://lib.csdn.net/base/javascript" class="replace_word" title="JavaScript知識庫" target="_blank" style="color:#df3434; font-weight:bold;">js</a>中的庫默認值，然後是實例的defaults屬性，最後是請求的config參數。 後者將優先於前者。 這裏有一個例子。</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//使用庫提供的配置默認值創建實例</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//此時，超時配置值爲`0`，這是庫的默認值</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var instance = axios.create（）;</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//覆蓋庫的超時默認值</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//現在所有請求將在超時前等待2.5秒</span></div>
<div class="line" style="margin:0px; padding:0px">instance.defaults.timeout = <span class="number" style="margin:0px; padding:0px">2500;</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//覆蓋此請求的超時，因爲它知道需要很長時間</span></div>
<div class="line" style="margin:0px; padding:0px">instance.get（<span class="string" style="margin:0px; padding:0px">'/ longRequest'，{</span></div>
<div class="line" style="margin:0px; padding:0px">   timeout：<span class="number" style="margin:0px; padding:0px">5000</span></div>
<div class="line" style="margin:0px; padding:0px">}）;</div>
</td>
</tr>
</tbody>
</table>
<h2 id="攔截器" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t19" target="_blank"></a>
攔截器</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
你可以截取請求或響應在被 then 或者 catch 處理之前</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
<div class="line" style="margin:0px; padding:0px">13</div>
<div class="line" style="margin:0px; padding:0px">14</div>
<div class="line" style="margin:0px; padding:0px">15</div>
<div class="line" style="margin:0px; padding:0px">16</div>
<div class="line" style="margin:0px; padding:0px">17</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//添加請求攔截器</span></div>
<div class="line" style="margin:0px; padding:0px">axios.interceptors.request.use（<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function（<span class="title" style="margin:0px; padding:0px">config）{</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="comment" style="margin:0px; padding:0px">//在發送請求之前做某事</span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="keyword" style="margin:0px; padding:0px">return config;</span></div>
<div class="line" style="margin:0px; padding:0px">   }，<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function（<span class="title" style="margin:0px; padding:0px">error）{</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="comment" style="margin:0px; padding:0px">//請求錯誤時做些事</span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="keyword" style="margin:0px; padding:0px">return <span class="built_in" style="margin:0px; padding:0px">Promise.reject（error）;</span></span></div>
<div class="line" style="margin:0px; padding:0px">   }）;</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//添加響應攔截器</span></div>
<div class="line" style="margin:0px; padding:0px">axios.interceptors.response.use（<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function（<span class="title" style="margin:0px; padding:0px">response）{</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="comment" style="margin:0px; padding:0px">//對響應數據做些事</span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="keyword" style="margin:0px; padding:0px">return response;</span></div>
<div class="line" style="margin:0px; padding:0px">   }，<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function（<span class="title" style="margin:0px; padding:0px">error）{</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="comment" style="margin:0px; padding:0px">//請求錯誤時做些事</span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="keyword" style="margin:0px; padding:0px">return <span class="built_in" style="margin:0px; padding:0px">Promise.reject（error）;</span></span></div>
<div class="line" style="margin:0px; padding:0px">   }）;</div>
</td>
</tr>
</tbody>
</table>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
如果你以後可能需要刪除攔截器。</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var myInterceptor = axios.interceptors.request.use(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function
 (<span class="params" style="margin:0px; padding:0px">) {<span class="comment" style="margin:0px; padding:0px">/*...*/});</span></span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px">axios.interceptors.request.eject(myInterceptor);</div>
</td>
</tr>
</tbody>
</table>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
你可以將攔截器添加到axios的自定義實例。</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var instance = axios.create();</span></div>
<div class="line" style="margin:0px; padding:0px">instance.interceptors.request.use(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function (<span class="params" style="margin:0px; padding:0px">)
 {<span class="comment" style="margin:0px; padding:0px">/*...*/});</span></span></span></span></div>
</td>
</tr>
</tbody>
</table>
<h2 id="處理錯誤" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t20" target="_blank"></a>
處理錯誤</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
<div class="line" style="margin:0px; padding:0px">13</div>
<div class="line" style="margin:0px; padding:0px">14</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">axios.get（<span class="string" style="margin:0px; padding:0px">'/ user / 12345'）</span></div>
<div class="line" style="margin:0px; padding:0px">   .catch（<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function（<span class="title" style="margin:0px; padding:0px">error）{</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="keyword" style="margin:0px; padding:0px">if（error.response）{</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="comment" style="margin:0px; padding:0px">//請求已發出，但服務器使用狀態代碼進行響應</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="comment" style="margin:0px; padding:0px">//落在2xx的範圍之外</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="built_in" style="margin:0px; padding:0px">console.log（error.response.data）;</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="built_in" style="margin:0px; padding:0px">console.log（error.response.status）;</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="built_in" style="margin:0px; padding:0px">console.log（error.response.headers）;</span></div>
<div class="line" style="margin:0px; padding:0px">     } <span class="keyword" style="margin:0px; padding:0px">else {</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="comment" style="margin:0px; padding:0px">//在設置觸發錯誤的請求時發生了錯誤</span></div>
<div class="line" style="margin:0px; padding:0px">       <span class="built_in" style="margin:0px; padding:0px">console.log（<span class="string" style="margin:0px; padding:0px">'Error'，error.message）;</span></span></div>
<div class="line" style="margin:0px; padding:0px">     }}</div>
<div class="line" style="margin:0px; padding:0px">     <span class="built_in" style="margin:0px; padding:0px">console.log（error.config）;</span></div>
<div class="line" style="margin:0px; padding:0px">   }）;</div>
</td>
</tr>
</tbody>
</table>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
您可以使用validateStatus配置選項定義自定義HTTP狀態碼錯誤範圍。</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">axios.get（<span class="string" style="margin:0px; padding:0px">'/ user / 12345'，{</span></div>
<div class="line" style="margin:0px; padding:0px">   validateStatus：<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function（<span class="title" style="margin:0px; padding:0px">status）{</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="keyword" style="margin:0px; padding:0px">return status < <span class="number" style="margin:0px; padding:0px">500; <span class="comment" style="margin:0px; padding:0px">//僅當狀態代碼大於或等於500時拒絕</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">   }}</div>
<div class="line" style="margin:0px; padding:0px">}）</div>
</td>
</tr>
</tbody>
</table>
<h2 id="消除" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t21" target="_blank"></a>
消除</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
您可以使用取消令牌取消請求。</p>
<blockquote style="margin:0px; padding:5px 10px; border-top:none; border-right:none; border-bottom:none; border-left:5px solid rgb(221,221,221); color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; color:rgb(119,119,119)">
axios cancel token API基於可取消的promise提議，目前處於階段1。</p>
</blockquote>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
您可以使用CancelToken.source工廠創建一個取消令牌，如下所示：</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
<div class="line" style="margin:0px; padding:0px">13</div>
<div class="line" style="margin:0px; padding:0px">14</div>
<div class="line" style="margin:0px; padding:0px">15</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var CancelToken = axios.CancelToken;</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var source = CancelToken.source（）;</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px">axios.get(<span class="string" style="margin:0px; padding:0px">'/user/12345', {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="attr" style="margin:0px; padding:0px">cancelToken: source.token</span></div>
<div class="line" style="margin:0px; padding:0px">}).catch(<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function(<span class="params" style="margin:0px; padding:0px">thrown) {</span></span></span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">if (axios.isCancel(thrown)) {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="built_in" style="margin:0px; padding:0px">console.log(<span class="string" style="margin:0px; padding:0px">'Request canceled', thrown.message);</span></span></div>
<div class="line" style="margin:0px; padding:0px">} <span class="keyword" style="margin:0px; padding:0px">else {</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 處理錯誤</span></div>
<div class="line" style="margin:0px; padding:0px">}</div>
<div class="line" style="margin:0px; padding:0px">});</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">//取消請求（消息參數是可選的）</span></div>
<div class="line" style="margin:0px; padding:0px">source.cancel（<span class="string" style="margin:0px; padding:0px">'操作被用戶取消。'）;</span></div>
</td>
</tr>
</tbody>
</table>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
您還可以通過將執行器函數傳遞給CancelToken構造函數來創建取消令牌：</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
<div class="line" style="margin:0px; padding:0px">5</div>
<div class="line" style="margin:0px; padding:0px">6</div>
<div class="line" style="margin:0px; padding:0px">7</div>
<div class="line" style="margin:0px; padding:0px">8</div>
<div class="line" style="margin:0px; padding:0px">9</div>
<div class="line" style="margin:0px; padding:0px">10</div>
<div class="line" style="margin:0px; padding:0px">11</div>
<div class="line" style="margin:0px; padding:0px">12</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var CancelToken = axios.CancelToken;</span></div>
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var cancel;</span></div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px">axios.get（<span class="string" style="margin:0px; padding:0px">'/ user / 12345'，{</span></div>
<div class="line" style="margin:0px; padding:0px">   cancelToken：<span class="keyword" style="margin:0px; padding:0px">new CancelToken（<span class="function" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">function <span class="title" style="margin:0px; padding:0px">executor（<span class="title" style="margin:0px; padding:0px">c）{</span></span></span></span></span></div>
<div class="line" style="margin:0px; padding:0px">     <span class="comment" style="margin:0px; padding:0px">//一個執行器函數接收一個取消函數作爲參數</span></div>
<div class="line" style="margin:0px; padding:0px">     cancel = c;</div>
<div class="line" style="margin:0px; padding:0px">   }）</div>
<div class="line" style="margin:0px; padding:0px">}）;</div>
<div class="line" style="margin:0px; padding:0px"> </div>
<div class="line" style="margin:0px; padding:0px"><span class="comment" style="margin:0px; padding:0px">// 取消請求</span></div>
<div class="line" style="margin:0px; padding:0px">clear();</div>
</td>
</tr>
</tbody>
</table>
<blockquote style="margin:0px; padding:5px 10px; border-top:none; border-right:none; border-bottom:none; border-left:5px solid rgb(221,221,221); color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; color:rgb(119,119,119)">
注意：您可以使用相同的取消令牌取消幾個請求。</p>
</blockquote>
<h2 id="使用application-x-www-form-urlencoded格式" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t22" target="_blank"></a>
使用application / x-www-form-urlencoded格式</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
默認情況下，axios將<a href="http://lib.csdn.net/base/javascript" class="replace_word" title="JavaScript知識庫" target="_blank" style="color:#df3434; font-weight:bold;">JavaScript</a>對象序列化爲JSON。 要以應用程序/ x-www-form-urlencoded格式發送數據，您可以使用以下選項之一。</p>
<h3 id="瀏覽器" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t23" target="_blank"></a>
瀏覽器</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
在瀏覽器中，您可以使用URLSearchParams API，如下所示：</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
<div class="line" style="margin:0px; padding:0px">3</div>
<div class="line" style="margin:0px; padding:0px">4</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var params = <span class="keyword" style="margin:0px; padding:0px">new URLSearchParams();</span></span></div>
<div class="line" style="margin:0px; padding:0px">params.append(<span class="string" style="margin:0px; padding:0px">'param1', <span class="string" style="margin:0px; padding:0px">'value1');</span></span></div>
<div class="line" style="margin:0px; padding:0px">params.append(<span class="string" style="margin:0px; padding:0px">'param2', <span class="string" style="margin:0px; padding:0px">'value2');</span></span></div>
<div class="line" style="margin:0px; padding:0px">axios.post(<span class="string" style="margin:0px; padding:0px">'/foo', params);</span></div>
</td>
</tr>
</tbody>
</table>
<blockquote style="margin:0px; padding:5px 10px; border-top:none; border-right:none; border-bottom:none; border-left:5px solid rgb(221,221,221); color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin-top:0px; margin-bottom:0px; padding-top:0px; padding-bottom:0px; color:rgb(119,119,119)">
請注意，所有瀏覽器都不支持URLSearchParams，但是有一個polyfill可用（確保polyfill全局環境）。</p>
</blockquote>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
或者，您可以使用qs庫對數據進行編碼：</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var qs = <span class="built_in" style="margin:0px; padding:0px">require(<span class="string" style="margin:0px; padding:0px">'qs');</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">axios.post(<span class="string" style="margin:0px; padding:0px">'/foo', qs.stringify({ <span class="string" style="margin:0px; padding:0px">'bar': <span class="number" style="margin:0px; padding:0px">123 });</span></span></span></div>
</td>
</tr>
</tbody>
</table>
<h3 id="Node-js" style="margin:10px 0px; padding:0px; font-size:16px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t24" target="_blank"></a>
Node.js</h3>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
在<a href="http://lib.csdn.net/base/nodejs" class="replace_word" title="Node.js知識庫" target="_blank" style="color:#df3434; font-weight:bold;">Node.js</a>中，可以使用querystring模塊，如下所示：</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">var querystring = <span class="built_in" style="margin:0px; padding:0px">require(<span class="string" style="margin:0px; padding:0px">'querystring');</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">axios.post(<span class="string" style="margin:0px; padding:0px">'http://something.com/', querystring.stringify({ <span class="attr" style="margin:0px; padding:0px">foo: <span class="string" style="margin:0px; padding:0px">'bar'
 });</span></span></span></div>
</td>
</tr>
</tbody>
</table>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
你也可以使用qs庫。</p>
<h2 id="Promise" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t25" target="_blank"></a>
Promise</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
axios 依賴本機要支持ES6 Promise實現。 如果您的環境不支持ES6 Promises，您可以使用polyfill。</p>
<h2 id="TypeScript" style="margin:20px 0px; padding:0px; font-size:21px; line-height:1.5; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif"><a name="t26" target="_blank"></a>
TypeScript</h2>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
axios包括TypeScript定義。</p>
<table style="margin:0px; padding:0px; border-collapse:collapse; border-spacing:0px; max-width:850px; border:1px solid silver; word-break:break-word; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<tbody style="margin:0px; padding:0px">
<tr style="margin:0px; padding:0px">
<td class="gutter" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px">1</div>
<div class="line" style="margin:0px; padding:0px">2</div>
</td>
<td class="code" style="margin:0px; padding:3px; border:1px solid silver; border-collapse:collapse">
<div class="line" style="margin:0px; padding:0px"><span class="keyword" style="margin:0px; padding:0px">import axios <span class="keyword" style="margin:0px; padding:0px">from <span class="string" style="margin:0px; padding:0px">'axios';</span></span></span></div>
<div class="line" style="margin:0px; padding:0px">axios.get(<span class="string" style="margin:0px; padding:0px">'/user?ID=12345');</span></div>
</td>
</tr>
</tbody>
</table>
<hr style="margin:0px; padding:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; color:rgb(51,51,51); font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
axios在很大程度上受到Angular提供的$http服務的啓發。 最終，axios努力提供一個在Angular外使用的獨立的$http-like服務。</p>
<p style="margin:10px auto; padding-top:0px; padding-bottom:0px; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px">
<span style="color:#ff0000">轉載：http://www.cnblogs.com/libin-1/p/6445356.html</span></p>
   
</div>




<!-- Baidu Button BEGIN -->




<div class="bdsharebuttonbox tracking-ad bdshare-button-style0-16" style="float: right;" data-mod="popu_172" data-bd-bind="1502435898674">
<a href="#" class="bds_more" data-cmd="more" style="background-position:0 0 !important; background-image: url(http://bdimg.share.baidu.com/static/api/img/share/icons_0_16.png?v=d754dcc0.png) !important" target="_blank"></a>
<a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空間" style="background-position:0 -52px !important" target="_blank"></a>
<a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博" style="background-position:0 -104px !important" target="_blank"></a>
<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到騰訊微博" style="background-position:0 -260px !important" target="_blank"></a>
<a href="#" class="bds_renren" data-cmd="renren" title="分享到人人網" style="background-position:0 -208px !important" target="_blank"></a>
<a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信" style="background-position:0 -1612px !important" target="_blank"></a>
</div>
<script>window._bd_share_config = { "common": { "bdSnsKey": {}, "bdText": "", "bdMini": "1", "bdMiniList": false, "bdPic": "", "bdStyle": "0", "bdSize": "16" }, "share": {} }; with (document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];</script>
<!-- Baidu Button END -->

   

<!--172.16.140.15-->

<!-- Baidu Button BEGIN -->
<script type="text/javascript" id="bdshare_js" data="type=tools&uid=1536434" src="http://bdimg.share.baidu.com/static/js/bds_s_v2.js?cdnversion=417344"></script>

<script type="text/javascript">
    document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000)
</script>
<!-- Baidu Button END -->



 


        <div id="digg" articleid="71079745">
            <dl id="btnDigg" class="digg digg_enable" onclick="btndigga();">
               
                 <dt>頂</dt>
                <dd>1</dd>
            </dl>
           
              
            <dl id="btnBury" class="digg digg_enable" onclick="btnburya();">
              
                  <dt>踩</dt>
                <dd>0</dd>               
            </dl>
            
        </div>
     <div class="tracking-ad" data-mod="popu_222"><a href="javascript:void(0);" target="_blank"> </a>   </div>
    <div class="tracking-ad" data-mod="popu_223"> <a href="javascript:void(0);" target="_blank"> </a></div>
    <script type="text/javascript">
        function btndigga() {
            $(".tracking-ad[data-mod='popu_222'] a").click();
        }
        function btnburya() {
            $(".tracking-ad[data-mod='popu_223'] a").click();
        }
            </script>

   <ul class="article_next_prev">
                <li class="prev_article"><span onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_shangyipian']);location.href='http://blog.csdn.net/hsany330/article/details/70755735';">上一篇</span><a href="http://blog.csdn.net/hsany330/article/details/70755735" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_shangyipian'])">axios – 基於 Promise 的 HTTP 異步請求庫</a></li>
                <li class="next_article"><span onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_xiayipian']);location.href='http://blog.csdn.net/hsany330/article/details/71081976';">下一篇</span><a href="http://blog.csdn.net/hsany330/article/details/71081976" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_xiayipian'])">一個項目學會前端實現登錄攔截</a></li>
    </ul>

    <div style="clear:both; height:10px;"></div>


            <div class="similar_article">
                    <h4></h4>
                    <div class="similar_c" style="margin:20px 0px 0px 0px">
                        <div class="similar_c_t">
                            相關文章推薦
                        </div>
                   
                        <div class="similar_wrap tracking-ad" data-mod="popu_36">                       
                            <ul class="similar_list fl">    
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/75581716" title="Vue.js 中，7種定義組件模板的方法 | Codementor" strategy="BlogCommendFromBaidu" target="_blank">Vue.js 中，7種定義組件模板的方法 | Codementor</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/64124600" title="Webpack 配置中的一股清流" strategy="BlogCommendFromBaidu" target="_blank">Webpack 配置中的一股清流</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/75950356" title="Vue官方文檔梳理-全局配置" strategy="BlogCommendFromBaidu" target="_blank">Vue官方文檔梳理-全局配置</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/67008175" title="Webpack2.0中文文檔" strategy="BlogCommendFromBaidu" target="_blank">Webpack2.0中文文檔</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/Generon/article/details/72848158" title="vue開發：vue+axios實現登錄攔截" strategy="BlogCommendFromBaidu" target="_blank">vue開發：vue+axios實現登錄攔截</a>
                                   </li>
                            </ul>
                              <ul class="similar_list fr">      
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/61924901" title="Webpack入門之遇到的那些坑，系列示例Demo" strategy="BlogCommendFromBaidu" target="_blank">Webpack入門之遇到的那些坑，系列示例Demo</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/75227873" title="vuex初探" strategy="BlogCommendFromBaidu" target="_blank">vuex初探</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/69371946" title="原創超清的 Webpack2 視頻教程" strategy="BlogCommendFromBaidu" target="_blank">原創超清的 Webpack2 視頻教程</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/sinat_17775997/article/details/69367204" title="axios在vue中的簡單配置與使用" strategy="BlogCommendFromBaidu" target="_blank">axios在vue中的簡單配置與使用</a>
                                   </li>
                                   <li>
                                       <em>•</em>
                                       <a href="http://blog.csdn.net/binginsist/article/details/65630547" title="vue2.0之axios使用詳解(一)" strategy="BlogCommendFromBaidu" target="_blank">vue2.0之axios使用詳解(一)</a>
                                   </li>
                            </ul>
                        </div>
                    </div>
                </div>   
      
</div>