Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

190
Vistas
How to get parameters sent through JS POST request in Service Worker fetch method

I'm pretty new in the all "Service Worker" thing (yeah I know, almost 2022 and I just get into it).

I'm trying to use it to cache some requests'responses, but as you probably know it can't cache a POST request.

Knowing this, I'll cache it in an other way but I want to be sure I have to cache it, and for this I need to know what is the value of the "data" parameter of the jQuery.ajax() method used in the origine of the fetch triggering.

I actually can't figure out how to retrieve the data parameter with the event object, nor the event.request one. So far I was able to do this :

self.addEventListener('fetch', function(event) {
  const requestUrl = new URL(event.request.url);

  event.respondWith(
    caches.match(event.request)
    .then(function(response) {
        if(response) { console.log('return cache '+requestUrl.href); return response; }
        
        console.log('return classic + save');
        return fetch(event.request).then(function(response) {
            if(!response || response === undefined || response.status === undefined || response.status !== 200 || response.type !== 'basic') { return response; }
            
            var respToCache = response.clone();
            
            caches.open('thiscache').then(function(cache) {
                console.log('cache opened, saving...');
                cache.put(event.request, respToCache)
                .then()
                .catch(function(error) {
                    console.log('catcherror: '+error);
                    
                    if(event.request !== undefined && event.request.method !== undefined && event.request.method == 'POST') {
                        // Here, I need to get the 'data' parameter from the jQuery.ajax() method in the origin of the fetch
                    }
                })
            })
            .catch(function(error) {
                console.log('Error ! '+error);
            })
            
            return response;
        })
    })
  );
});

I can't find the right method to retrieve this data; thank you for your help and any tip you could have.

Edit:

For information, here's an example of a jQuery.ajax() that triggers the service worker's fetch :

jQuery.ajax({
    url: './ajax.php',
    type: 'POST',
    dataType: 'html',
    xhrFields: { withCredentials: true },
    data: 'param1=value1&param2=value2...', // <-- this is what I want to get
    success: function(reponse, statut) { ... }
});
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Found it ! To perform that, you have to .formData() the event.request (a clone of it actually), that will give you all the parameters and their values contain in the data parameter.

self.addEventListener('fetch', function(event) {
  var requestClone = event.request.clone();

  event.respondWith(
    caches.match(event.request)
    .then(function(response) {
        if(response) { console.log('return cache '+requestUrl.href); return response; }
        
        console.log('return classic + save');
        return fetch(event.request).then(function(response) {
            if(!response || response === undefined || response.status === undefined || response.status !== 200 || response.type !== 'basic') { return response; }
            
            var respToCache = response.clone();
            
            caches.open('thiscache').then(function(cache) {
                console.log('cache opened, saving...');
                cache.put(event.request, respToCache)
                .then()
                .catch(function(error) {
                    console.log('catcherror: '+error);
                    
                    if(event.request !== undefined && event.request.method !== undefined && event.request.method == 'POST') {
                        requestClone.formData().then(formData => {
                          // Do whatever you want with formData, parameters are here :)
                        }
                    }
                })
            })
            .catch(function(error) {
                console.log('Error ! '+error);
            })
            
            return response;
        })
    })
  );
});
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda