WebGPU指紋概述
WebGPU是下一代的Web圖形和計算API,旨在提供高性能的圖形渲染和計算能力。它是WebGL的后繼者,旨在利用現代GPU的強大功能,使得Web應用能夠實現接近原生應用的圖形和計算性能。而且它是一個低級別的API,可以直接與GPU通信,從而進行圖形渲染和并行計算。
WebGPU指紋信息是通過WebGPU API獲取的一些硬件和驅動程序信息,這些信息包括GPU的名稱、供應商、驅動程序版本、支持的功能和限制等。在前端的JavaScript中主要依賴以下接口:
1.requestAdapter
WebGPU提供了一個GPUAdapter對象,它包含了有關GPU適配器的詳細信息。獲取這個對象需要調用navigator.gpu.requestAdapter。以下是 GPUAdapter 的詳細介紹,包括 features 和 limits 等屬性:
- features: GPUSupportedFeatures。
- limits: GPUSupportedLimits。
- isFallbackAdapter: boolean。
- requestDevice: 用于請求一個 GPUDevice 對象,該對象代表實際的 GPU 設備,可以用于提交命令和管理 GPU 資源。
features 是一個 GPUSupportedFeatures 對象,表示該 GPU 適配器支持的一組特性。它是一個集合,包含了一些字符串,每個字符串代表一個特性。可以通過遍歷 features 集合來檢查 GPU 支持的特性。使用JavaScript代碼獲取示例如下:
const adapter = await navigator.gpu.requestAdapter();const supportedFeatures = adapter.features;supportedFeatures.forEach(feature => {console.log(`Supported feature: ${feature}`);});
常見的特性包括:
- texture-compression-bc: 支持 BC (Block Compression) 紋理壓縮格式。
- timestamp-query: 支持時間戳查詢,用于測量 GPU 命令的執行時間。
- indirect-first-instance: 支持間接繪制的第一個實例。
limits 是一個 GPUSupportedLimits 對象,表示 GPU 適配器的硬件限制。這些限制決定了可以使用的資源和配置的最大值。例如:
- maxTextureDimension1D: 1D 紋理的最大尺寸。
- maxTextureDimension2D: 2D 紋理的最大尺寸。
- maxTextureDimension3D: 3D 紋理的最大尺寸。
- maxTextureArrayLayers: 紋理數組的最大層數。
isFallbackAdapter 是一個布爾值,表示當前的 GPUAdapter 是否為后備適配器。如果找不到高性能適配器,WebGPU 會返回一個功能受限的后備適配器。具體代碼如下:
const isFallback = adapter.isFallbackAdapter;console.log(`Is fallback adapter: ${isFallback}`);
2.requestAdapterInfo
requestAdapterInfo 是 WebGPU API 中的一個函數,它用于獲取有關 GPU 適配器的詳細信息。該函數返回一個 Promise,解析為一個包含適配器信息的對象。這個對象提供了更詳細的 GPU 適配器信息,比直接訪問 GPUAdapter 對象的屬性要更為全面。具體代碼如下:
async function getDetailedGPUInfo() {try {const adapter = await navigator.gpu.requestAdapter();if (!adapter) {console.log('No GPU adapter found');return;}const adapterInfo = await adapter.requestAdapterInfo();console.log('Detailed GPU Adapter Info:', adapterInfo);} catch (error) {console.error('Error getting detailed GPU info:', error);}}getDetailedGPUInfo();
requestAdapterInfo 返回一個包含適配器詳細信息的對象。以下是這些信息的詳細說明:
- vendor: GPU 供應商的標識符。例如,Intel 的 ID 通常是 8086,NVIDIA 的 ID 是 10DE,AMD 的 ID 是 1002。
- architecture: GPU 架構的名稱,例如“Turing”, “Pascal”等。這有助于了解 GPU 的性能和功能特性。
- description: 對 GPU 適配器的描述,通常包括 GPU 的型號和名稱,例如 “NVIDIA GeForce GTX 1050”。
- device: GPU 設備的標識符,這是一個獨特的 ID,用于標識特定的 GPU 設備。
WebGPU指紋獲取
生成WebGPU指紋,可以通過上述所講的JavaScript函數來獲取詳細的GPU信息,并將這些信息組合成一個唯一的標識符。以下是一個完整的示例代碼,它展示了如何獲取所有相關信息,并生成 WebGPU 指紋:
async function getWebGPUFingerprint() {try {// 請求 GPU 適配器const adapter = await navigator.gpu.requestAdapter();if (!adapter) {console.log('No GPU adapter found');return;}// 請求詳細的適配器信息const adapterInfo = await adapter.requestAdapterInfo();// 獲取適配器的基本信息const basicInfo = {name: adapter.name,features: [...adapter.features.values()],limits: adapter.limits,isFallbackAdapter: adapter.isFallbackAdapter};// 獲取適配器的詳細信息const detailedInfo = {vendor: adapterInfo.vendor,architecture: adapterInfo.architecture,description: adapterInfo.description,driverVersion: adapterInfo.driverVersion,device: adapterInfo.device};// 組合所有信息生成指紋const fingerprint = {basicInfo,detailedInfo};console.log('WebGPU Fingerprint:', fingerprint);return fingerprint;} catch (error) {console.error('Error getting GPU info:', error);}}// 調用函數獲取 WebGPU 指紋getWebGPUFingerprint();
將上述代碼在瀏覽器的控制臺中運行,即可得到完整的WebGPU指紋信息,如圖4-9所示:
WebGPU指紋修改
從上述指紋信息的獲取可以得知,WebGPU相關信息是通過adapter接口來獲取的,與修改requestAdapter中的信息相比,requestAdapterInfo可以得到更加具體的信息,涉及GPU的廠商、架構、設備和描述等信息。因此,本書的WebGPU指紋修改選擇修改這里的具體信息,而且為了防止修改之后影響WebGPU的運行,選擇對重要性不太高的描述信息進行定制修改。
修改WebGPU指紋信息,需要到“src/third_party/blink/renderer/modules/webgpu”目錄之下,這里選擇了gpu_adapter_info.cc文件作為修改文件,以下是requestAdapterInfo的源碼:
GPUAdapterInfo::GPUAdapterInfo(const String& vendor,const String& architecture,const String& device,const String& description,const String& driver): vendor_(vendor),architecture_(architecture),device_(device),description_(description),driver_(driver){}
可以看出,requestAdapterInfo在Chromium中進行初始化構造的時候就會完成這些信息的賦值,因此可以在構造函數之中對這些值進行定制替換,即可完成指紋修改:
std::string my_des?= *(json_reader->GetDict().FindDouble("webaudio"));description_ = String(my_des);
默認情況下,Chromium瀏覽器的WebGPU可能處于被禁止狀態,因此可以額外添加以下命令行參數來啟動WebGPU:
chrome.exe --enable-unsafe-webgpu
如圖4-10所示,傳遞任意字符串定制WebGPU的描述信息之后,可以到BrowserScan網站查看指紋信息,可以發現WebGPU指紋已經發生了改變: