Как получить данные с JavaScript с другого сервера?
Как я могу сделать запросы на другие серверы (например, получить страницу с любого сервера) с помощью JavaScript в браузере пользователя? Существуют ли ограничения для предотвращения таких методов, как XMLHttpRequest, есть способы обойти их или другие методы?
Это общий вопрос, в частности, я хочу проверить серию случайных веб-сайтов и посмотреть, содержит ли они определенный элемент, поэтому мне нужен HTML-контент на веб-сайте без загрузки каких-либо дополнительных файлов; все это в файле JavaScript, без механизма пересылки или прокси на сервере.
(Примечание: в одном случае используется Greasemonkey и его GM_xmlhttpRequest.)
Ответы
Ответ 1
Вы должны проверить JQuery. Он имеет богатую базу функций AJAX, которая может дать вам возможность сделать все это. Вы можете загрузить внешнюю страницу и проанализировать ее HTML-содержимое с помощью интуитивно понятных CSS-подобных селекторов.
Пример использования $.get();
$.get("anotherPage.html", {}, function(results){
alert(results); // will show the HTML from anotherPage.html
alert($(results).find("div.scores").html()); // show "scores" div in results
});
Для внешних доменов мне пришлось написать локальный PHP-скрипт, который будет действовать как посредник. jQuery будет вызывать локальный PHP-скрипт, передающий URL-адрес другого сервера, в качестве аргумента, локальный PHP-скрипт будет собирать данные, а jQuery будет считывать данные из локального PHP-скрипта.
$.get("middleman.php", {"site":"http://www.google.com"}, function(results){
alert(results); // middleman gives Google HTML to jQuery
});
Давать middleman.php что-то вроде
<?php
// Do not use as-is, this is only an example.
// $_GET["site"] set by jQuery as "http://www.google.com"
print file_get_contents($_GET["site"]);
?>
Ответ 2
Запишите прокси-сервер script, который отправляется по запросу http из вашего домена, это обходит ограничения XMLHttpRequest.
Если вы используете PHP, просто используйте cURL для запроса и чтения страницы, а затем просто выплюните html, как если бы он был из вашего домена.
Ответ 3
Это довольно легко... если вы знаете "секретный" трюк, почти никто не делится.
Он назвал Yahoo yql...
Итак, чтобы восстановить "власть для пользователя" (и вернуться к удобной мантре: "никогда не принимать нет" ), просто используйте http://query.yahooapis.com/ (вместо php? proxy serverside script).
jQuery не будет строго необходим.
ПРИМЕР 1:
Используя SQL-подобную команду:
select * from html
where url="http://stackoverflow.com"
and xpath='//div/h3/a'
Следующая ссылка очистит SO для самых новых вопросов (минуя кросс-доменную безопасность быка $#! 7):
http://query.yahooapis.com/v1/public/yql?q=select%20title%20from%20html%20where%20url%3D%22http%3A%2F%2Fstackoverflow.com%22%20and%0A%20%20%20%20%20%20xpath%3D%27%2F%2Fdiv%2Fh3%2Fa%27%0A%20%20%20%20&format=json&callback=cbfunc
Как вы можете видеть, это вернет массив JSON (также можно выбрать xml) и вызовет функцию обратного вызова: cbfunc
.
В самом деле, в качестве "бонуса" вы также сохраняете котенка каждый раз, когда вам не нужны данные регулярных выражений из "tag-soup".
Вы слышите, как ваш маленький безумный ученый внутри вас начинает хихикать?
Затем см. этот ответ для получения дополнительной информации (и не забывайте его комментарии для большего количества примеров).
Удачи!
Ответ 4
Обновление 2018:
Вы можете получить доступ только к кросс-домену со следующими 4 условиями
- в заголовке ответа есть
Access-Control-Allow-Origin: *
демонстрация
$.ajax({
url: 'https://api.myjson.com/bins/bq6eu',
success: function(response){
console.log(response.string);
},
error: function(response){
console.log('server error');
}
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Ответ 5
Для этого вам потребуется написать прокси-сервер на сервере. И все запросы будут на ваш сервер, а затем ваш сервер будет загружать html и отправлять его обратно клиенту. И нет хорошего способа реализовать это только с помощью javascript.
jQuery содержит функции для загрузки данных JSON или внешних скриптов с помощью XmlHttpRequest, но эта функция не может использоваться для html-страниц. Также вы можете проверить этот поток в списке рассылки jQuery.
Ответ 6
Вы также можете использовать iframe для эмуляции запроса ajax. Это избавит вас от необходимости кодировать решение Backend для проблемы с Frontend. Вот пример:
function setUploadEvent(typeComponet){
var eventType = "";
var iframe = document.getElementById("iframeId");
try{
/* for Mozilla / Opera9 */
if (/(?!.*?compatible|.*?webkit)^mozilla|opera/i.test(navigator.userAgent)) {
eventType = "onload";
}else{
/* IE */
eventType = "onreadystatechange";
}
iframe[eventType] = function(){
var doc = iframe.contentDocument || iframe.contentWindow.document;
var response = doc.body.innerHTML; /* or what ever content you are looking for */
}
}
catch(e){
alert("Error loading content")}
}
Это должно сделать трюк. Обратите внимание, что строка обнаружения браузера не самая чистая, вы должны абсолютно использовать те, которые содержатся во всех наиболее распространенных фреймворках JS (Prototype, JQuery и т.д.).
Ответ 7
< script language = "JavaScript" type = "text/javascript" src= "http://www.example.com/hello.js" > </ script >
Вы добавляете данные в hello.js в виде массива, JSON или аналогичного. Пример:
var daysInMonth = новый массив (31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
Получение JavaScript с другого сервера не намного проще..: -)
Ответ 8
Большое спасибо, это действительно хороший трюк. Я сделал так:
test.html
<!DOCTYPE html>
<html>
<head>
<script>
function loadXMLDoc()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","sp.php",true);
xmlhttp.send();
}
</script>
</head>
<body>
<h2>Using the XMLHttpRequest object</h2>
<div id="myDiv"></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</body>
</html>
sp.php
<?php
print file_get_contents("http://your.url.com/you-can-use-cross-domain");
?>