Tương thích X-UA được đặt thành IE = edge, nhưng nó vẫn không dừng Chế độ tương thích


247

Tôi khá bối rối. Tôi có thể thiết lập

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

và IE8 và IE9 sẽ hiển thị trang bằng công cụ kết xuất mới nhất. Tuy nhiên, tôi mới thử nghiệm nó và nếu Chế độ tương thích được bật ở nơi khác trên trang web của chúng tôi, nó sẽ ở lại trang của chúng tôi , mặc dù chúng tôi không nên buộc nó không hoạt động.

Làm thế nào bạn có thể đảm bảo IE không sử dụng Chế độ tương thích (ngay cả trong mạng nội bộ)?

FWIW, tôi đang sử dụng khai báo HTML5 DocType ( <!doctype html>).

Dưới đây là một vài dòng đầu tiên của trang:

<!doctype html> 
<!--[if lt IE 7 ]> <html lang="en" class="innerpage no-js ie6"> <![endif]--> 
<!--[if IE 7 ]>    <html lang="en" class="innerpage no-js ie7"> <![endif]--> 
<!--[if IE 8 ]>    <html lang="en" class="innerpage no-js ie8"> <![endif]--> 
<!--[if (gte IE 9)|!(IE)]><!--> 
<html lang="en" class="innerpage no-js"> 
<!--<![endif]--> 
    <head> 
        <meta charset="ISO-8859-1" /> 
        <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 

EDIT: Tôi mới biết rằng cài đặt mặc định trên IE8 là sử dụng chế độ tương thích IE7 cho các trang web mạng nội bộ. Điều này sẽ ghi đè thẻ meta Tương thích X-UA?


Tôi cũng gặp vấn đề này với một số người dùng của mình, bạn đã bao giờ hiểu điều này chưa? Ứng dụng của tôi không phải là mạng nội bộ. Và chỉ có 20% người dùng nhận được nó, thật kỳ lạ.
Kevin

2
Đây có thể là kết quả của việc đánh dấu thẻ <html> hài hước của bạn (công cụ <! - [if lt IE 7]>). Hãy thử loại bỏ nó và xem nếu nó hoạt động. Xem câu hỏi SO stackoverflow.com/questions/10682827/ này
Chủ nhật

13
@SundayIronfoot FYI, đánh dấu thẻ <html> vui nhộn mà bạn tham khảo là các nhận xét IE có điều kiện được sử dụng để thêm một lớp CSS vào phần tử <html> cho phiên bản IE thích hợp (nếu có) để bạn có thể định kiểu mọi thứ theo cách khác khi cần đối với các phiên bản IE bằng cách đơn giản là tiền tố khai báo kiểu của bạn bằng ".ie7", như: .ie7 p {width: 200px; } ... đó là một công việc sạch hơn để xử lý các vấn đề trong các phiên bản IE cũ hơn là phải sử dụng một số bản hack CSS như * width hoặc _ thong. Các trình duyệt khác ngoài IE sẽ bỏ qua nó và chỉ sử dụng trình duyệt cơ bản.
Tim Franklin

Câu trả lời:


261

Nếu bạn cần ghi đè Cài đặt Chế độ xem Tương thích của IE cho các trang web mạng nội bộ, bạn có thể làm như vậy trong web.config (IIS7) hoặc thông qua các tiêu đề HTTP tùy chỉnh trong thuộc tính của trang web (IIS6) và đặt Tương thích X-UA ở đó. Thẻ meta không ghi đè cài đặt mạng nội bộ của IE trong Cài đặt Chế độ xem tương thích, nhưng nếu bạn đặt nó ở máy chủ lưu trữ, nó sẽ ghi đè khả năng tương thích.

Ví dụ cho web.config trong IIS7:

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="X-UA-Compatible" value="IE=EmulateIE8" />
      </customHeaders>
    </httpProtocol>
</system.webServer>

Chỉnh sửa : Tôi đã xóa clearmã từ ngay trước khi add; đó là một sự giám sát không cần thiết từ việc sao chép và dán. Bắt tốt, bình luận!


5
Tuy nhiên, chỉ là một lưu ý ... Nếu bạn đang phát triển bằng máy chủ web phát triển Visual Studio tích hợp (còn gọi là Cassini), thì điều này sẽ không hoạt động vì Cassini không tôn trọng phần <system.webServer> của web. cấu hình. Vì vậy, để phát triển, sử dụng IIS Express thay thế.
James Messinger

1
Lý do cho là <clear />gì? Những tiêu đề tùy chỉnh được xóa bởi điều này?
M4N

Rõ ràng dường như để loại bỏ các <urlCompression...>quy tắc ít nhất đối với tôi. Quy tắc đó không gzipping, mà tôi muốn vì vậy tôi đã nhận xét rõ ràng. Bất kỳ thông tin thêm sẽ là đáng yêu.
Nenotlep

Tôi đã xóa 'rõ ràng' - bắt tốt, đó là một dòng không cần thiết từ sao chép và dán từ thực hiện của tôi.
Tim Franklin

14
PHP:<?php header('X-UA-Compatible: IE=edge'); ?>
Nux

183

Giải pháp về phía máy chủ là giải pháp được đề xuất, như @TimmyFranks đã đề xuất trong câu trả lời của anh ấy, nhưng nếu cần thực hiện X-UA-Compatiblequy tắc ở cấp độ trang, vui lòng đọc các mẹo sau, để hưởng lợi từ trải nghiệm của người đã bị đốt cháy


Các X-UA-Compatiblethẻ meta phải xuất hiện ngay sau khi các tiêu đề trong <head>phần tử. Không có thẻ meta, liên kết css và lệnh js script nào có thể được đặt trước nó.

<head>
    <title>Site Title</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <script type="text/javascript" src="/jsFile.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="apple-touch-icon" href="https://stackoverflow.com/apple-touch-icon.png" />
    <link rel="shortcut icon" href="https://stackoverflow.com/apple-touch-icon.png" />
</head>

Nếu có bất kỳ bình luận có điều kiện nào trong trang (giả sử nằm trong <html>), chúng phải được đặt bên dưới, sau <head>.

// DON'T: place class inside the HTML tag 
<!--[if gt IE 8]><!--> 
    <html class="aboveIe8"> 
<!--<![endif]-->

// DO: place the class inside the BODY tag
<!--[if gt IE 8]><!--> 
    <body class="aboveIe8"> 
<!--<![endif]-->

Nhóm của Html5BoilerPlate đã viết về lỗi này - http://h5bp.com/i/378 Họ có một số giải pháp.

Về chế độ xem Intranet & Tương thích, có các cài đặt khi bạn truy cập công cụ> Cài đặt chế độ xem tương thích.

Thiết lập chế độ xem tương thích


1
Tôi đã thử 4 hoặc 5 câu trả lời khác trên Stack Overflow và chỉ có sự kết hợp cụ thể này hoạt động với tôi. Đối với bất kỳ ai sử dụng WordPress và plugin SEO, hãy cẩn thận về plugin viết lại <title> ở một vị trí khác. Chỉnh sửa: Đã thêm nhận xét WordPress
Mike Ebert

6
X-UA-Compatiblenên xuất hiện càng sớm càng tốt, có thể saucharset . Tôi không nghĩ đúng là nó "phải xuất hiện ngay sau tiêu đề".
sam

Khuyến nghị này là kết quả của sự đau khổ theo IE. Được tăng bằng máu. Ai nói IE theo hướng dẫn?
neoswf

4
Ồ, điều này làm việc cho tôi và có các thẻ meta của tôi ngay sau thẻ tiêu đề là điều đã làm nên mánh khóe. Ước gì nó không quá cổ xưa để thực hiện công việc này ...
The

Các X-UA-Compatiblethẻ meta có thể xuất hiện sau title, basevà bất kỳ thẻ meta khác mà không làm mất tác dụng của nó. Đây là những gì tôi đã thử nghiệm trong IE8. Không có ý kiến ​​có điều kiện có thể được đặt trước nó, mặc dù.
Rockallite 14/03/2016

37

Lưu ý rằng nếu bạn đang phục vụ nó từ PHP, bạn cũng có thể sử dụng đoạn mã sau để sửa nó.

header("X-UA-Compatible: IE=Edge");

4
Điều này hoạt động tốt hơn so với việc thêm thẻ meta, vì nó vượt qua xác thực W3C bằng phương pháp này và dễ dàng hơn nhiều so với hack .htaccess.
Talvi Watia

2
Tôi đã thử mọi thứ khác, và đây là những gì cuối cùng đã làm việc. Cảm ơn bạn.
Jason

2
Đối với những người trên WordPress, đây có thể giúp: codex.wordpress.org/Plugin_API/Action_Reference/send_headers
ambiguousmouse

