Я думаю что ни для кого не секрет что JavaScript не может напрямую работать с файловой системой. То есть, если у нас на сервере есть какой либо файл расширением txt, json и т. п. , то мы получить его содержимое с помощью php. Почему , да потому что файлы находятся на сервере, javaScript выполняется на стороне клиента в браузере.
К счастью обходные решения есть всегда. И этим решением являются ajax-запросы.
Допустим у нас есть файл entry.json где у нас некий объект
{
"response": {
"entry": {
"id": 1,
"name": "Грамматическая ошибка",
"directory": {
"id": 1,
"name": "Типы ошибок"
},
"items": [
{
"id": "name",
"name": "Наименование",
"type": "TEXT",
"value": "Грамматическая ошибка"
},
{
"id": "weight",
"name": "Тяжесть",
"type": "INTEGER",
"value": 1
},
{
"id": "point",
"name": "Балл",
"type": "FLOAT",
"value": 0.25
},
{
"id": "endDate",
"name": "Действует до",
"type": "DATE",
"value": "12.02.2015"
},
{
"id": "describe",
"name": "Описание",
"type": "TEXTAREA",
"value": "Описание ошибки"
},
{
"id": "units",
"name": "Единицы измерения",
"type": "SELECT",
"values": [
{
"id": 1,
"name": "Баллы",
"selected": true
},
{
"id": 2,
"name": "Минуты",
"selected": false
},
{
"id": 3,
"name": "Часы",
"selected": false
}
]
}
]
}
}
}и главная страница на которой мы хотим получить этот объект.
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<title>
Чтение страниц с помощью Ajax
</title>
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<h1>
Главная страница
</h1>
</body>
</html>Теперь давайте напишем для получения содержимого такой код:
var page;
req = new XMLHttpRequest(); //Ajax запрос на чистом js
req.open("GET", "entry.json", false); //Формируем get запрос и указываем страницу отправки
req.send(null);//Отправляем ajax запрос
if (req.status === 200) { //Проверяем исход если возвращается 200 запрос выполнен успешно, а если 0 то нет
page =req.responseText;//Получаем содержимое
}
console.log(JSON.parse(page));//Выводим что получили в консоль JSON.parse - преобразует строку в объектДля более разбалованных программистов мы можем написать подобное на jquery:
$.get('entry.json', function(data) {
console.log(data);
});Как видите мы смогли получить содержимое файла entry.json в виде объекта. И теперь с этим объектом мы можем делать все что угодно.
Отмечу что мы можем таким образом считывать любые файлы с сервера без php кода разумеется и если это не запрещено в .htaccess.
Например чтение текстового файла:
$.get('text.txt', function(data) {
console.log(data);
});И еще вот, не пытайтесь получить содержимое файлов с других доменов, так это запрещено. Вы можете получать содержимое страниц и файлов ,только в пределах домена где выполняете ajax-запрос. В качестве свидетельства вы можете перейти на какой нибудь сайт и в консоли выполнить наш ajax - запрос , попробуйте указать действительный адрес сайта с другим доменом и увы вы получите ошибку.
Но если вы в качестве адреса укажите другую страницу этого же сайта где выполняете в консоли ajax-запрос, вы без труда получите содержимое запрашиваемой страницы. Только не забывайте указывать протоколы сайтов http или https.
Используя данные знания также можно реализовать динамическую подгрузку страниц, то есть вы сможете переходить по страницам без перезагрузки, но это как говорится совершенно другая история и тема для еще одной статьи.
Я думаю суть данной статьи вы уловили и она была для вас полезна и содержательна. Я желаю вам удачи и поменьше кривого кода!
