如何检测 NestJs/NodeJs 中的浏览器详细信息

发布于 2025-01-20 15:55:59 字数 1843 浏览 3 评论 0原文

我正在尝试在我的应用程序中集成设备 - 浏览器NPM模块,以检测浏览器详细信息。为此,我正在使用此模块npm i设备 - detector-js

我已经集成了我的代码代码段。

以下是我的代码:

app.controller.ts

import { Controller, Get, Req } from '@nestjs/common';
import { AppService } from './app.service';

@Controller()
export class AppController {
  constructor(private readonly appService: AppService) {}

@Get()
getHello(@Req() req): string {
  console.log(req.headers);
  return this.appService.getHello();
  }
}

app.service.ts

import { Inject, Injectable } from '@nestjs/common';
import DeviceDetector = require("device-detector-js");

@Injectable()
export class AppService {
private readonly deviceDetector = new DeviceDetector();

getHello(): string {
const userAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81(Windows; Intel windows 8_8.1_10_11) Safari/537.36"; 
const result = this.deviceDetector.parse(userAgent);
console.log(JSON.stringify(result));
return 'Hello World!';
 }
}

output

[Nest] 23300  - 12/04/2022, 1:26:55 pm     LOG [RouterExplorer] Mapped {/test, GET} route +2ms
[Nest] 23300  - 12/04/2022, 1:26:55 pm     LOG [NestApplication] Nest application successfully started +4ms
{
  host: 'localhost:3000',
  connection: 'keep-alive',
  'cache-control': 'max-age=0',
  'sec-ch-ua': '" Not A;Brand";v="99", "Chromium";v="98", "Google 
 Chrome";v="98"',
  'sec-ch-ua-mobile': '?0',
 'sec-ch-ua-platform': '"Windows"',
 dnt: '1',
'upgrade-insecure-requests': '1',
'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) 
 AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.82 Safari/537.36'
}

它在使用,但在我使用Windows时不提供正确的信息它显示了Macintosh。为什么会发生这种情况?

I am trying to integrate device-detector npm module in my application in order to detect the browser details. For that I am using this module npm i device-detector-js

I have integrated as it is code snippet in my code.

Below is my code:

app.controller.ts

import { Controller, Get, Req } from '@nestjs/common';
import { AppService } from './app.service';

@Controller()
export class AppController {
  constructor(private readonly appService: AppService) {}

@Get()
getHello(@Req() req): string {
  console.log(req.headers);
  return this.appService.getHello();
  }
}

app.service.ts

import { Inject, Injectable } from '@nestjs/common';
import DeviceDetector = require("device-detector-js");

@Injectable()
export class AppService {
private readonly deviceDetector = new DeviceDetector();

getHello(): string {
const userAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81(Windows; Intel windows 8_8.1_10_11) Safari/537.36"; 
const result = this.deviceDetector.parse(userAgent);
console.log(JSON.stringify(result));
return 'Hello World!';
 }
}

Output

[Nest] 23300  - 12/04/2022, 1:26:55 pm     LOG [RouterExplorer] Mapped {/test, GET} route +2ms
[Nest] 23300  - 12/04/2022, 1:26:55 pm     LOG [NestApplication] Nest application successfully started +4ms
{
  host: 'localhost:3000',
  connection: 'keep-alive',
  'cache-control': 'max-age=0',
  'sec-ch-ua': '" Not A;Brand";v="99", "Chromium";v="98", "Google 
 Chrome";v="98"',
  'sec-ch-ua-mobile': '?0',
 'sec-ch-ua-platform': '"Windows"',
 dnt: '1',
'upgrade-insecure-requests': '1',
'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) 
 AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.82 Safari/537.36'
}

It's working but not giving correct info as I am using Windows but it's showing Macintosh. Why is this happening?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

一张白纸 2025-01-27 15:55:59

只需将标题从控制器传递到服务,类似的事情:

// controller
getHello(@Req() req): string {
  console.log(req.headers);
  return this.appService.getHello(req.headers);
}

// service
getHello(headers: {'user-agent': string }): string {
  const userAgent = headers['user-agent']; 
  const result = this.deviceDetector.parse(userAgent);
  console.log(JSON.stringify(result));
  return 'Hello World!';
}

Just pass headers from controller into service, something like this:

// controller
getHello(@Req() req): string {
  console.log(req.headers);
  return this.appService.getHello(req.headers);
}

// service
getHello(headers: {'user-agent': string }): string {
  const userAgent = headers['user-agent']; 
  const result = this.deviceDetector.parse(userAgent);
  console.log(JSON.stringify(result));
  return 'Hello World!';
}
枯叶蝶 2025-01-27 15:55:59

看来用户代理属性并不总是可用。

我发现了使用参数装饰器的小技巧,它有帮助:

export const UserAgent = createParamDecorator(
  (data: unknown, ctx: ExecutionContext): string => {
    const request = ctx.switchToHttp().getRequest();
    return request.headers['user-agent'];
  },
);

// in your controller :
getHello(@UserAgent() userAgent: string): string {
  console.log(userAgent);
  return this.appService.getHello({'user-agent': userAgent});
}

It seems that the user-agent attribute is not always available.

I found this small hack using a parameter decorator, it migh help :

export const UserAgent = createParamDecorator(
  (data: unknown, ctx: ExecutionContext): string => {
    const request = ctx.switchToHttp().getRequest();
    return request.headers['user-agent'];
  },
);

// in your controller :
getHello(@UserAgent() userAgent: string): string {
  console.log(userAgent);
  return this.appService.getHello({'user-agent': userAgent});
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文