Điều này cũng hoạt động tốt hơn rất nhiều khi một trang web lớn được xây dựng tùy thuộc vào <!--[if lt IE 7 ]> <html>...! CẢM ƠN BẠN! Bạn là chúa gửi !!
OZZIE

2
@sun leather - Bất kỳ tiêu đề nào được gửi bởi PHP PHẢI xảy ra trước khi gửi bất kỳ đầu ra nào đến trang, đó là trước khi bất kỳ HTML hoặc dữ liệu nào được PHP xuất ra.
TJ L

25

Hóa ra, điều này phải làm với lựa chọn "thông minh" của Microsoft để làm cho tất cả các trang web mạng nội bộ buộc phải ở chế độ tương thích, ngay cả khi X-UA-Compatibleđược đặt thành IE=edge.


32
Đo không phải sự thật. Tương thích X-UA sẽ ghi đè cài đặt chế độ tương thích. Tuy nhiên, đôi khi sử dụng thẻ meta không hoạt động vì chế độ đã được đặt theo thời gian nó gặp nó. Đây là lý do tại sao tôi sử dụng phiên bản tiêu đề HTML, vì vậy trình duyệt có thể kích hoạt chế độ tiêu chuẩn sớm trong quy trình.
Erik Funkenbusch

3
Thêm vào nhận xét của Mystere Man, bạn có thể ghi đè từ máy chủ lưu trữ bằng web.config hoặc các tiêu đề http tùy chỉnh trong IIS. Xem bài viết của tôi ở trên để biết chi tiết.
Tim Franklin

7
Tôi đã thử điều này nhiều lần và nó không ghi đè tất cả các trang web mạng nội bộ buộc phải ở chế độ so sánh.
Maess

@Mystere Man: Đôi khi xác định bất cứ khi nào trang nằm trong iframe, trong đó tài liệu gốc không xác định XUA-COMPAT và chế độ tài liệu được kế thừa từ trang mẹ (một lựa chọn MS rất thông minh khác).
Stefan Steiger

1
@Kerrick: Đây không phải là câu trả lời đúng. Xem câu dưới đây được trả lời bởi tj111 để có câu trả lời đúng.
thoái hóa

9

Tôi cũng gặp vấn đề tương tự về kết xuất IE9 trong các tiêu chuẩn Tài liệu IE7 cho máy chủ cục bộ. Tôi đã thử nhiều thẻ nhận xét có điều kiện nhưng không thành công. Cuối cùng, tôi chỉ xóa tất cả các thẻ có điều kiện và chỉ cần thêm thẻ meta ngay sau đầu như bên dưới và nó hoạt động như bùa mê.

<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

Hy vọng nó giúp


7

Ngay cả khi bạn đã bỏ chọn tùy chọn "Hiển thị trang web mạng nội bộ trong Chế độ xem tương thích" và có X-UA-Tương thích trong các tiêu đề phản hồi của bạn, vẫn có một lý do khác khiến trình duyệt của bạn có thể mặc định là "Chế độ xem tương thích" - Chính sách nhóm của bạn. Nhìn vào bảng điều khiển của bạn cho thông báo sau:

HTML1203: xxx.xxx đã được định cấu hình để chạy trong Chế độ xem tương thích thông qua Chính sách nhóm.

Trong đó xxx.xxx là tên miền cho trang web của bạn (ví dụ test.com). Nếu bạn thấy điều này thì chính sách nhóm cho tên miền của bạn được đặt để mọi trang web kết thúc trong test.com sẽ tự động hiển thị trong chế độ Tương thích bất kể loại tài liệu, tiêu đề, v.v.

Để biết thêm thông tin, vui lòng xem liên kết sau (giải thích mã html): http://msdn.microsoft.com/en-us/l Library / i / hh180764 (v = vs85 ) .aspx


5

Như NEOSWF chỉ ra ở trên, các bình luận có điều kiện của Paul Ailen ngăn thẻ meta có bất kỳ ảnh hưởng nào.

