J'ai besoin de détecter si le navigateur est IE ou Edge avec Angular (TypeScript). Est-ce possible ? Si oui, comment ?
@aargoo, je suis nouveau à angularjs. Pouvez-vous me dire où utiliser ce code ? Je comprends l'ordre d'appel config > run > controller mais où va ce code. Merci
Veuillez utiliser le code suivant :
// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+ "[object HTMLElementConstructor]"
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);
// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
//var isChrome = !!window.chrome && !!window.chrome.webstore;
// If isChrome is undefined, then use:
var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);
// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;
var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isEdge: ' + isEdge + '<br>';
output += 'isBlink: ' + isBlink + '<br>';
document.body.innerHTML = output;
@Liutas Angular utilise Typescript. Et c'est un sur-ensemble de JavaScript. Bien sûr que vous pouvez.
Angular cli jette une erreur en utilisant window,chrome, mais il fonctionne en utilisant !!window['chrome']&& !!window['chrome']['webstore']
Ce code me montre faux pour tous les navigateurs maintenant Lancement à partir de Chrome sur Win7
Pour les utilisateurs d'angular, vous pouvez utiliser ce module npm install ngx-device-detector --save
Les réponses ci-dessus ne fonctionnent pas pour moi
Les modules augmentent toujours la taille des paquets et je pense que nous devrions utiliser des modules tiers alors que nous créons notre propre code.
@nagenderpratapchauhan oui c'est vrai, pour moi il s'agissait d'utiliser un utilitaire car je ne pouvais pas passer 4-5 heures à écrire et tester mon détecteur de navigateur personnalisé. Je crois que ce module a aussi juste le code requis et beaucoup d'extra car il y a une fonction très spécifique que ce module exécute.
Il a fallu 5 minutes entre l'installation et le déploiement réussi. deviceInfo: {"userAgent":"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36","os":"Windows","browser":"Chrome","device":"Unknown","os_version":"windows-10","browser_version":"75.0.3770.100"} . De plus, c'est la manière angulaire !
Vous pouvez utiliser une expression rationnelle avec useragent pour détecter IE.
private isIE() {
const match = navigator.userAgent.search(/(?:Edge|MSIE|Trident\/.*; rv:)/);
let isIE = false;
if (match !== -1) {
isIE = true;
}
return isIE;
}mais, il est toujours recommandé d'utiliser la détection des caractéristiques plutôt que celle du navigateur. Vous pouvez utiliser la bibliothèque modernizr pour cela https://modernizr.com
Si vous voulez afficher un message lorsque le navigateur détecter IE(5,6,7,8) alors vous pouvez utiliser la ligne de code.
Tout d'abord ce code utilisé uniquement dans index.html car le compilateur a d'abord lu ce fichier.
<body>
<p id="NRL" style="background-color: aquamarine;text-align: center"></p>
<app-root></app-root>
<script>
let isIE1 =/^.*MSIE [5-9]/i.test(window.navigator.userAgent);
if(isIE1){
alert('you are using older version of IE .........')
document.getElementById("NRL").innerHTML = "you are using older version of IE .........";
}
</script>
</body> Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
1 votes
Jetez un coup d'œil à npmjs.com/package/ngx-device-detector