Связь с доменом страницы :
Главная страница a.html принадлежит домену A: www.taobao.com.
Страница b.html в iframe принадлежит домену B: www.alimama.com, предполагая адрес: http://www.alimama.com/b.html.
Эффект реализации :
Страница a.html под доменным именем A встроена в страницу b.html под доменным именем B через iframe. Поскольку ширина и высота b.html непредсказуемы и могут меняться, iframe в a.html должен быть изменен. иметь адаптивный размер.
Характер проблемы:
js имеет проблему с междоменным доступом к iframe, поскольку для управления высотой и шириной iframe в a.html необходимо сначала прочитать размер b.html A и B не принадлежат одному и тому же домену. По соображениям безопасности браузер делает js междоменный доступ ограниченным, а высоту и ширину b.html невозможно прочитать.
Решение:
Представляем прокси-страницы c.html и a.html, принадлежащие одному и тому же домену A. c.html — хорошая промежуточная прокси-страница, предоставляемая в домене A. Предположим, что адрес c.html: www.taobao.com/c.html , который отвечает за чтение. Получите значения ширины и высоты в location.hash, а затем установите ширину и высоту iframe в a.html в том же домене, что и он.
Код выглядит следующим образом:
код .html
Во-первых, b.html вводится через iframe в a.html.
<iframe id=”b_iframe” height=”0″ width=”0″ src=”http://www.alimama.com/b.html”frameborder=”no” border=”0px”marginwidth=”0″marginheight ="0″ прокрутка="нет"allowtransparency="да" ></iframe>
б.html-код
<тип сценария="текст/javascript">
var b_width = Math.max(document.documentElement.clientWidth,document.body.clientWidth);
var b_height = Math.max(document.documentElement.clientHeight,document.body.clientHeight);
var c_iframe = document.getElementById("c_iframe");
c_iframe.src = c_iframe.src+”#”+b_width+”|”+b_height; //http://www.taobao.com/c.html#width|height”
}
</скрипт>
<!–js считывает ширину и высоту b.html и устанавливает ширину и высоту чтения в хэш src промежуточной прокси-страницы c.html в том же домене, что и a.html–>
<iframe id=”c_iframe” height=”0″ width=”0″ src=”http://www.taobao.com/c.html” style=”display:none” ></iframe>
c.html-код
<тип сценария="текст/javascript">
var b_iframe = родитель.родитель.документ.getElementById("b_iframe");
вар hash_url = window.location.hash;
var hash_width = hash_url.split("#")[1].split("|")[0]+"px";
var hash_height = hash_url.split(»#»)[1].split(»|»)[1]+»px»;
b_iframe.style.width = hash_width;
b_iframe.style.height = hash_height;
</скрипт>
iframe в a.html можно адаптировать к ширине и высоте b.html.
Другие подобные проблемы междоменной работы js также могут быть решены в соответствии с этой идеей.
Исходный текст: http://ued.alimama.com/?p=197.