介面測試平臺-90: 全域性請求頭之 多介面-介面庫選擇

按照前面成功把公共請求頭安裝進介面庫的方法，把其插入到多用例中。

開啟P_cases.html，直接找到這個header後面的html，給它加上倒三角按鈕。

注意上圖，因為要放在同一行，所以要縮短input的寬度 給留出空間。圖中的寬度 高度都是調過的，可以放心使用，效果如下：

然後去複製承載請求頭的那個div 放在下面：

雖然它現在是none的，看不到效果，繼續去開發即可。現在在下面js的那一堆上加一個script，專門用來寫公共請求頭的:

大家如果程式碼沒有太大的變化，可以對照左側的行標來確定位置。

 

現在可以知道，這個用例庫依然看不到任何請求頭，那是因後端函式並沒有給它返回這個請求頭資料，所以去views.py中去增加：

重啟服務，重新整理頁面，看看效果：

可以看到 ，點選了倒三角後，成功顯示出來了專案當前的倆個請求頭。

 

接下來要處理的是，在選擇/切換 頂層的 倉庫介面 的時候，下面請求頭能跟得上更新。

首先找到

這個ready樣子的，不用看，這就是監聽。監聽的什麼事件？就是下面寫的，id=apis的那個輸入框 的內容change改變就會觸發後面的那個funcitonn函式。

點選這個... ，開啟這個函式，在裡面加入公共請求頭相關的程式碼

 

1. 首先是這個函式中的初始化程式碼塊。遍歷並全部清空選擇。

var project_headers = document.getElementById('ts_project_header_li').children;
for (var i=0; i< project_headers.length; i++) {
    project_headers[i].children[0].checked = false;
}

2. 然後是按照返回值中的資料進行選中。

// 公共請求頭
var project_headers = ret.public_header.split(',');
for (var i=0; i<project_headers; i++) {
    try {
        document.getElementById('checkbox_' + project_headers[i]).checked = 'checked';
    } catch (e) { }
}

現在重新整理頁面 來測試一下：

首先是介面庫中這個介面 選中的請求頭如下：

去用例的步驟詳情頁，套用這個介面，會發現 選中了一樣的請求頭。

所以這裡成功搞定。

 

本節內容到此為止，下節要搞定多用例底層傳送請求的部分 嵌入這個公共請求頭哦。