Как использовать служебных работников в расширениях Google Chrome для изменения тела ответа HTTP?

Question

Теперь, когда расширения Google Chrome могут register Service Workers, как я могу их использовать для изменения ответов HTTP со всех хостов, например. путем замены всех вхождений cat на dog?

Ниже приведен пример кода от Craig Russell, но как его использовать в расширениях Chrome и привязать его ко всем хостам?

self.addEventListener('fetch', function(event) { 
    event.respondWith(
     fetch(event.request).then(function(response) { 
      var init = { 
       status:  response.status, 
       statusText: response.statusText, 
       headers: {'X-Foo': 'My Custom Header'} 
      }; 
      response.headers.forEach(function(v,k) { 
       init.headers[k] = v; 
      }); 
      return response.text().then(function(body) { 
       return new Response(body.replace(/cat/g, 'dog'), init); 
      }); 
     }) 
    ); 
}); 

Answer 1

Решение

<manifest.json>:

{"manifest_version":2,"name":"","version":"0","background":{"scripts":["asd"]}} 

<ASD>:

navigator.serviceWorker.register('sdf.js').then(x=>console.log('done', x)) 

<sdf.js>:

addEventListener('fetch', e=> e.respondWith(fetch/*btw xhr is undefined*/(e.request).then(r=>{ 
    if(r.headers === undefined /*request not end with <.htm>, <.html>*/){}else{ 
    console.assert(r.headers.get('content-type')===null)/*for some odd reason this is empty*///[ 
     let h = new Headers() 
     r.headers.forEach((v,k)=>h.append(k,v)) 
     Object.defineProperty(r,'headers',{'writable':true}) 
     r.headers = h 
     r.headers.append('content-type','text/html'/*btw <htm> doesnt work*/) 
    //] 
    } 
    return r.text().then(_=>new Response(_.replace(/cat/g,'dog'),r)) 
}))) 

Перейти к ≪ URL страницы ≫ (≪ хром-расширение: // ≪ доб ID ≫/≪ страница путь ≫ ≫) и видят замену.

---

Автономный ответ

<manifest.json> и <ASD> же, как и выше.

<sdf.js>:

addEventListener('fetch', e=> e.respondWith(new Response('url: '+e.request.url,{headers:{'content-type':'text/html'/*, etc*/}}))) 

---

Btw

Serviceworker есть и другие события, которые могут быть вникал, например:

addEventListener('message', e=>{ 
    console.log('onmessage', e) 
}) 
addEventListener('activate', e=>{ 
    console.log('onactivate', e) 
}) 
addEventListener('install', e=>{ 
    console.log('oninstall', e) 
}) 

---

Альтернатива

Обратите внимание, что в настоящее время serviceworker [– сравните webNavigation, WebRequest] является единственным способом сделать это, потому что некоторые ламеры в команде разработчиков Google решили, что его «небезопасный» для ответа модифицирующего webNavigation и WebRequest.

---

Примечание

Chrome ошибки:

• Удлинители <Reload> не перезагружается serviceworkers. Вам необходимо удалить расширение и загрузить его обратно.
• Обновление страницы не обновляется, даже с chrome devtools отключить кеш hard reload. Используйте обычный просмотр страницы.