Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

151
Visualizações
Generate HTTP response from raw file data in JavaScript

I need to be able to take the raw data from any file and generate a response object within a service worker.

Short explanation:

I have a website that takes file names, paths, mime types and raw text and stores it in cache. If I make a request to a file with that path and name, a service worker responds with that raw data.

Here is the very basic service worker response code:

self.addEventListener("fetch", async event =>
    event.respondWith(caches.match(event.request))
);

This system works fine for HTML, CSS, JS and probably other files, but not for PNGs. I keep getting the image not found image:

enter image description here

I have checked that the correct mime type is being sent and the correct data is stored in cache. I have tried putting the data in cache with the text I find in notepad after opening the PNG, and the text result of a fetch request to an actual PNG file, using the .text() method.

Here are partial images of both:

Notepad++:

enter image desstrong textcription here

Fetch:

enter image description here

This data in the images is put into cache with this code:

cache.put(
    rawFileText,

    new Response(
        "filePath/example.html",
        {
            status: 200,
            headers: new Headers({
                "content-type": "image/png" + "; charset=utf-8",
            }),
        },
    ),
);

More background info:

This is for a web code editor I am working on. When I want to run code in the editor:

  1. website1 will create an iframe with website2 as source
  2. website1 post messages all the file names, paths, mime types and raw text containing code, images, etc. (by raw data I mean whatever you would see if you opened the file with notepad)
  3. then the iframe (website2) stores the file names and data as cache
  4. when a request is made to any file stored in website2's cache, the service worker
  5. responds with whatever data is under the file name

The reason I use 2 different websites is to avoid conflicts with the editor website's files, local storage, and everything else. There could still be conflict with the second website's cache and service worker but that isn't a problem in my case.

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda