简体   繁体   English

无法使用Node,Express和EJS连接到Socket IO

[英]Cannot connect to Socket IO with Node, Express, and EJS

I am not connecting to Socket IO in my node app and I believe it has something to do with my EJS configuration and how I am rendering index.ejs and layout.ejs files: 我没有在节点应用程序中连接到Socket IO ,我相信它与EJS配置以及我如何渲染index.ejslayout.ejs文件有关:

When I connect to Socket IO I want to console log that a user has been connected: 当我连接到Socket IO我要控制台控制台记录用户已连接:

io.sockets.on('connection', (socket) => {
  console.log('user is connected')

  socket.on('send-message', (data) => {
    io.sockets.emit('new-message', data)
  })

Here is how I handle the backend when I go to localhost:3000 here is my code: 这是我进入localhost:3000时如何处理后端的代码:

app.get('/', (req, res) => {
  res.render('index')
})

But when I go to localhost:3000 it does not console that a user has been connect to Socket IO 但是,当我转到localhost:3000它不会控制台用户已连接到Socket IO

I tried this as well: 我也尝试过这个:

app.get('/', (req, res) => {
  res.sendFile('index.ejs', {root:__dirname})
})

and also 并且

app.get('/', (req, res) => {
  res.sendFile(process.env.PWD+'/client/views/index.ejs')
})

but I still do not connect. 但我仍然没有连接。

Any ideas what I need to do? 有什么想法我需要做什么?

More Code: 更多代码:

server/app.js 服务器/ app.js

const
    express = require('express'),
    app = express(),
    server = require('http').createServer(app),
    io = require('socket.io').listen(server),
    ejs = require('ejs'),
    ejsLayouts = require('express-ejs-layouts'),
    mongoose = require('mongoose'),
    ...
    ...

// environment port
const
    port = process.env.PORT || 3000,
    mongoConnectionString = process.env.MONGODB_URL || 'mongodb://localhost/context-app'

    mongoose.connect(mongoConnectionString, (err) => {
      console.log(err || "Connected to MongoDB (context-app)")
    })

// ejs configuration
app.set('view engine', 'ejs')
app.set('views', process.env.PWD+'/client/views');
app.use(ejsLayouts)

app.get('/', (req, res) => {
  res.render('index')
})

io.sockets.on('connection', (socket) => {
  console.log('user is connected');

  socket.on('send-message', (data) => {
    io.sockets.emit('new-message', data)
  })
})

server.listen(port, (err) => {
  console.log(err || 'listening on my very special port ' + port)
})

client/views/layout.ejs 客户端/视图/layout.ejs

<!-- /views/layout.ejs -->
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>React Intro</title>
  <!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <script>...</script>
  <script>...</script>
  <script>
    var socket = io();
  </script>
</head>
<body>
  <% include partials/nav %>
    <div class="container">
        <%- body %>
    </div>
</body>
</html>

client/views/index.ejs 客户端/视图/index.ejs

<div id="main"></div>

<script type="text/babel" src="../app.js"></script>

EDIT: SOLUTION 编辑:解决方案

The problem was on the client side: I simply forgot to load the Socket IO script: <script src="/socket.io/socket.io.js" charset="utf-8"></script> 问题出在客户端:我只是忘了加载Socket IO脚本: <script src="/socket.io/socket.io.js" charset="utf-8"></script>

确保您正在客户端上加载socket.io脚本:

<script src="/socket.io/socket.io.js" charset="utf-8"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM