本文中含有需要您注意的重要提示信息,忽略該信息可能對您的業務造成影響,請務必仔細閱讀。
在前端監控中,即便已知API的請求耗時,也無從知曉準確的網絡傳輸性能、后端服務的調用鏈路及性能,因而無法快速準確地排查應用API問題。前后端鏈路追蹤功能可以解決此類問題,它會將API請求從前端發出到后端調用的鏈路串聯起來,真實還原代碼執行的完整現場。
前提條件
您已經開通ARMS前端監控和ARMS應用監控,請參見開通ARMS。阿里云ARMS應用監控需要2.4.5或更高版本,關于其配置,請參見什么是應用監控。
背景信息
應用監控可提供API在后端的處理性能及調用鏈路,但這些數據未必能準確反映用戶的真實體驗。前端監控只能監控到API從發送到返回的整體耗時及狀態,無法提供后端服務的調用鏈路及性能數據。在這種情況下,前后端鏈路追蹤功能可將前端與后端串聯起來,給您一站式的問題排查體驗。
配置ARMS前端監控
API與當前應用域名同源
確認前端站點和應用之間是否存在對應關系。
不關閉API自動上報,允許API自動上報。
配置enableLinkTrace為
true
,允許前后端鏈路追蹤。具體配置為:<script> !(function(c,b,d,a){c[a]||(c[a]={});c[a].config={pid:"xxx",imgUrl:"https://arms-retcode.aliyuncs.com/r.png?", enableLinkTrace: true}; with(b)with(body)with(insertBefore(createElement("script"),firstChild))setAttribute("crossorigin","",src=d) })(window,document,"https://retcode.alicdn.com/retcode/bl.js","__bl"); </script>
API與當前應用域名非同源
確認前端站點和應用之間是否存在對應關系。
配置enableLinkTrace和enableApiCors為
true
。<script> !(function(c,b,d,a){c[a]||(c[a]={});c[a].config={pid:"xxx",imgUrl:"https://arms-retcode.aliyuncs.com/r.png?", enableLinkTrace: true, enableApiCors: true}; with(b)with(body)with(insertBefore(createElement("script"),firstChild))setAttribute("crossorigin","",src=d) })(window,document,"https://retcode.alicdn.com/retcode/bl.js","__bl"); </script>
重要配置enableApiCors為
true
,后端服務也需要支持跨域請求及自定義header值,請確認所有請求都配合聯調正常,否則會出現請求失敗的問題。Nginx配置參考如下:upstream test { server 192.168.220.123:9099; server 192.168.220.123:58080; } server { listen 5800; server_name 192.168.220.123; root /usr/share/nginx/html; include /etc/nginx/default.d/*.conf; location / { proxy_pass http://test; proxy_set_header Host $host:$server_port; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Real-PORT $remote_port; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header EagleEye-TraceID $eagleeye_traceid; proxy_set_header EagleEye-SessionID $eagleEye_sessionid; proxy_set_header EagleEye-pAppName $eagleeye_pappname; }
配置ignore,請參見ignore。 具體配置為:
let whitelist = [‘api.xxx’,’source3’]; // 白名單。 let blacklist = [‘source2’,’source6’]; // 黑名單。 // 可根據需求,選擇黑白名單(在方法中return true或者false去控制)。 ignore: { ignoreApis: [ function(str) { // 方法。 if (whitelist.includes(str)) { return false; } return true; // 返回true則忽略。 }] }
說明ignore類似于黑白名單,可以避免部分第三方資源請求的header值被修改,從而防止資源請求出現錯誤。
工作原理
在允許API自動上報的前提下,如果API與當前應用的域名同源,則會在API請求頭(Request Header)加入兩個自定義Header:EagleEye-TraceID和EagleEye-SessionID。EagleEye-TraceID即串聯前后端鏈路的標識。
如果API與當前應用的域名不同源,則不會在請求頭添加自定義Header,以保證應用請求可以正常發送。
如需驗證前后端鏈路追蹤配置是否生效,可以打開控制臺查看對應API請求的Request Headers中是否有EagleEye-TraceID和EagleEye-SessionID這兩個標識。
警告EagleEye-TraceID和EagleEye-SessionID的值有相應的含義,請勿自行生成。
使用場景和案例
通過調用的時間軸,可以知道是網絡傳輸還是后端調用導致請求耗時過長,同時單擊后端應用中的方法棧,可以看到本次請求后端的完整調用鏈路。從而根據業務定位是什么原因導致API錯誤:
當API返回錯誤碼或者業務邏輯錯誤時,定位問題操作如下:
- 登錄ARMS控制臺,在左側導航欄選擇 。
- 在前端列表頁面頂部選擇目標地域,然后單擊目標應用名稱。
在左側導航欄單擊API請求。
在右側的API鏈路追蹤(TOP 20)區域的API失敗列表中,找到相關的API或TraceID,并單擊右側的鏈路追蹤,以查看前端監控的整體耗時和后端應用的調用時序圖。
根據調用的時間軸判斷,耗時長的是網絡傳輸還是后端調用。
對后端應用單擊方法棧列中的放大鏡圖標,可以查看本次請求的完整后端調用鏈,并根據業務定位導致API錯誤的原因。
當API耗時較長時,定位問題操作如下:
- 登錄ARMS控制臺,在左側導航欄選擇 。
- 在前端列表頁面頂部選擇目標地域,然后單擊目標應用名稱。
在左側導航欄單擊API請求。
在右側的API鏈路追蹤(TOP20)區域中,按照請求耗時對API進行降序排列,找到耗時較長的API或者TraceID。
單擊右側的鏈路追蹤鏈接,以查看前端監控的整體耗時和后端應用的調用時序圖。
如果后端應用處理時間較短,而整體耗時較長,則說明API請求從發送到服務端以及從服務端返回數據到瀏覽器端的網絡傳輸耗時較長。此時可以單擊訪問明細,并在查看詳情頁面上查看本次訪問的網絡、地域、瀏覽器、設備、操作系統等信息。
如果后端應用處理時間較長,則說明后端處理的性能較差。此時可以單擊方法棧欄中的放大鏡圖標,并在本地方法棧對話框中查看后端鏈路上哪部分內容耗時較長,繼而定位問題。