PHP研習社-VS Code 擴展巡禮-REST Client

基本介紹

REST Client 是 VS Code 商店的一個 HTTP 訪問擴展，官方地址 REST Client，用於模擬 HTTP請求。

咱們能夠在官方介紹中關注兩點

1 基本的 HTTP 請求模擬，HTTP 輸入和 HTTP 響應
2 VS Code 自帶的輔助功能，如自動補全 Http Content-Type 等信息

REST Client 的優點

REST Client 是一個 Http 請求模擬插件，有人會說我用 PostMan 也能夠實現一樣的功能，沒錯。可是在我看來，REST Client 的優點如下幾點

1 與 VS Code 結合，方便開發人員進行接口單元測試。

2 基於手寫 HTTP 報文進行請求，報文有嚴格的格式，編寫者能夠對 HTTP 協議和報文進行深刻理解，如何設置請求頭，如何組織不一樣 Content-Type 的請求參數，都會涉及到。

3 在先後端分離已經成爲開發團隊主流標配的狀況下，開發人員能夠對後端接口進行單元測試，QA 人員能夠進行單獨驗收，對於這些平常操做，REST Client 是一款高效可靠的工具。

HTTP 報文內容格式

如下是 VS Code REST Client 中經常使用的兩種請求方式的 HTTP 報文內容

application/json 請求

GET

GET https://example.com/topics/1 HTTP/1.1

POST

POST https://example.com/comments HTTP/1.1
content-type: application/json

{
"name": "sample",
"time": "Wed, 21 Oct 2015 18:27:50 GMT"
}

application/x-www-form-urlencoded 請求

GET

GET https://example.com/comments
?page=2
&pageSize=10

POST

POST https://api.example.com/login HTTP/1.1
Content-Type: application/x-www-form-urlencoded

name=foo
&password=bar

以下圖中所示，能夠看到請求端請求和服務端返回，藍色框中是跨域相關的設置

發送嵌套 json 請求

Content-Type: application/json

{
    "type":1,
    "data":{
        "vcc_code" : "",
        "server_num" : "0102000558",
        "cus_phone" : "100",
        "cus_phone_areacode" : "",
        "cus_phone_areaname" : "",
        "cus_phone_type" : "TEL",
        "ag_name" : "20",
        "ag_num" : "30",
        "ag_phone" : "8001",
        "endResult_code" : "12",
        "user_data" : []
    }
}

HTTP Language

Add language support for HTTP request, with features like syntax highlight, auto completion, code lens and comment support, when writing HTTP request in Visual Studio Code. By default, the language association will be automatically activated in two cases:

1. File with extension .http or .rest
2. First line of file follows standard request line in RFC 2616, with Method SP Request-URI SP HTTP-Version format

以上是 github 文檔中的說明，大體兩個意思

1 Http 報文的文件後綴能夠是.http 或者.rest. 這樣 VS Code 能夠識別出來這是報文文件，自動提示，色彩顯示呀，很漂亮。

項目中能夠將報文以 http 文件的形式歸檔整理，做爲項目的一部分。

2 報文的格式，嚴格按照 RFC 2616，主要是一行一個元素。

再說 ContentType

這裏作一個簡單的基礎內容回顧

multipart/form-data：當須要在表單中進行文件上傳時，使用該格式
application/json：application/json 這個 Content-Type 做爲響應頭你們確定不陌生。

實際上，如今愈來愈多的人把 application/json 做爲請求頭，用來告訴服務端消息主體是序列化後的 JSON 字符串

application/x-www-form-urlencoded：默認的 contencType，當 form 表單請求爲 get 時，數據被編碼爲 key/value 格式（name1=value1&name2=value2…），而後把這個字串 append 到 url 後面，用 ? 分割，加載這個新的 url 發送到服務器（表單默認的提交數據的格式）。

當請求爲 post 時，瀏覽器把 form 數據封裝到 http body 中，而後發送到 server。（form 的 enctype 屬性爲編碼方式，經常使用有兩種：application/x-www-form-urlencoded 和 multipart/form-data，默認爲 application/x-www-form-urlencoded。

常見問題梳理

1 ContentType 不對應

簡單來講 ContentType 的做用是來約定請求方與接收方對於 HTTP 報文的處理位置，請求方關心傳遞參數，服務方關心接收參數。若是 ContentType 不一致，就是形成傳遞與接收參數的位置不對應，客戶端傳值正確，服務器端接收不到值的狀況。

如今你們都提倡使用 application/json，少數項目或者開發者仍是堅持使用 Content-Type: application/x-www-form-urlencoded

2 報文格式不許確

切記一行一組元素

看看頭部的格式

Post http://dev.com/api/v1/c/history/list HTTP/1.1
Content-Type: application/json
app-key: 562986529
time-stamp: 1553581026034
token: 9f3f7cd61ca7a4d24954c1bfc3e6ead7

token 雖然是字符串，可是沒有引號。key 冒號空格
報文的書寫有助於深刻理解 Http 報文原理。

開發案例 case

咱們以 PHP 語言爲例， 編程中請求接口主要使用的組件有 Curl，Zend，Guzzle 這三種。

Curl 請求

使用 Curl 請求，須要注意的依然是 x-www-form-urlencoded 下的參數傳遞問題

php curl 轉爲 x-www-form-urlencoded 方式的坑

網上轉變的方法基本都是寫添加下面這句：

curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-Type: application/x-www-form-urlencoded'));

但加上去後卻根本沒效果。

要想以 x-www-form-urlencoded 方式發送，最關鍵實際上是發送的數據格式。

Content-type from-data 時發送的數據用的是 array 格式，而 Content-type 爲 x-www-form-urlencoded 時須要用 key=value&key=value 的格式發送，發送的是 string 型的數據。

from-data 數據的爲：
​​​​​​$data = [
'name' => 'xiaoming',
'sex' => 1
];

x-www-form-urlencoded 時的數據則要變爲

$params_string = http_build_query($params);

不然

$params_json = json_encode($params);

guzzle 組件中的 content-type

組件官方文檔，請移步這裏 Guzzle, PHP HTTP 客戶端

x-www-form-urlencoded 請求

如何發送一個 application/x-www-form-urlencoded POST 請求.

json 請求

Guzzle 訪問實例初始化失敗

咱們看看另外一種異常

若是咱們的地址拼寫錯誤致使遠程接口不能解析，會出現什麼狀況？

/**
     * Post請求
     *
     * @return void
     */
    protected function post()
    {
        try {
            $this->request = $this->client->post($this->uri, ['form_params' => $this->params], $this->option);
        } catch (\GuzzleHttp\Exception\RequestException $e) {

            var_dump($error);
            die();
            Yii::warning($e);
        }
    }

2019-07-13 09:39:06 [127.0.0.1][-][-][warning][application] GuzzleHttp\Exception\ConnectException: cURL error 6: Could not resolve: xx.cn (Timeout while contacting DNS servers) (see http://curl.haxx.se/libcurl/c/libcurl-errors.html) in /Users/name/sources/vendor/guzzlehttp/guzzle/src/Handler/CurlFactory.php:185
Stack trace:

總結

本篇文章從 VS Code 下的擴展 REST Client 入手，經過對基本概念，優點和應用場景的介紹，結合 HTTP 請求中關於 Content-Type 的使用注意事項，對常見的接口調用問題進行了梳理。順便引出訪問接口一般使用的 Curl，Zend，Guzzle 三種組件。

REST Client 更多的使用場景和功能擴展，能夠參考官方文檔,發現更多好玩有用的功能。RestClient

文章已同步到公衆號《圖南日晟》歡迎關注