如何用Next.js检测React SSR App上的设备？

const express = require('express');
const next = require('next');

const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare().then(() => {
  const server = express();

  server.all('*', (req, res) => {
    return handle(req, res);
  });

  server.listen(3000, (err) => {
    if (err) throw err;
    console.log('> Ready on http://localhost:3000');
  });
});

npm install ua-parser-js

const parser = require('ua-parser-js');

server.all('*', (req, res) => {
  const userAgent = parser(req.headers['user-agent']);
  req.deviceType = userAgent.device.type || 'desktop'; // 可能的值有 'mobile', 'tablet', 'desktop', 或者 'bot'

  return handle(req, res);
});

export async function getServerSideProps(context) {
  const { deviceType } = context.req;

  return {
    props: {
      deviceType,
    },
  };
}

function MyPage({ deviceType }) {
  return (
    <div>
      <h1>Device Type: {deviceType}</h1>
    </div>
  );
}

export default MyPage;