Javascript Angular 2：检查用户的浏览器是否兼容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36877151/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular 2: Check whether user's browser is compatible
提问by Harry
I'm writing an Angular 2 app but am conscious that some users may not be using a browser that can support Angular 2.
我正在编写一个 Angular 2 应用程序，但我意识到有些用户可能没有使用支持 Angular 2 的浏览器。
I have a check for whether Javascript is enabled, I am more interested in whether the user's browser doesn't support certain JS/HTML5/other features required by Angular 2.
我检查了是否启用了 Javascript，我更感兴趣的是用户的浏览器是否不支持 Angular 2 所需的某些 JS/HTML5/其他功能。
What would be the best way to assess whether the user's browser supports Angular 2, and display a message if not?
评估用户的浏览器是否支持 Angular 2 并在不支持的情况下显示消息的最佳方法是什么？
I'm aware of e.g. Modernizer, but not sure where to begin as Modernizer's focus seems to be on assembling compatibility checks piecemeal rather than providing a solution that checks for compatibility of whole frameworks.
我知道例如Modernizer，但不确定从哪里开始，因为 Modernizer 的重点似乎是组装兼容性检查，而不是提供检查整个框架兼容性的解决方案。
回答by basarat
Angular 2, and display a message if not?
Angular 2，如果没有显示消息？
The version of browsers that angular supports officially might not be the version of browsers your app works (it may be more or it may be less).
angular 官方支持的浏览器版本可能不是你的应用工作的浏览器版本（可能更多也可能更少）。
You have to do individual browser checks yourself. e.g. Detect IE : http://codepen.io/gapcode/pen/vEJNZN
您必须自己进行单独的浏览器检查。例如检测IE：http: //codepen.io/gapcode/pen/vEJNZN
/**
* detect IE
* returns version of IE or false, if browser is not Internet Explorer
*/
function detectIE() {
var ua = window.navigator.userAgent;
// Test values; Uncomment to check result …
// IE 10
// ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)';
// IE 11
// ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';
// IE 12 / Spartan
// ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';
// Edge (IE 12+)
// ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586';
var msie = ua.indexOf('MSIE ');
if (msie > 0) {
// IE 10 or older => return version number
return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
}
var trident = ua.indexOf('Trident/');
if (trident > 0) {
// IE 11 => return version number
var rv = ua.indexOf('rv:');
return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
}
var edge = ua.indexOf('Edge/');
if (edge > 0) {
// Edge (IE 12+) => return version number
return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
}
// other browser
return false;
}
回答by pixelbits
Not all browsers fully support ES6 (ES2015) standard yet.
并非所有浏览器都完全支持 ES6 (ES2015) 标准。
https://kangax.github.io/compat-table/es6/
https://kangax.github.io/compat-table/es6/
If you want to use ES6 language features for your Angular 2 app then you should include the ES6 shim to bring your browser up-to-spec:
如果你想在你的 Angular 2 应用程序中使用 ES6 语言特性，那么你应该包含 ES6 shim 以使你的浏览器符合规范：
https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js
https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js
That being said, IE seems to be the exception. There are additional polyfills that you need to include to support IE:
话虽如此，IE似乎是个例外。为了支持 IE，您还需要包含其他 polyfill：
https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js
https://npmcdn.com/angular2/es6/dev/src/testing/shims_for_IE.js
If you want to target ES5 (older standard), you need to ensure that you write your angular app using ES5 language features only. In general, there is more browser support for ES5 features, but it's not perfect:
如果您想以 ES5（旧标准）为目标，则需要确保仅使用 ES5 语言功能编写 angular 应用程序。总的来说，浏览器对 ES5 特性的支持比较多，但并不完美：
http://kangax.github.io/compat-table/es5/
http://kangax.github.io/compat-table/es5/
Of course, there's a shim for that too:
当然，也有一个垫片：
https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.8/es5-shim.min.js
https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.8/es5-shim.min.js
