Estoy tratando de crear un objeto de documento con URL para configurarlo en un valor personalizado específico.
He explorado algunas de las opciones que se mencionan a continuación, pero no he podido hacerlo hasta ahora.
Un enfoque de ejemplo que probé con una explicación de dónde sale mal y qué quiero en su lugar:
//run context is the browser on page http://localhost // example URL value https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this const loadDocument = async (url: URL) => { // Fetching HTML from URL and parsing it into a document const docText = (await fetch(url)).text() const doc = new DOMParser().parseFromString(await fetchText(url.href), 'text/html') // the following will now be http://localhost, but I need it to be the URL the page is downloaded from // ie https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this console.log(doc.URL) // the consequence of it being wrong is that any links to external resources using relative paths // would be wrong as-well console.log(doc.querySelector('link[rel="stylesheet"]').href) // will be "http://localhost/static/css/main.1baf2b3e.chunk.css" // instead of "https://developer.mozilla.org/static/css/main.1baf2b3e.chunk.css" }Lo principal que estoy tratando de lograr aquí es tener las URL correctas en los recursos que usan enlaces relativos. Puedo intentar arreglar esto manualmente caminando sobre el DOM y cambiando las URL de cualquier cosa que use enlaces relativos a la URL original, pero eso parece propenso a errores. Por lo tanto, la esperanza de resolver el problema en la raíz con la configuración de la URL base correcta en el documento en su lugar
Otra cosa que intenté hacer es document.implementation.createHTMLDocument() que da como resultado un documento con about:blank como URL, y tampoco hay forma de configurarlo explícitamente =\
Intentar hacer una asignación a la propiedad URL tampoco parece hacer nada (y está marcado explícitamente como de solo lectura en la documentación)
Cuando consulta esas propiedades href, en realidad obtiene sus valores como rutas relativas que se evalúan en diferentes direcciones URL absolutas según el contexto en el que se ejecutan. Dado que sería una locura caminar por todo el dominio y cambiar eso, podría sugerir la oportunidad de inyectar un elemento html base que indique la ruta base a la que se asignará cualquier URL relativa. Podría resolver rápidamente su problema específico.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
El elemento HTML <base> especifica la URL base que se usará para todas las URL relativas en un documento. Solo puede haber un elemento <base> en un documento.
La condición debe ser que todas esas URL relativas se asignen a la misma URL base, por supuesto, pero eso se da por hecho si está capturando la página desde una URL de página de destino que funcione. Tenga en cuenta que existen algunas restricciones vinculadas a las políticas de CORS, especialmente si el js en esas páginas necesitará realizar consultas ajax en ese dominio. Lo que quiero decir es que esa solución no te da las claves de ningún escenario posible.
<base href="https://thereal.com/absolute/url"> Otra lectura interesante sobre la propiedad baseURI de MDN :
La propiedad baseURI de solo lectura de la interfaz Node devuelve la URL base absoluta del documento que contiene el nodo.
La URL base se utiliza para resolver URL relativas cuando el navegador necesita obtener una URL absoluta, por ejemplo, al procesar el atributo src del elemento HTML o los atributos xlink:href o href en SVG.
Aunque esta propiedad es de solo lectura, su valor lo determina un algoritmo cada vez que se accede a la propiedad y puede cambiar si cambian las condiciones.
La URL base se determina de la siguiente manera:
- De forma predeterminada, la URL base es la ubicación del documento (según lo determinado por window.location).
- Si es un documento HTML y hay un elemento
<base>en el documento, el valor href del primer elemento Base con tal
en su lugar se utiliza el atributo.