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

237
Visualizações
el detector de eventos onload no se invoca después de esperar en una función asíncrona

Mi código carga un archivo JSON que luego se usa en una función llamada serverTest .

Así que tengo este código:

 async function fetchJSON(url) { const response = await fetch(url, { headers: { accept: "application/json" } }); return response.json(); } const config = await fetchJSON("./config.json"); window.addEventListener("load", function() { serverTest(0); }); const serverList = new Map(Object.entries(config.servers)); function serverTest(index) { // code including serverList }

El problema es que el controlador de eventos de carga no se ejecuta.

¿Alguien me puede ayudar?

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

El problema es que al retrasar la configuración del controlador de eventos hasta que se carga el JSON, se está perdiendo el evento de load .

En la gran mayoría de los casos de uso (pero de los comentarios, no de los suyos), simplemente elimine el controlador de eventos por completo:

 async function fetchJSON (url) { const response = await fetch(url, { headers: { accept: "application/json" } }); if (!response.ok) { throw new Error(`HTTP error ${response.status}`); } return response.json(); } const config = await fetchJSON("./config.json"); serverTest(0); // <==== Not wrapped in a `load` event handler const serverList = new Map(Object.entries(config.servers)); function serverTest(index) { //Code including serverList }

Si se asegura de que su etiqueta de secuencia de script use type="module" (lo que debe hacer la suya, si está usando una await de nivel superior como esa), no se ejecutará hasta que la página HTML esté completamente cargada y el DOM haya sido construido. (A menos que también tenga el atributo async ; detalles ).

En su caso de uso, esperar el evento de load realmente tiene sentido, por lo que tendrá que esperar hasta que finalicen la load y la fetch :

 async function fetchJSON (url) { const response = await fetch(url, { headers: { accept: "application/json" } }); if (!response.ok) { throw new Error(`HTTP error ${response.status}`); } return response.json(); } // Hook up the `load` event *before* loading `config.json`, // get a promise for when it fires const loadPromise = new Promise(resolve => { window.addEventListener("load", resolve); }); // Load and wait for `config.json` const config = await fetchJSON("./config.json"); // Wait for the `load` event (waits only ***very*** briefly // if the event has already fired, otherwise waits for it // to fire) await loadPromise(); serverTest(0); const serverList = new Map(Object.entries(config.servers)); function serverTest(index) { //Code including serverList }

Nota al margen: tenga en cuenta que agregué un cheque para ok antes de llamar a json . fetch solo rechaza su promesa sobre errores de red , no sobre errores de HTTP. Esto es (en mi humilde opinión) una pistola en la API de fetch que cubro en mi antiguo blog anémico aquí .

about 4 years ago · Juan Pablo Isaza Relatório
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