Estoy tratando de crear un trabajador web que almacene el token de acceso y maneje las llamadas a la API. Lo primero que quiero hacer es obtener una solicitud del trabajador web para obtener el token de acceso.
El usuario utiliza cookies; httpOnly y SameSite están activados, aún no son seguros porque lo estoy ejecutando localmente en http. Estas cookies es donde se almacenan los tokens o identidades de los tokens.
Tengo un punto final en mi API, al que quiero dirigirme para obtener el token de acceso. Entonces puedo abordar los recursos necesarios con esto. El token permanece en el trabajador web y no está expuesto.
Tengo un trabajador web (en cadena base64) de ese trabajador web. Quiero llegar al punto final para obtener el token de acceso. Hago esto con fetch. Sin embargo, cuando quiero enviar credenciales. El CORS no se puede establecer en '*'. Puedo especificar la url de mi sitio web (en este caso localhost) como origen en el servidor.
Dentro de mi trabajador web:
const tryFetch = await fetch(authUrl, { credentials: "include", });Sin embargo, parece que el origen pasado al servidor es 'nulo'. ¿Hay alguna manera de arreglar esto o estoy intentando algo mal?
Access to fetch at 'http://localhost:3000/api/auth' from origin 'null' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'http://localhost:3000' that is not equal to the supplied origin. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.data: direcciones URL para trabajadores se consideran orígenes opacos ( especificaciones ). Esto significa que el origen de su Trabajador se establecerá en null .
Para eludir eso, si realmente necesita crear su secuencia de comandos Worker dinámicamente (en lugar de usar un archivo estático), puede usar un blob: URL, que compartirá el origen del contexto donde se creó la URL.
const content = ` // your worker script content `; const getWorkerURL = () => { return URL.createObjectURL(new Blob([content], {type: "text/javascript"})); }; const worker = new Worker(getWorkerURL());Ejemplo en vivo como codepen , porque los iframes de StackSnippets tienen un origen nulo de todos modos.
Sin embargo, tenga en cuenta que aunque Worker comparte el mismo origen, su baseURI será diferente, por lo que debe manejar de manera especial las URL relativas .