En Firefox y Safari, los encabezados personalizados no envían solicitudes de búsqueda dentro de un trabajador de servicio. Pero el cromo funciona. (Agregué mi encabezado personalizado en Access-Control-Allow-Headers )
Código dentro del trabajador de servicio:
fetch(Request, { headers: { 'my-custom-header': 'a value' } });Mis OPCIONES devuelven 204 y el modo de solicitud es 'cors'. También es una solicitud del mismo origen.
(Para solicitudes del mismo origen, CORS no entra en juego).
No puedo reproducir el problema que describe; aquí hay una implementación en vivo de un sitio con un trabajador de servicio que realiza una solicitud al punto final https://httpbin.org/#/Request_inspection/get_headers cuando se inicia, y registra la respuesta, indicando qué encabezados de solicitud se recibieron:
fetch('https://httpbin.org/headers', { headers: {'my-custom-header': 'a value'}, }) .then((response) => response.json()) .then((data) => console.log(data.headers));En Chrome, Firefox y Safari, veo que se devuelve el encabezado personalizado junto con los demás encabezados que el navegador envía de manera predeterminada.
Puedes jugar con esto y probar diferentes escenarios remezclando https://glitch.com/edit/#!/valuable-nonchalant-pet?path=sw.js%3A3%3A81
Me di cuenta de mi error. Estaba pasando el objeto Solicitud en lugar de la URL. Así que debería haber hecho esto como a continuación:
const request = new Request(event.request); request.headers.append('my-custom-header', 'a value'); return fetch(request);