me sale este error de
<script lang="ts"> import { onMount } from "svelte"; const xhr = new XMLHttpRequest(); let url = ""; onMount(() => url = window.location.href.substr(31)); //get query xhr.open("GET", url); xhr.onload = () => { let resp = xhr.response; } xhr.send(); </script> {resp}
el error es
ReferenceError: XMLHttpRequest no está definido
Estoy usando svelte, y todas las preguntas sobre este error son sobre el código backend node.js.
en primer lugar, ¿por qué no está utilizando fetch
en lugar de XMLHttpRequest
?
En segundo lugar, XMLHttpRequest
no está disponible en el nodo , por lo que esta es probablemente la razón por la que obtiene este error.
Según la documentación, todas las llamadas externas deben realizarse en onMount
hook. Gracias a esto, tales llamadas se ejecutarán solo en el lado del cliente (donde está disponible XMLHttpRequest
).
Además, la variable resp
solo está disponible dentro del controlador onLoad
, por lo que no es posible representarla actualmente en su código. Así que probablemente debería verse así:
<script lang="ts"> import { onMount } from "svelte"; let resp = 'Loading...' onMount(() => { const url = window.location.href.substr(31); //get query const xhr = new XMLHttpRequest(); xhr.open("GET", url); xhr.onload = () => { resp = xhr.response; } xhr.send(); }); </script> {resp}
Pero recomiendo refactorizar y usar fetch. Al final, podría ser más elegante trabajar con parámetros de consulta como los siguientes:
let url = ''; const href = new URL(window.location.href); const params = new URLSearchParams(url.search); if (params.has('paramName')) { url = params.get('paramName') }
Mateusz
Es posible que deba ajustar su tsconfig.json
y asegurarse de que se haya agregado "dom"
a la opción lib
. Si por algún motivo no se incluye la biblioteca de tipos DOM , el tipo faltará, lo que provocará errores al usar TypeScript.