2015-04-14 2 views
1

У меня есть страница на моем сайте (скажем, на домен A), и я хотел бы добавить в нее еще несколько контента с другой страницы, скажем, на домен B. По умолчанию эта функция блокируется браузерами по соображениям безопасности.Как загрузить междоменную страницу с помощью JavaScript

Насколько я знаю, существует несколько способов сделать это.

  • CORS: Как я понимаю, этот метод требует вкладов от сервера и клиента. Серверу необходимо добавить заголовок к его ответу (т. Е. Access-Control-Allow-Origin: [DOMAINS], начиная с http://enable-cors.org/server.html). С другой стороны, клиенту необходимо настроить свои запросы (например, http://www.html5rocks.com/en/tutorials/cors/).
  • Если вы используете jQuery, есть этот небольшой плагин, который использует YahooAPI (то есть http://james.padolsey.com/snippets/cross-domain-requests-with-jquery/). Преимущество этого заключается в том, что клиент может использовать его самостоятельно для получения страниц из других доменов. Уловка заключается в том, что Yahoo ограничивает количество запросов в час на IP, а для коммерческого использования требуется разрешение Yahoo.
  • Я также читал о JSONP, но я не много сделал.

Мой вопрос: есть ли другие возможные варианты, которые я мог бы игнорировать?

Для записи сайт, с которым я работаю, представляет собой огромный коммерческий сайт с миллионами пользователей каждый день.

+0

Вот 4 способа сделать это: http://stackoverflow.com/questions/29589916/jsonp-with-remote-url-does-not-work/29589955#29589955 – Drakes

+0

Мой любимый способ нарушить кросс-доменное ограничение - создать объект JavaScript на лету и установить источник из другого домена. Так как это JSON - он будет выполняться отлично, а затем вы можете использовать результаты. – Alex

+0

@Alex Пожалуйста, объясните это еще немного или просто укажите на руководство – Drakes

ответ

1

Вы можете сделать JSONP, разрешить CORS и использовать простой JSON, использовать обертку DIY JSONP или использовать службу прокси-сервера JSONP. Ниже приводятся решения: JSONP with remote URL does not work

Самый простой вариант в вашей ситуации - это запустить собственный прокси-сервер JSONP. Вот демонстрационная оболочка PHP-бета-версии, чтобы пройти мимо CORS, если вы получите строку JSON. Никакой улов, никаких ограничений, в отличие от YQL Yahoo.

<?php 
$callback = isset($_GET["callback"]) ? $_GET["callback"] : "?"; 

$json = file_get_contents('http://somedomain.com/someurl/results.json'); 

header('Access-Control-Allow-Origin: *'); 
header("Content-type: application/json"); 
echo $callback . "(" . $json . ");"; 
?> 
0

Вы пытаетесь получить контент или код? Если вы пытаетесь получить контент, возможно ли использовать iframe?

Если вы хотите код, я думаю, что параметры, которые вы наметили, в значительной степени доступны для вас. JSONP может быть лучшим выбором благодаря поддержке браузера. Например, IE поддерживал его только с версии 10. Если вы работаете на сайте с миллионами пользователей в день, я думаю, что есть некоторые люди в более старых версиях IE (к сожалению).

Редактировать: В зависимости от содержимого другой вариант заключается в представлении собственного локального прокси. Например, я сделал то, что мне нужно, чтобы вызвать WebServiceX на каком-то другом провайдере. Я вызываю WebServiceX на стороне сервера и реализую свою собственную веб-службу, к которой обращается мой JavaScript. Это означает, что я не перехожу к перекрестному домену, потому что доступ к перекрестным доменам происходит на стороне сервера, а не на стороне клиента. Это также позволило мне ввести кэширование и другие вещи (в зависимости от типа данных), которые улучшили производительность.

+0

Содержимое, которое мне нужно загрузить, - это HTML. Я не хочу использовать iframe, поскольку мне не нужно все содержимое страницы, которую я загружаю. Вот почему я попробовал второй вариант, так как jQuery позволяет запускать селектор содержимого, которое я загрузил. Поймайте с этим количество ограничений на количество запросов, и Yahoo может запросить подписку, которую я не уверен, что мой клиент захочет пойти. – temelm

0

Подход к передаче данных между доменами - создание объекта JavaScript и назначение источника из другого домена. Вот быстрый и грязный пример:

Файл тест.HTML:

<html> 
 
<body> 
 
Test done 
 
</body> 
 
<script> 
 
var s = document.createElement("script"); 
 
s.type='text/javascript'; 
 
s.src='test.js'; 
 
document.body.appendChild(s); 
 
</script> 
 
</html>

и test.js

abc={a:'A',b:'B',c:'C'}; 
 
alert(abc.a);

test.js может быть в любой области и функции предупреждения() может быть любой функцией. У меня есть более элегантные способы приложить или запустить такой подход, но этого достаточно, чтобы отказаться от идеи.

Смежные вопросы