location.hash ใช้การปรับ iframe ข้ามโดเมน

ความสัมพันธ์ของโดเมนเพจ :

หน้าหลัก a.html เป็นของโดเมน A: www.taobao.com
หน้า iframe b.html เป็นของโดเมน 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 ในโดเมนเดียวกัน

รหัสมีดังนี้:

รหัส a.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″ ความสูงขอบ =”0″ scrolling=”no” Allowtransparency=”yes” ></iframe>

รหัส b.html

<script type="text/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

<script type="text/javascript">
var b_iframe = parent.parent.document.getElementById("b_iframe");
var 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