如何使用js获取真实屏幕尺寸（屏幕分辨率）

Question

我只是想知道是否有一种方法可以在 js 中获取屏幕实际尺寸（屏幕分辨率）。

1. 我知道 screen API，但它的结果不是我想要的。

screen;
// Screen {availWidth: 1680, availHeight: 973, width: 1680, height: 1050, colorDepth: 30, …}

screen.width;
// 1680

screen.height;
// 1050

其中，我得到了 width: 1680, height: 1050;

实际上，屏幕尺寸是2880 x 1800；

my screenshots

所以，有人可以帮忙吗？

Answer 1

屏幕分辨率≠Window宽度
most os 改变屏幕 dpi 所以 screen.width mostly return 屏幕尺寸 os dpi 例如我的屏幕分辨率是 1920x1080 windows 默认 dpi 是 125 所以 js screen.width return 1600px

使用这个：

function getResolution() {
  const realWidth = window.screen.width * window.devicePixelRatio;
  const realHeight = window.screen.height * window.devicePixelRatio;
  console.log(`Your screen resolution is: ${realWidth} x ${realHeight}`);
}

// test
getResolution();
// Your screen resolution is: 3840 x 2160