Как получить содержимое файла xml по урлу

[MC-XOBAHCK]

Зная урл-адрес файла с расширением xml можно ли получить его содержимое при помощи JavaScript (не на сервер Node.JS, а из браузера) ?

К какой технологии мне обратится чтобы получить содержимое из файла?

Пробую через XMLHttpRequest - консоль светит ошибкой на этот метод и кроме статуса ответа ничего нет.

Я вот так пробую:

var xhr = new XMLHttpRequest();
xhr.open("GET", urlxml, true);
xhr.onreadystatechange = function () {
    if (xhr.readyState == 4) {
        console.log('Подключился');
        console.log(xhr.responseText); // Пустой
    }
}
xhr.send();

Скрин с console.log(xhr) прилагаю

[Nexus]

Текст ошибки какой?

[j0hnik]

fetch('page.xml').then(data => data.text()).then(data => console.log(data));

но если у вас там Заголовок CORS 'Access-Control-Allow-Origin' отсутствует или подобное, то борода

[MC-XOBAHCK]

Текст ошибки какой?

Что то типа "браузер блокирует метод XMLHttpRequest..." (это в гугл хроме).

то борода

А нет никакого способа вытянуть данные из файла xml ?

Я пишу расширение для гугл-хрома. Из активной вкладки браузера получаю основной урл сайта и добавляю к нему нужный путь.
Пример запрашиваемого файла: https://www.joomla.org/language/en-GB/install.xml
Я там хочу вытянуть значение из тега version.
Никак нельзя получить это значение?

[j0hnik]

MC-XOBAHCK,

fetch('https://www.joomla.org/language/en-GB/install.xml').then(data => data.text()).then(data =>{
	console.log(document.createRange().createContextualFragment(data).querySelector('version').innerHTML);
});

если нужен только version и с документом больше работать не нужно, можно так

fetch('https://www.joomla.org/language/en-GB/install.xml').then(data => data.text()).then(data =>{
	console.log(data.match(/<version>(.+)<\/version>/)[1]);
});

[MC-XOBAHCK]

j0hnik,
получается в консоле ошибка:

Access to fetch at 'https://www.joomla.org/language/en-GB/install.xml' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

гугл транслит:

Доступ к выборке на 'https://www.joomla.org/language/en-GB/install.xml' из источника «null» был заблокирован политикой CORS: нет заголовка «Access-Control-Allow-Origin» на запрошенный ресурс. Если непрозрачный ответ отвечает вашим потребностям, установите режим запроса «no-cors» для извлечения ресурса с отключенным CORS.

Не знаете, это можно победить?

Ваш код вставил так как вы его привели, только урл подставил. Ставил и в расширение и просто в файл html. Никаких обёрток не делал.

Нашёл синтаксис https://learn.javascript.ru/fetch#sintaksis
Исправил так:

fetch('https://www.joomla.org/language/en-GB/install.xml'[, 'no-cors']).then(data => data.text()).then(data =>
                console.log(document.createRange().createContextualFragment(data).querySelector('version').innerHTML)
            );

В консоле ошибка:

Uncaught SyntaxError: Unexpected token ,

на запятую ругается. Может это в учебнике опечатка, где пример синтаксиса? Или я накосорезил?

[j0hnik]

MC-XOBAHCK,
зашел на https://www.joomla.org/
запустил в консоле код пятого поста, работает и тот и другой

[, 'no-cors'] - лишнее

[MC-XOBAHCK]

j0hnik,
Спасибо вам за помощь. Не получается у меня. В консоле там на сайте да, отрабатывает и показывает версию.

Из моего расширения для браузера гугл-хром или из хтмл файла на локалке - не хочет. Всё туже ошибку с CORS policy даёт. Похоже нельзя вытянуть это значение внешним скриптом - безопасность.

В расширении для гугл-хрома я ваш код поместил внутри:

document.addEventListener('DOMContentLoaded', () => {

    chrome.tabs.getSelected(null, function (tab) {
        // здесь код поставил
    });

});

Это иконка в меню гугл-хрома при клике по которой появляется всплывающее окно.
Буду рыться в API гугловских, может где из другого места можно получить это значение. Но подозреваю что они заблочили такие возможности.

[Aetae]

Во первых попробуй запрос из background скрипта, вроде там ограничений нет.
Во вторых попробуй поставить permission на <all_urls>.

Вот микрорасширение, показывающее отсутствие принципиальных проблем. При заходе на www.joomla.org пишет версию в консоль.

Пример: manifest.json

{
  "name": "joomla",
  "version": "1",
  "manifest_version": 2,
  "content_scripts": [
    {
      "matches": ["*://*.joomla.org/*"],
      "js": ["content.js"]
    }
  ]
}

Пример: content.js

const xhr = new XMLHttpRequest();
xhr.open("GET", 'https://www.joomla.org/language/en-GB/install.xml', true);
xhr.onload = () => console.log(
	'Версия',
	xhr.responseXML.querySelector('version').textContent
); 
xhr.send();

[MC-XOBAHCK]

Aetae,
Спасибо! Так работает. Я начал искать и неправильно в манифесте скрипт подключил:

"background": {
    "scripts": ["background.js"],
    "persistent": false
  }

Думаю теперь смогу доработать скрипт как мне нужно.

Пользуясь случаем, не подскажете как в манифесте подключить скрипт для контекстного меню в браузере? Я в документации нашёл как создавать пункты меню и привязывать к ним функции (там куча методов я ознакамливаюсь), но там нет из какого скрипта запускать. Я куда не пробовал всунуть, у меня заработало только в popup, но это не то, так как пункт появляется в меню только после клика по иконке расширения в меню хрома.

Смотрю https://developer.chrome.com/extensions/manifest и ничерта не вижу. Наверное пора спать...