В настоящий момент, из-за политики хромиума, нельзя подгружать локальные файлы через ajax без аргумента «--allow-file-access-from-files». Но мне в текущий момент требуется создать веб-приложение, где базой данных является xml-файл (в крайнем случае json), находящийся рядом с index.html. Подразумевается, что пользователь может запустить это приложение локально. Есть ли обходные пути для кроссбраузерного (ie11+) чтения xml-(json-) файла, без оборачивания его в функцию и переименования в формат js?
Итак, после старательного гуглежа, я решил проблему следующим образом:
<object data="file.xml">, в dom которого подгружается указанный в аргументах XML. З.Ы. в функции используется Promise — это ES 6, соответственно в эксплорере не работает, я использую Babel
Использование функции:
loadXMLFile('./file.xml').then(function(xml) {
// Тут что-то делаем с xml
// Он будет тут представлен в виде текстового xml, а не dom'а
});
Тело функции:
// Получение контента из файла -------------------------------------------------
function loadXMLFile(filename) {
return new Promise(function(resolve, reject) {
// Если мы имеем дело с IE, то работает с ActiveX-контентом
if('ActiveXObject' in window) {
// Получение xml-текста из файла для осла
var xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = false;
xmlDoc.load(filename);
resolve(xmlDoc.xml);
// Если мы работаем с нормальными браузерами,
// то создаём html-элемент <object> с xml
} else {
// Создаём элемент
var obj = createObject(filename);
if(obj == null) {
reject(['Object is not created']);
return;
}
obj.onload = function() {
if(this.contentDocument == null) {
// Объект с html-курсом не найден
reject(['XML-file is not found'])
return;
}
var tmp = document.createElement('div');
tmp.appendChild(this.contentDocument.children[0]);
resolve(tmp.innerHTML);
}
}
});
}
// Функция создания объекта с xml для нормальных браузеров ---------------------
function createObject(filename) {
// Вариант для остальных браузеров
var obj = document.createElement('object');
var attrs = {
id: 'xmlfile',
data: filename,
type: 'text/xml',
width: '1px',
height: '1px'
}
for (var i in attrs) {
obj.setAttribute(i, attrs[i]);
}
var param = document.createElement('param');
param.setAttribute('name', 'src');
param.setAttribute('value', filename);
obj.appendChild(param);
document.body.appendChild(obj);
return obj;
}
Продвижение своими сайтами как стратегия роста и независимости