我正在尝试将socket.io与nextjs一起使用，但我的代码被执行了两次

Question

因此，当我尝试连接到我的服务器或发出事件并触发所有事件两次时，我将 socket.io 与 nextjs 和express 作为后端一起使用

我什至尝试添加 if (typeof window !== 'undefined') 但它仍然触发两次

import Navbar from "@/components/navbar";
import { fetchUserInfo } from "@/utils/fetchUserInfo";
import { io } from 'socket.io-client';
import { config } from 'dotenv';
import getSocket from "@/components/getSocket";
config({path: '../.env.development.local'})
 
export async function getServerSideProps(context){
    const { cookie } = context.req.headers;
 
    if (context.req.cookies['gameStatus'] === undefined){
        return{
            notFound: true
        }
    }
    else{
        const {displayName, userAvatar, isCookieAvailable}  = await fetchUserInfo(cookie)
 
        return{
            props: {
                displayName, userAvatar, isCookieAvailable
            }
        }
    }
}
 
export default function Game({displayName, userAvatar, isCookieAvailable}){
    if (typeof window !== 'undefined'){
        const socket = io(process.env.NEXT_PUBLIC_SERVER_URL)
        console.log('here')
        socket.emit('event', 'eventlog')
    }
 
    return(
        <>
            <Navbar displayName={displayName} userAvatar={userAvatar} isCookieAvailable={isCookieAvailable}/> :
            {!isCookieAvailable && <div style={{color: 'white'}}>Not logged in please login</div>}
        </>
    )
}

Answer 1

几天后我自己找到了答案，原因原来是严格模式，如果你把它关掉它就可以完美工作，没有任何问题

https://nextjs.org/docs/pages/api-reference/next-config-js/reactStrictMode