Làm cách nào để đặt 'Tùy chọn khung X' trên iframe?


170

Nếu tôi tạo iframenhư thế này:

var dialog = $('<div id="' + dialogId + '" align="center"><iframe id="' + frameId + '" src="' + url + '" width="100%" frameborder="0" height="'+frameHeightForIe8+'" data-ssotoken="' + token + '"></iframe></div>').dialog({

Làm cách nào để sửa lỗi:

Từ chối hiển thị 'https://www.google.com.ua/?gws_rd=ssl'trong một khung vì nó đặt 'Tùy chọn khung X' thành 'SAMEORIGIN'.

với JavaScript?

Câu trả lời:


227

Bạn không thể thiết lập X-Frame-Optionstrên iframe. Đó là một tiêu đề phản hồi được đặt bởi tên miền mà bạn đang yêu cầu tài nguyên ( google.com.uatrong ví dụ của bạn). Họ đã đặt tiêu đề SAMEORIGINtrong trường hợp này, điều đó có nghĩa là họ đã không cho phép tải tài nguyên ở iframebên ngoài miền của họ. Để biết thêm thông tin, hãy xem Tiêu đề phản hồi X-Frame-Options trên MDN.

Kiểm tra nhanh các tiêu đề (được hiển thị ở đây trong các công cụ dành cho nhà phát triển Chrome) cho thấy X-Frame-Optionsgiá trị được trả về từ máy chủ lưu trữ.

nhập mô tả hình ảnh ở đây


7
Với YouTube, bạn có thể thay đổi URL điểm cuối thành phiên bản "nhúng". Xem stackoverflow.com/questions/25661182/ (Tôi biết đây không phải là thứ mà OP đang tìm kiếm, nhưng google cho kết quả này trước tiên!)

73

X-Frame-Optionslà một tiêu đề được bao gồm trong phản hồi yêu cầu nêu nếu tên miền được yêu cầu sẽ cho phép chính nó được hiển thị trong một khung. Nó không có gì để làm với javascript hoặc HTML và không thể thay đổi bởi người khởi tạo yêu cầu.

Trang web này đã đặt tiêu đề này không cho phép nó được hiển thị trong một iframe. Không có gì khách hàng có thể làm để ngăn chặn hành vi này.

Đọc thêm về X-Frame-Options


Nó được đặt trong tiêu đề phản hồi, không phải tiêu đề yêu cầu. Nhưng giải thích chính xác khác!
nickang

2
@nickang đó là những gì tôi muốn nói, tuy nhiên tôi đồng ý thuật ngữ này không rõ ràng. Tôi đã chỉnh sửa nó để loại bỏ bất kỳ sự nhầm lẫn. Cảm ơn.
Rory McCrossan

31

Trong trường hợp bạn kiểm soát Máy chủ gửi nội dung của iframe, bạn có thể đặt cài đặt cho X-Frame-Optionsmáy chủ web của mình.

Cấu hình Apache

Để gửi tiêu đề Tùy chọn khung X cho tất cả các trang, hãy thêm tiêu đề này vào cấu hình trang web của bạn:

Header always append X-Frame-Options SAMEORIGIN

Cấu hình nginx

Để định cấu hình nginx để gửi tiêu đề Tùy chọn khung X, hãy thêm tiêu đề này vào cấu hình http, máy chủ hoặc vị trí của bạn:

add_header X-Frame-Options SAMEORIGIN;

Không có cấu hình

Tùy chọn tiêu đề này là tùy chọn, vì vậy nếu tùy chọn này hoàn toàn không được đặt, bạn sẽ cung cấp tùy chọn để định cấu hình tùy chọn này cho phiên bản tiếp theo (ví dụ: trình duyệt của khách truy cập hoặc proxy)

nguồn: https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options


Điều này đã giúp tôi. Tôi nhận xét hai dòng này: add_header Strict-Transport-Security "max-age=86400; includeSubdomains"; add_header X-Frame-Options DENY;từ đoạn nginx-snippets, và sau đó nó hoạt động ngay lập tức.
Zeth

NGINX, quan trọng để nói ở đâu , bên trong vị trí?
Peter Krauss

Peter Kraus, bạn muốn gì?
rubo77

14

Vì giải pháp không thực sự được đề cập cho phía máy chủ:

Người ta phải thiết lập những thứ như thế này (ví dụ từ apache), đây không phải là tùy chọn tốt nhất vì nó cho phép mọi thứ, nhưng sau khi bạn thấy máy chủ của mình hoạt động chính xác, bạn có thể dễ dàng thay đổi cài đặt.

           Header set Access-Control-Allow-Origin "*"
           Header set X-Frame-Options "allow-from *"

5

không hẳn ... tôi đã dùng

 <system.webServer>
     <httpProtocol allowKeepAlive="true" >
       <customHeaders>
         <add name="X-Frame-Options" value="*" />
       </customHeaders>
     </httpProtocol>
 </system.webServer>

Điều này có vẻ như là một giải pháp, nhưng đây có phải là một vi phạm an ninh?
Yogurtu

1
Bạn không nên tắt chính sách xuất xứ tương tự cho trang web của mình trừ khi bạn biết chính xác những gì bạn đang làm. Bạn không nên cho phép các tên miền khác với nội dung của bạn được nhúng. Xem codecademy.com/articles/what-is-cors và các hướng dẫn tương tự.
slhck


2

X-Frame-Options tiêu đề HTTP phản ứng có thể được sử dụng để cho biết hay không một trình duyệt nên được cho phép để làm cho một trang trong một <frame>, <iframe>hoặc <object>. Các trang web có thể sử dụng điều này để tránh các cuộc tấn công nhấp chuột, bằng cách đảm bảo rằng nội dung của chúng không được nhúng vào các trang web khác.

Để biết thêm thông tin: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

Tôi có một giải pháp thay thế cho vấn đề này, mà tôi sẽ chứng minh bằng cách sử dụng PHP:

iframe.php:

<iframe src="target_url.php" width="925" height="2400" frameborder="0" ></iframe>

đích_url.php:

<?php 
  echo file_get_contents("http://www.example.com");
?>

5
Đây có phải là một giải pháp khả thi để sử dụng trang sau khi tải không? Tôi có thể tương tác với các trang sau khi tải không? Không phải mọi yêu cầu cho tên miền phải được ủy quyền để sử dụng nội dung sau khi tải?
Timothy Gonzalez

0

Đối với mục đích này, bạn cần khớp vị trí trong apache của bạn hoặc bất kỳ dịch vụ nào khác bạn đang sử dụng

Nếu bạn đang sử dụng apache thì trong tệp httpd.conf.

  <LocationMatch "/your_relative_path">
      ProxyPass absolute_path_of_your_application/your_relative_path
      ProxyPassReverse absolute_path_of_your_application/your_relative_path
   </LocationMatch>

0

Giải pháp là cài đặt plugin trình duyệt.

Không thể tích hợp một trang web phát hành HTTP Header X-Frame-Optionscó giá trị DENY(hoặc SAMEORIGINcó nguồn gốc máy chủ khác) vào IFRAME ... trừ khi bạn thay đổi hành vi này bằng cách cài đặt plugin Trình duyệt bỏ qua X-Frame-OptionsTiêu đề (ví dụ: Bỏ qua Tiêu đề X-Frame của Chrome ).

Lưu ý rằng điều này không được khuyến khích ở tất cả vì lý do bảo mật.


0

bạn có thể đặt tùy chọn x-frame trong cấu hình web của trang bạn muốn tải trong iframe như thế này

<httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="*" />
    </customHeaders>
  </httpProtocol>

Nếu tôi muốn mở stackoverflow, tôi có thể tìm cấu hình web ở đâu? không phải cho phía máy chủ?
irum zahra

-1

Bạn thực sự không thể thêm x-iframe trong phần thân HTML của mình vì nó phải được cung cấp bởi chủ sở hữu trang web và nó nằm trong các quy tắc của máy chủ.

Những gì bạn có thể làm là tạo một tệp PHP tải nội dung của URL mục tiêu và iframe đó là URL php, việc này sẽ hoạt động trơn tru.


1
"Bạn có thể có thể" sau đó đăng nó dưới dạng một nhận xét nếu đó không phải là câu trả lời
MK

Điều gì xảy ra nếu nó trở thành một câu trả lời MK
Sushant Chaudhari

Sau đó, nó là một gợi ý mà làm việc, không phải là một giải pháp cụ thể, vì vậy nó nên được đặt như một bình luận
MK

-2

bạn có thể làm điều đó trong tệp cấu hình mức cá thể tomcat (web.xml) cần thêm 'bộ lọc' và ánh xạ bộ lọc 'trong tệp cấu hình web.xml. điều này sẽ thêm [X-frame-Tùy chọn = DENY] trong tất cả các trang vì đây là cài đặt chung.

<filter>
        <filter-name>httpHeaderSecurity</filter-name>
        <filter-class>org.apache.catalina.filters.HttpHeaderSecurityFilter</filter-class>
        <async-supported>true</async-supported>
        <init-param>
          <param-name>antiClickJackingEnabled</param-name>
          <param-value>true</param-value>
        </init-param>
        <init-param>
          <param-name>antiClickJackingOption</param-name>
          <param-value>DENY</param-value>
        </init-param>
    </filter>

  <filter-mapping> 
    <filter-name>httpHeaderSecurity</filter-name> 
    <url-pattern>/*</url-pattern>
</filter-mapping>

-3

Nếu bạn đang theo cách tiếp cận xml, thì mã bên dưới sẽ hoạt động.

    <security:headers>
        <security:frame-options />
        <security:cache-control />
        <security:content-type-options />
        <security:xss-protection />
    </security:headers>
<security:http>
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.