Cài kết nối socket client trong react với nodejs

2021-07-14 2096 lượt xem

Mục lục [ hide ]

Cài đặt package cần thiết

dĩ nhiên muốn dùng socket kết nối đến nodejs thì chúng ta cần có socket.io-client.

mình hay dùng socket client 2.3 nên cách install như sau: (khá ổn định nếu bạn dùng server socket 2.3 )

npm i socket.io-client@^2.3.0

Cách cài đặt version mới nhất như sau: (khuyến nghị không nên dùng nếu bạn chưa rành socket)

npm i socket.io-client

Sau khi có rồi mình có thể chạy lệnh init rồi 😄

Code react

import React, { Component } from 'react'
import ReactDOM from 'react-dom'
/// soccket 
import socketIOClient from "socket.io-client"

class App extends Component {

    constructor(props) {
        super(props)
        const param = { query: 'token=' + jwt }
        const socket = socketIOClient('http://localhost:3000', param )
        console.log("connected ở đây không thành công đâu " + socket.connected);
        socket.on('connect', function() {
            console.log("Successfully connected!");
            if(socket.connected){
                console.log("connected ở đây sẽ thành công " + socket.connected);
            }
        })
        .on('error', function(error) {
            console.log(error, "có lỗi ")
        })
    }

    render() {
        
        return (
            <div className="AppComponent" id="Application">
                đây là app react
            </div>
        )
    }
}
export default App;

if (document.getElementById('example')) {
    ReactDOM.render(<App />, document.getElementById('example'));
}