it-swarm.com.de

serverseitige Browsererkennung? node.js

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. 

51
fancy
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.

77
McKayla

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.

28

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.

13
Donald Gary

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
4
Bryant Williams
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';
3
Nino Paolo

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']);
});
2
BHBH

Versuchen Sie diesen Code http://detectmobilebrowser.com/

1
tomislav
1
user1113641

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 .

1
Etienne Martin

Die meisten Browser stellen einen HTTP-Anforderungsheader mit der Bezeichnung "User-Agent" bereit. Diese Eigenschaft entspricht der Eigenschaft navigator.userAgent auf der Clientseite.

1
Maz

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.

0
Werner Keil

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.

0
Jomy Joseph

[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() {};
0
Master James

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]);
};
0
EvgenyKolyakov

Wenn Sie Mobile in der Templating-Ebene steuern möchten, habe ich gerade ein Modul dafür geschrieben . https://github.com/Fresheyeball/isMobile-node

0
Fresheyeball