Die meisten Implementierungen, die ich gesehen habe, betreffen die Browsererkennung auf der Clientseite. Ich habe mich nur gefragt, ob es möglich war, die Browsererkennung durchzuführen, bevor Ressourcen an den Client gesendet wurden.
Vielen Dank.
var ua = request.headers['user-agent'],
$ = {};
if (/mobile/i.test(ua))
$.Mobile = true;
if (/like Mac OS X/.test(ua)) {
$.iOS = /CPU( iPhone)? OS ([0-9\._]+) like Mac OS X/.exec(ua)[2].replace(/_/g, '.');
$.iPhone = /iPhone/.test(ua);
$.iPad = /iPad/.test(ua);
}
if (/Android/.test(ua))
$.Android = /Android ([0-9\.]+)[\);]/.exec(ua)[1];
if (/webOS\//.test(ua))
$.webOS = /webOS\/([0-9\.]+)[\);]/.exec(ua)[1];
if (/(Intel|PPC) Mac OS X/.test(ua))
$.Mac = /(Intel|PPC) Mac OS X ?([0-9\._]*)[\)\;]/.exec(ua)[2].replace(/_/g, '.') || true;
if (/Windows NT/.test(ua))
$.Windows = /Windows NT ([0-9\._]+)[\);]/.exec(ua)[1];
Das sollte für dich funktionieren. Legen Sie es einfach in Ihren Response-Handler.
Die Bibliothek ua-parser für Knoten (npm install ua-parser
) macht einen großen Satz von Regex für Browser-Benutzeragenten-Strings verfügbar. Ich würde es dringend für Ihre Bedürfnisse empfehlen.
Ich warf dies zusammen mit ua-parser-js . Ich bin sicher, dass es verbessert werden kann, aber es ist funktional.
Installieren Sie das Paket:
Sudo npm install ua-parser-js
In Ihrer Routendatei benötigen Sie UAParser:
var UAParser = require('ua-parser-js');
Mach ein paar Sachen damit:
function ensureLatestBrowser(req, res, next) {
var parser = new UAParser();
var ua = req.headers['user-agent'];
var browserName = parser.setUA(ua).getBrowser().name;
var fullBrowserVersion = parser.setUA(ua).getBrowser().version;
var browserVersion = fullBrowserVersion.split(".",1).toString();
var browserVersionNumber = Number(browserVersion);
if (browserName == 'IE' && browserVersion <= 9)
res.redirect('/update/');
else if (browserName == 'Firefox' && browserVersion <= 24)
res.redirect('/update/');
else if (browserName == 'Chrome' && browserVersion <= 29)
res.redirect('/update/');
else if (browserName == 'Canary' && browserVersion <= 32)
res.redirect('/update/');
else if (browserName == 'Safari' && browserVersion <= 5)
res.redirect('/update/');
else if (browserName == 'Opera' && browserVersion <= 16)
res.redirect('/update/');
else
return next();
}
und dann auf Ihrer Route einfach anrufen:
app.all(/^(?!(\/update)).*$/, ensureLatestBrowser);
Wenn Sie sehen möchten, welche anderen Informationen Sie mit UAParser erhalten können, besuchen Sie die Demo-Seite.
Ich wollte eine einfache Umleitung auf eine mobile Version meiner Website durchführen, so dass der User-Agent zuverlässig genug ist. Ich wollte es serverseitig machen, also habe ich keine Zeit damit verschwendet, unnötige CSS und Js auf den Client zu laden. http://detectmobilebrowsers.com/ hatte die robusteste Regex, die es zu bieten hat. Also habe ich eine Express-Middleware zusammengestellt, mit der Sie die Umleitung durchführen können, indem Sie Ihrer App einfach zwei Zeilen Code hinzufügen.
npm install detectmobilebrowsers
zur Installation
express = require 'express'
mobile = require 'detectmobilebrowsers'
app = express()
app.configure () ->
app.use mobile.redirect 'http://m.domain.com'
app.get '/', (req, res) ->
res.send 'Not on Mobile'
app.listen 3000
ua = request.headers['user-agent'];
if( /firefox/i.test(ua) )
browser = 'firefox';
else if( /chrome/i.test(ua) )
browser = 'chrome';
else if( /safari/i.test(ua) )
browser = 'safari';
else if( /msie/i.test(ua) )
browser = 'msie';
else
browser = 'unknown';
wenn Sie Express verwenden, können Sie das ua mit etwas wie folgt überprüfen:
app.get('/ua', function(req, res){
res.send('user ' + req.headers['user-agent']);
});
Versuchen Sie diesen Code http://detectmobilebrowser.com/
Hier ist eine andere: https://github.com/koudelka/node-useragent_parser
Ich habe kürzlich device-detector-js vor ein paar Monaten veröffentlicht.
Es ist ein TypeScript-Port des Matomo-Gerätedetektors, einer leistungsfähigen Geräteerkennungsbibliothek, die ursprünglich in PHP geschrieben wurde.
Es kann jeden Benutzeragenten analysieren und den Browser, das Betriebssystem, das verwendete Gerät (Desktop, Tablet, Mobile, TV, Autos, Konsole usw.), Marke und Modell erkennen.
Es wurde intensiv getestet und stützt sich auf über 6000 Tests, um Tausende verschiedener Geräte zu erkennen.
Installation
npm install device-detector-js
Beispiel - einfache Benutzeragentenerkennung:
const DeviceDetector = require("device-detector-js");
const deviceDetector = new DeviceDetector();
const userAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36";
const device = deviceDetector.parse(userAgent);
console.log(device);
Schauen Sie sich die vollständige API-Dokumentation an .
Die meisten Browser stellen einen HTTP-Anforderungsheader mit der Bezeichnung "User-Agent" bereit. Diese Eigenschaft entspricht der Eigenschaft navigator.userAgent auf der Clientseite.
Vielleicht möchten Sie einen Blick auf Apache DeviceMap werfen.
JavaScript-Bibliotheken sind derzeit auf der Client-Seite mehr, aber viele werden auf Node.JS oder Angular auf ähnliche Weise funktionieren. Im Gegensatz zum einfachen Musterabgleich von UA-Strings verfügt DeviceMap über ein breites Spektrum an Geräten und Gerätefamilien in seinem Device Description Repository (DDR), das auf W3C-Standards basiert.
Powerfull npm useragent . Mit Useragent können Sie die Benutzeragentenzeichenfolge mit hoher Genauigkeit analysieren, indem Sie manuell abgestimmte reguläre Ausdrücke für den Browserabgleich verwenden. Diese Datenbank wird benötigt, um sicherzustellen, dass jeder Browser korrekt analysiert wird, da jeder Browseranbieter ein eigenes Benutzeragentenschema implementiert. Aus diesem Grund haben normale Parser von Benutzeragenten große Probleme, da sie höchstwahrscheinlich den falschen Browsernamen analysieren oder die Version der Render-Engine mit der tatsächlichen Version des Browsers verwechseln.
[Hier ist eine andere Variation oder Assimilation für Ihre Überlegung.]
Es ist vielseitiger und weiter vereinfacht.
Sie können die Anforderung oder ein beliebiges Objekt mit einer 'headers'-Eigenschaft übergeben. Dies kann auch die headers-Eigenschaft sein. Sie können eine beliebige Bezeichnung auswählen, um nach dem Parameter im Objekt oder den Headern oder der eigentlichen Benutzeragentenzeichenfolge zu suchen.
Es hat das zuvor veröffentlichte Mobile- und Table-Checking-Regex verwendet und gibt dieses Ergebnis einfach zurück. Wenn Sie jedoch zuerst die Eingabe säubern, können Sie verschiedene Dinge einstecken.
Sie können sogar den standardmäßigen Regex, der optional als Argument passierbar ist, außer Kraft setzen. {Diese Erweiterung werde ich dem inspirierten überlassen.} Es könnte auch eine andere Möglichkeit bestehen, den global gespeicherten Benutzeragenten aus der Anforderung als Standard festzulegen.
mobTabCheck: function( ua, lbl, rgx ) { /* mobile tablet check; UserAgent or request, or any object with optional search label */
if( ua === und ) return false;
if( ua !== und && ua.constructor !== String ) {
if( lbl === und ) lbl = 'user-agent';
if( ua.headers !== und ) ua = ua.headers[ lbl ];
else ua = ua[ lbl ];
}
if( rgx === und ) rgx = /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/;
if( rgx.constructor === String ) rgx = new RegExp( rgx );
return rgx.test( ua );
}
Diese Regex stammt von hier ... https://Gist.github.com/dalethedeveloper/1503252/931cc8b613aaa930ef92a4027916e6687d07feac
Die 98% ige Lösung. Ich weiß nicht, ob Tabletten überprüft werden, wie mein Funktionstitel impliziert.
Eigentlich sollte der Titel dieser Funktion (und einige Argumente) vielleicht umbenannt werden? ... serachObjectForLabelThatMatchesThisRegex
mit Ausnahme aller Standardeinstellungen ist es eine einzige Sache, die nur für bestimmte Zwecke gedacht ist.
Auch lasse ich die Funktion als Schlüsselwert, den Sie speichern können, wie Sie möchten ... Versprechen Sie mir einfach keine var oder const, wenn Sie sie verwenden.
let mobTabCheck = function() {};
Ich habe den Code von etwas @ duck5auce verbessert, um wirklich nützlich zu sein und Unterstützung zu bieten IE 10-12 (Edge).
var getDevice = function(ua) {
var $ = {active: false, subactive: false};
if (/mobile/i.test(ua)) {
$.active = 'mobile';
$.Mobile = true;
}
if (/like Mac OS X/.test(ua)) {
$.active = 'iOS';
$.iOS = /CPU( iPhone)? OS ([0-9\._]+) like Mac OS X/.exec(ua)[2].replace(/_/g, '.');
if (/like Mac OS X/.test(ua)) {
$.subactive = 'iPhone';
$.iPhone = /iPhone/.test(ua);
}
if (/like Mac OS X/.test(ua)) {
$.subactive = 'iPad';
$.iPad = /iPad/.test(ua);
}
}
if (/Android/.test(ua)) {
$.active = 'Android';
$.Android = /Android ([0-9\.]+)[\);]/.exec(ua)[1];
}
if (/webOS\//.test(ua)) {
$.active = 'webOS';
$.webOS = /webOS\/([0-9\.]+)[\);]/.exec(ua)[1];
}
if (/(Intel|PPC) Mac OS X/.test(ua)) {
$.active = 'Safari';
$.Safari = /(Intel|PPC) Mac OS X ?([0-9\._]*)[\)\;]/.exec(ua)[2].replace(/_/g, '.') || true;
}
if (/Windows NT/.test(ua)) {
$.active = 'IE';
$.IE = /Windows NT ([0-9\._]+)[\);]/.exec(ua)[1];
}
if (/MSIE/.test(ua)) {
$.active = 'IE';
$.IE = /MSIE ([0-9]+[\.0-9]*)/.exec(ua)[1];
}
if (/Trident/.test(ua)) {
$.active = 'IE';
$.IE = /Trident\/.*rv:([0-9]+[\.0-9]*)/.exec(ua)[1];
}
if (/Edge\/\d+/.test(ua)) {
$.active = 'IE Edge';
$.IE = /Edge\/(\d+)/.exec(ua)[1];
}
return $.active + ' ' + $[$.active] + ($.subactive && ' ' + $.subactive + ' ' + $[$.subactive]);
};
Wenn Sie Mobile in der Templating-Ebene steuern möchten, habe ich gerade ein Modul dafür geschrieben . https://github.com/Fresheyeball/isMobile-node