MSW:可用于瀏覽器和測(cè)試的Mock服務(wù)

1、方式的Mock，在VUE中常用的有axios-mock-adapter，但是它對(duì)于API類型的支持不夠，如REST或者GraphQLAPI。

2、啟動(dòng)運(yùn)行：當(dāng)chrome console中打印了 [MSW] Mocking enabled，表示模擬生效；查看模擬的請(qǐng)求，會(huì)發(fā)現(xiàn)Status Code： 200 OK （from rvice worker）。如果network中沒有請(qǐng)求，請(qǐng)使用localhost域名訪問。

3、在項(xiàng)目中，通過Vite構(gòu)建Vue 3 + TypeScript項(xiàng)目，結(jié)合MSW和Faker實(shí)現(xiàn)接口模擬與數(shù)據(jù)偽造。MSW作為Service Worker，可以在瀏覽器中攔截網(wǎng)絡(luò)請(qǐng)求，而Faker則負(fù)責(zé)生成高質(zhì)量的測(cè)試數(shù)據(jù)，使得接口測(cè)試更加貼近環(huán)境?？偨Y(jié) 選擇Mock方的關(guān)鍵在于理解項(xiàng)目的具體需求與限制。

4、現(xiàn)代前端開發(fā)中，通常利用現(xiàn)有庫簡(jiǎn)化 Service Worker 的邏輯，如 Vue 項(xiàng)目中使用特定代碼實(shí)現(xiàn)。此外，Service Worker 還能用于實(shí)現(xiàn) MOCK 服務(wù)，例如 MSW 庫，它利用 Service Worker API 攔截實(shí)際請(qǐng)求，用于瀏覽器和測(cè)試場(chǎng)景。Service Worker 存儲(chǔ)的數(shù)據(jù)量因?yàn)g覽器和設(shè)備而異。