Подключиться к веб-сокету с вводом пользователем номера порта - PullRequest
Новая
       7

Подключиться к веб-сокету с вводом пользователем номера порта

0 голосов
/ 09 июля 2020

Я пытаюсь создать приложение React js, в котором мой клиент вводит номер порта для подключения к фиктивной серверной части через элемент ввода и нажимаю кнопку, чтобы sh установить соединение через веб-сокет. Но он не будет подключаться к серверу localhost при нажатии кнопки.

Вот мой код: 

import React, {useState} from 'react'

let socket

function ServerPort() {

    const [port, setPort] = useState({number:""})
    const [connected, setConnected] = useState(false)

    let handleChange = (e) => {
        setPort({number: e.target.value})
    }

    let handleConnect = (e) => { 
        const portURL = "ws://localhost:"+port.number
        socket = new WebSocket(portURL.toString())
        console.log(portURL)
        if(socket.readyState === socket.OPEN){
            setConnected(true)
        }
    }

    return (  
        <div>
            <input onChange={handleChange} className="container" placeholder="Enter server port"></input>
            <button onClick={handleConnect} className="btn btn-primary">Connect</button>
            <label>Status: {connected ? "Connected" : "Disconnected"}</label>
        </div>
    );
  }
  
  export default ServerPort;`
...