Tengo un div que se llena con el recuento de vistas de la página. Lo que quiero es hacer una solicitud a mi servidor para obtener el recuento de vistas y luego mostrarlo en la página. Sin embargo, dado que la página se carga antes de que responda la solicitud, el texto que se muestra es [Object Promise] . El código en mi etiqueta <script> es:
<script> document.getElementById("viewcount").innerHTML = await fetch("https://mywebsite.com/peripherals/viewcount") .then(function (response) { return response.json(); }).then(function (json) { return json.count }).catch(function (error) { console.log("Error: " + error); }); </script>¿Cómo puedo retrasar la representación del recuento de vistas hasta que se devuelva una respuesta?
el texto que se muestra es [Promesa de objeto]
Esto sucedería si no usara await .
Cuando agregue await , obtendrá un error, porque solo se puede usar (en el momento de la escritura) dentro de una función async , así que envuélvalo:
(async function () { document.getElementById("viewcount").innerHTML = await fetch(/* ...etc */); })(); Podrías usar await todo el camino:
(async function () { try { const response = await fetch("https://mywebsite.com/peripherals/viewcount"); const {count} = await response.json(); document.getElementById("viewcount").innerHTML = count; } catch (error) { console.log("Error: " + error); } })();