Sự cố miền chéo với iframe

Question

Tôi biết các giải pháp cho các cuộc gọi tên miền chéo trình duyệt. Sử dụng JSONP, thực hiện cuộc gọi proxy hoặc chấp nhận miền trên máy chủ. Tôi tìm thấy 1 cách kỳ lạ hơn ngày hôm nay tại công ty của tôi.

Phương pháp:

Họ đang thay đổi máy chủ để phù hợp với các máy chủ của máy chủ thứ hai bằng cách sử dụng này -

window.location.host = "xyz.com"; 
      or 
document.domain = "xyz.com"; 

Sau đó, họ đang tạo một iframe ẩn và nhận được nội dung trong iframe và thay thế nội dung để có thể nhìn thấy thành phần.

Sự cố:

Nó hoạt động với iframe nhưng nếu tôi gọi ajax, nó không hoạt động. Bất kỳ từ nào về điều này?

Answer 1

Tôi không phải là một fan hâm mộ của jsonp, nó tạo ra khớp nối giữa dữ liệu và trình bày, và vì vậy tôi nghiên cứu vấn đề này trước, và tốt, có một mẹo mà bạn có thể sử dụng, hãy làm theo này:

giả sử chúng tôi có cửa sổ có tên chính A và cửa sổ "đứa trẻ" trong iframe tên B. A và B phải được phục vụ từ cùng một máy chủ, nhưng có thể có tên miền phụ khác nhau, một cái gì đó như:

A được phục vụ từ Sub1 .example.com

B được phân phát từ sub2.example.com

trình duyệt sẽ cho phép bạn thay đổi miền của tài liệu, nhưng bạn chỉ có thể thay đổi tên miền bằng cách xóa tên miền phụ cho đến khi bạn tiếp cận máy chủ, và như vậy trong A bạn thay đổi tên miền, như vậy:

document.domain = "example.com"; 

trong B bạn lần đầu tiên thực hiện cuộc gọi ajax để phạm vi của nó (sub2.example.com), sau đó sau khi yêu cầu đầu tiên đã được gửi cho bạn thay đổi tên miền giống như trong A, để cả hai văn bản này có cùng một tên miền. vì bạn đã gửi yêu cầu tới miền gốc trong B, trình duyệt sẽ cho phép bạn gửi yêu cầu tới đó, nhưng vì bạn cũng đã thay đổi tên miền của mình và giờ đây A và B có cùng tên miền mà họ có thể giao tiếp với nhau.

điều quan trọng là trước tiên bạn phải thực hiện ít nhất một yêu cầu trong B cho tên miền ban đầu của nó, trước khi bạn thay đổi tên miền. cũng vậy, nó sẽ không hoạt động nếu cả hai trang không được phục vụ từ cùng một máy chủ, vì vậy trong hầu hết các trường hợp, nó không giải quyết được vấn đề, nhưng nó cho phép bạn nhiều hơn một chút để cơ động.

Tôi đã sử dụng mẹo này nhiều lần và chưa gặp phải bất kỳ sự cố nào, theo như tôi biết, nó hoạt động trên tất cả các trình duyệt, hãy cho tôi biết nếu không có trong một số trường hợp.

đây là một ví dụ giả:

in A 
================== 
document.domain = "example.com"; 
var child; // keep reference to B 
function setChild(win) { 
    childDocument = win; 
} 

function handleMessage(message) { 
    do what ever it is you need to 
} 

in B 
================== 
make ajax request 
document.domain = "example.com"; 
parent.setChild(this); 

function ajaxCallback(message) { 
    parent.handleMessage(message); 
}