Javascript 如何在服务器端渲染期间检查窗口/块宽度？

我有一个带有服务器端渲染的react应用程序。我在组件中使用window对象来获得窗口宽度并将元素放置在页面的中心。当我使用ssr时，控制台中出现错误，

窗口未定义

如何删除此错误，或者如何获取窗口或块宽度并在渲染期间使用它？ 以下是我的组件的代码：

import React, { Component } from 'react';
import autoBind from 'react-autobind';

import SectionBackground from '../SectionBackground';

import Styles from './styles.scss';

export default class Section extends Component {
  constructor(props) {
    super(props);
    autoBind(this);
    this.state = {     
      windowWidth: 0,
      circleSecondLine: 0,
      circleThirdLine: 0,
    };
  }

  componentDidMount() {       
    window.addEventListener('resize', this.handleResize);
  }

  componentWillUnmount() {
    window.removeEventListener('resize', this.handleResize);
  }

  setCenterPosition() {    
     return this.state.width ? this.state.width / 2 : window.innerWidth / 2;
  }

  setLine() {
    let lineVPosiotion = 0;
    const { innerWidth } = window;
    if (innerWidth <= 768) {
      lineVPosiotion = 62;
    } else if (innerWidth <= 1023) {
      lineVPosiotion = 200;
    } else {
      lineVPosiotion = 300;
    }
    const coords = `M${this.state.width},0 v${lineVPosiotion}`;
    return coords;
  }

  handleResize() {
    this.setState({
      windowWidth: window.innerWidth,
    });
    this.setLine();  
  }

  render() {
    const sectionTemplate = {       
      setLine: this.setChatLine,     
      setCenterCircle: this.setCenterPosition,
    };
    return (
      <div className={Styles['anim-background']} ref={this.ref}>
        <SectionBackground {...sectionTemplate} />
      </div>
    );
  }
}

import React，{Component}来自'React'；
从“反应自动绑定”导入自动绑定；
从“../SectionBackground”导入SectionBackground；
从“/Styles.scss”导入样式；
导出默认类节扩展组件{
建造师（道具）{
超级（道具）；
自动绑定（本）；
this.state={
窗宽：0，
circleSecondLine:0，
圆形第一线：0，
};
}
componentDidMount（）{
window.addEventListener（'resize'，this.handleResize）；
}
组件将卸载（）{
window.removeEventListener（'resize'，this.handleResize）；
}
setCenterPosition（）{
返回this.state.width？this.state.width/2:window.innerWidth/2；
}
设定线（）{
设LineVposition=0；
常量{innerWidth}=窗口；
如果（innerWidth在服务器端运行代码时，它实际上不知道窗口或文档。您需要全局注册窗口。为此，您可以在
package.json
的启动脚本中包含
jsdom global/register
，并且在启动服务器之前，您可以确保窗口实例全局可用

“开始”：“jsdom全局/注册节点。/dist/server”

首先安装以下软件包：

“jsdom”：“11.11.0”，
“jsdom global”：“3.0.2”

希望这能起作用！
在服务器渲染过程中，在setCenterPosition（）中，您在哪一行得到的
窗口未定义
错误？实际上，在使用窗口的每一行中，您都可以尝试
setCenterPosition（）{if（typeof window==“undefined”）{return 0；}否则{return this.state.width？..}
。在服务器端渲染时，您无法了解窗口的任何信息。是否有其他方法可以在块上获得中心？我的意思是用其他内容替换窗口。我不确定。我认为这取决于它在浏览器中的渲染方式，因此很难在服务器上预先确定。