Có một số bản sửa lỗi tất cả ở đây ( http://nicolasgallagher.com/better-conditable- classnames-for-hack-free-css / )

Bao gồm các:

Thêm hai lớp HTML, sử dụng các tiêu đề máy chủ và thêm một nhận xét có điều kiện ở trên doctype.

Trong dự án mới nhất của tôi, tôi quyết định loại bỏ các bình luận có điều kiện của Paul Ailen. Tôi không thích ý tưởng thêm bất cứ thứ gì vào html mà không thực hiện RẤT NHIỀU thử nghiệm trước và thật tuyệt khi thấy những gì đã được đặt chỉ bằng cách xem HTML.

Cuối cùng, tôi vây quanh một div ngay sau cơ thể và sử dụng các bình luận có điều kiện, vd

  <!--[if IE 7]><div class="ie7"><!--<![endif]-->
  ... regular body stuff
  <!--[if IE 7]></div><!--<![endif]-->

Tôi có thể đã làm điều này trên cơ thể nhưng khó khăn hơn với các CMS như Wordpress.

Rõ ràng là một DIV khác của nó bên trong đánh dấu, nhưng nó chỉ dành cho các trình duyệt cũ hơn.

Tôi nghĩ rằng nó có thể là một quyết định dựa trên dự án mặc dù.

Tôi cũng đã đọc một cái gì đó về thẻ meta bộ ký tự cần đến trong 1024 byte đầu tiên để điều này đảm bảo điều đó.

Đôi khi những ý tưởng đơn giản nhất, dễ đọc nhất lại là những ý tưởng hay nhất và chắc chắn đáng để suy nghĩ! Cảm ơn bình luận thứ 6 về liên kết trên đã chỉ ra điều này.


5

X-UA-Compatiblesẽ chỉ ghi đè Chế độ tài liệu, không phải Chế độ trình duyệt và sẽ không hoạt động đối với tất cả các trang web mạng nội bộ; nếu đây là trường hợp của bạn, giải pháp tốt nhất là tắt "Hiển thị trang web mạng nội bộ trong Chế độ xem tương thích" và đặt cài đặt chính sách nhóm để chỉ định trang web mạng nội bộ nào cần chế độ tương thích.


5

Tôi đã thêm phần sau vào tập tin htaccess của mình, nó đã thực hiện thủ thuật:

BrowserMatch MSIE ie
Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie

1
điều này hoạt động khi mạng nội bộ được đặt thành tương thích. tôi đã mất nhiều thời gian để tìm một cái gì đó sẽ làm việc. đặc biệt khi bạn tìm kiếm và mọi thứ đều liên quan đến iis
shorif2000

Điều này thật tuyệt. Tôi không biết bạn có thể gửi tiêu đề bằng .htaccess
Alex W

3

Ngoài ra, X-UA-Tương thích phải là thẻ meta đầu tiên trong phần đầu

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
</head>

Nhân tiện, thứ tự đúng hoặc các thẻ đầu chính là:

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <title>Site Title</title>
    <!-- other tags -->
</head>

Cách này

  1. chúng tôi đặt công cụ kết xuất để sử dụng trước khi IExplorer bắt đầu xử lý
  2. tài liệu sau đó chúng tôi đặt mã hóa để sử dụng cho tất cả trình duyệt
  3. sau đó chúng tôi in tiêu đề sẽ được xử lý với mã hóa đã được xác định.

2
Trên thực tế, CHARSET phải đi trước X-UA-Tương thích. Xem blogs.msdn.com/b/ieinternals/archive/2011/07/18/...
EricLaw

1
Nó không phải là đầu tiên, nhưng nó cần phải ở gần đầu. Nó có thể theo tiêu đề (và bộ ký tự, như Eric đã lưu ý), nhưng đó là về nó.
Lance Leonard

trong trường hợp của tôi trên nginx, nó sẽ chỉ hoạt động nếu thẻ Tương thích X-UA là thẻ đầu tiên trong phần đầu
Marco Roth

2

Timmy Franks đã phù hợp với tôi. Chúng tôi vừa gặp sự cố hôm nay khi khách hàng có toàn công ty IE8 và nó đã buộc trang web chúng tôi viết cho mạng nội bộ của họ vào chế độ tương thích. Cài đặt "IE-Edge" dường như để khắc phục nó.

<httpProtocol>
  <customHeaders>
    <clear />
    <add name="X-UA-Compatible" value="IE=Edge" />
  </customHeaders>
</httpProtocol>


1

IE 11 không cho phép bạn ghi đè cài đặt chế độ xem tương thích trình duyệt nữa bằng cách gửi tiêu đề ...

<meta http-equiv="X-UA-Compatible" content="IE=edge" />  

Dường như cách duy nhất để buộc trình duyệt không sử dụng chế độ xem tương thích là để người dùng vô hiệu hóa nó trong trình duyệt của họ. Chúng tôi là một trang Intranet và tùy chọn IE mặc định là sử dụng chế độ xem tương thích cho các trang Intranet. Thật là đau!

Chúng tôi có thể ngăn người dùng thay đổi cài đặt trình duyệt của họ cho người dùng IE 9 và 10, nhưng nó không còn hoạt động trong IE 11. Người dùng IE của chúng tôi đang chuyển sang Chrome, nơi đây không phải là vấn đề và không bao giờ có đã.


Không phải là nó không cho phép, IE11không hỗ trợ các Chế độ tương thích khác ngoài edge. Liên kết đến tài liệu chính thức . Điều đó có nghĩa là chúng ta không phải sử dụng thẻ meta đó để ẩn nút CM trên thanh địa chỉ nữa.
Wallace Sidhrée

4
Không đúng sự thật: IE11 vẫn hỗ trợ tất cả các Chế độ tương thích kế thừa.
EricLaw

@EricLaw, câu trả lời của EricP có đúng không (IE11 thay đổi hành vi cho tiêu đề HTTP tương thích X-UA)?
Matthew Flaschen

@EricP, bạn đã thử tiêu đề HTTP hay chỉ phiên bản thẻ <meta>?
Matthew Flaschen

2
@MatthewFlaschen: Không, EricP không chính xác, cũng như Wallace Sidhree (mặc dù công bằng với Wallace, MSDN không giải thích ý nghĩa của chúng là "không dùng nữa"). Điều thay đổi trong IE11 là hoàn toàn không có nút "Chế độ xem tương thích" ( technet.microsoft.com/en-us/l Library / dn321449.aspx ) nhưng các tuyên bố tương thích X-UA vẫn được tôn trọng.
EricLaw

1

Tôi đã có thể giải quyết vấn đề này khi tải các tiêu đề trước HTML bằng php và nó hoạt động rất tốt.

<?php 
header( 'X-UA-Compatible: IE=edge,chrome=1' );
header( 'content: width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' );
include('ix.html');
?> 

ix.html là nội dung tôi muốn tải sau khi gửi các tiêu đề.


1

Tôi đã gặp vấn đề tương tự trong IE11. Không có câu trả lời nào giải quyết được vấn đề của tôi. Sau khi đào một chút, tôi nhận thấy trình duyệt đang chạy ở chế độ Enterprise . (xác minh bằng cách nhấn F12 và nhấp vào tab mô phỏng, tìm kiếm thả xuống hồ sơ trình duyệt) Cài đặt đã bị khóa, không cho phép tôi thay đổi cài đặt.

Tôi đã có thể thay đổi cấu hình thành Desktop sau khi xóa CurrentVersion khỏi khoá đăng ký sau:

HKEY_CURRENT_USER\Software\Policies\Microsoft\Internet Explorer\Main\EnterpriseMode

Sau khi thay đổi chế độ sang Desktop, các câu trả lời trên bài đăng này sẽ hoạt động.


1

Khi trình duyệt của bạn mở bằng Chế độ tương thích, thậm chí bạn xóa và tắt tất cả cấu hình chế độ tương thích khỏi trình duyệt web và Trình chỉnh sửa chính sách nhóm cục bộ, bạn có thể thử tắt từ khóa đăng ký.

Điều này cũng xảy ra với tôi khi sử dụng tên miền và tên miền phụ để kết nối phía máy chủ. Máy bị hạn chế mở ở chế độ tương thích cho tất cả các tên miền phụ.

CHẾ ĐỘ BỀN VỮNG TUYỆT VỜI CHO INTRANET

HKEY_LOCAL_MACHINE - PHẦN MỀM - Chính sách - Microsoft - Internet Explorer - BrowserEmulation -> IntranetCompalityMode Giá trị phải là 0 (không) . Và cũng loại bỏ tên miền hiện có khỏi Chính sách.

Mặt khác, bạn có thể thêm một giá trị mới (DWORD) có chứa dữ liệu giá trị 0 (không) .


0

Tôi đã gặp vấn đề tương tự sau khi thử nhiều kết hợp Tôi có ghi chú làm việc này Tôi đã kiểm tra tính tương thích cho mạng nội bộ

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<head runat="server">

0

Nếu bạn đang sử dụng ngăn xếp LAMP, sau đó thêm tệp này vào tệp .htaccess trong thư mục gốc web của bạn. Không cần thêm nó vào mọi tệp PHP.

<IfModule mod_headers.c>
    Header add X-UA-Compatible "IE=Edge"
</IfModule>
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.