1. 程式人生 > >Nodejs入門基礎(socket即時通訊)

Nodejs入門基礎(socket即時通訊)

socket.html--前端頁面,可以輸入內容傳遞給index.js進行接收
index.js--獲取前端頁面的資訊並處理返回值給前端頁面

socket.html

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h2>即時通訊demo</h2>
<input type="text" name="msg" id="msg"/><br>
<input type="button" value="傳送" onclick="fs()"/>
<!--引用Io包,規定的寫法,如果沒有安裝則需要伺服器進行下載 npm install socket.io --save-->
<script src="/socket.io/socket.io.js"></script>
<script>
    var socket = io();
    /*連線後臺*/

    //傳遞給後臺的資訊
    function fs() {
        //獲取資訊賦值給msg
        var msg = document.getElementById("msg").value;
        console.log(msg);
        //傳遞值到後臺
        socket.emit("askmessage", msg);
    }

    //接受後臺傳遞過來的資訊
    socket.on("message", function (msg) {
       console.log(msg);
    });
</script>
</body>
</html>

index.js

 

var http = require("http");//引入http包資訊
var fs = require("fs");//引入fs


var server = http.createServer(function (req, res) {//建立服務
    if (req.url == "/") {//判斷輸入的如果是根目錄
        fs.readFile("./socket.html", function (err, data) {
            res.end(data);//預設首頁socket.htm;
        });
    }
});
server.listen(3000);//伺服器開啟埠

var io = require("socket.io").listen(server);//匯入io

//io監聽,如果有人連線的時候提示資訊
io.on("connection", function (socket) {
    console.log("測試有人連線了");

    //定義事件,讓前端觸發並反饋值到後端
    socket.on("askmessage", function (msg) {
        console.log(msg);

        //傳遞給前臺的資訊
        socket.emit("message","豪哥愛玲姐");
    });
});