Node.js + Socket.io + Apache

Question

我正在尋找一種以下列方式集成 Node.js + Socket.io + Apache 的方法：我希望 apache 繼續提供 HTML/JS 文件。 我希望 node.js 偵聽端口 8080 上的連接。像這樣：

var util = require("util"),
    app = require('http').createServer(handler),
    io = require('/socket.io').listen(app),
    fs = require('fs'),
    os = require('os'),
    url = require('url');

app.listen(8080);

function handler (req, res) {

    fs.readFile(__dirname + '/index.html',
  function (err, data) {
    if (err) {
      res.writeHead(500);
      return res.end('Error loading index.html');
    }

    res.writeHead(200);
    res.end(data);
  });
}

io.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });

  socket.on('my other event', function (data) {
    socket.emit('ok 1', { hello: 'world' });
  });

  socket.on('clientMSG', function (data) {
    socket.emit('ok 2', { hello: 'world' });
  });

});

如果我訪問連接到此服務器的 HTML，它可以工作，但我需要轉到 mydomian.com:8080/index.html。 我想要的是能夠訪問 mydomian.com/index.html。 並能夠打開套接字連接：

<script>
        var socket = io.connect('http://mydomain.com', {port: 8080});
        socket.on('news', function (data) {
            console.log(data);
            socket.emit('my other event', { my: 'data from the client' });
        });

        socket.on('connect', function (data) {
            console.log("connect");
        });

        socket.on('disconnect', function (data) {
            console.log("disconnect");
        });


            //call this function when a button is clicked
        function sendMSG()
        {
            console.log("sendMSG"); 
            socket.emit('clientMSG', { msg: 'non-scheduled message from client' });
        }

    </script>

在這個例子中，當我轉到 URL 中的端口 8080 時，我不得不使用 fs.readFile 不起作用。

有什么建議？ Tks。

Answer 1

從 Apache 端口 80 提供靜態內容，並通過端口 8080 上的 Socket.IO 服務器提供動態/數據內容。您不需要 Socket.IO app = require('http').createServer(handler)

Apache 80 端口 |-------------| 客戶|------------| Socket.IO 端口 8080

var io = require('socket.io').listen(8080);

io.sockets.on('connection', function (socket) {
  io.sockets.emit('this', { will: 'be received by everyone'});

  socket.on('clientMSG', function (from, msg) {
    console.log('I received a private message by ', from, ' saying ', msg);
  });

  socket.on('disconnect', function () {
    sockets.emit('user disconnected');
  });
});

Answer 2

AWS + APACHE + NODEJS + SOCKET.IO + ANGULARJS

服務器端
這對我在端口 80 上運行 apache 和端口 8000 上運行 NodeJS 的生產服務器上工作。根據您想要的選項更改 NodeJS 端口......

1. 在 /var/www/html 為 NodeJS 服務器的文件創建一個名為“nodejs”的文件夾
2. 在與 80 不同的端口上運行 Nodejs，例如端口 8000
3. 執行命令：a2enmod proxy_http
4. 執行命令：a2enmod proxy_wstunnel

5. 將接下來的 2 行放在以下文件的末尾：/etc/apache2/apache2.conf

    LoadModule proxy_module /usr/lib/apache2/modules/mod_proxy.so LoadModule proxy_http_module /usr/lib/apache2/modules/mod_proxy_http.so

6. 將接下來的 12 行放在以下文件的末尾：/sites-available/000-default.conf
   （如果您創建了不同的站點，請將行放在那里）

    RewriteEngine On RewriteCond %{REQUEST_URI} ^socket.io [NC] RewriteCond %{QUERY_STRING} transport=websocket [NC] RewriteRule /{.*} ws://localhost:8000/$1 [P,L] RewriteCond %{HTTP:Connection} Upgrade [NC] RewriteRule /(.*) ws://localhost:8000/$1 [P,L] ProxyPass /nodejs http://localhost:8000/ ProxyPassReverse /nodejs http://localhost:8000/ ProxyPass /socket.io http://localhost:8000/socket.io ProxyPassReverse /socket.io http://loacalhost:8000/socket.io ProxyPass /socket.io ws://localhost:8000/socket.io ProxyPassReverse /socket.io ws://localhost:8000/socket.io

7. 須藤服務 apache2 重啟

客戶端
我使用以下庫在 AngularJS 中實現 Socket.io，但我認為本指南
對於 socket.io 技術的基本 Javascript 實現也很有用。

調用我的 PHP 服務器：example.com
調用 NodeJS 服務器：example.com/nodejs
調用NodeJS Socket：example.com <---這個調用將由庫默認完成

希望能幫到你！

Answer 3

您可以繼續從 Apache 提供頁面，但您需要在 node.js/socket.io 中啟用 CORS：

index.html（由 Apache 提供）

<script src = "https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.0/socket.io.js"></script>
<script>
   const socket = io("ws://your.domain.com:8080");
<script>

app.js（在 nodejs 中）：（啟用 CORS）

const express = require('express');
const app = express();
const http = require('http').Server(app);
const io = require('socket.io')(http, {
    cors: {
      origin: "*",
      methods: ["GET", "POST"]
    }
});

http.listen(8080);