index.js
var app = require('express')();
var path = require('path');
var server = require('http').Server(app);
var io = require('socket.io')(server);
var users = [];
connections = [];
server.listen(process.env.PORT || 3000);
app.use(require('express').static(path.join(__dirname)));
console.log('server running');
app.get('/', function(req, res){
res.sendfile(__dirname + '/index.html');
});
io.on('connection', function (socket) {
var addedUser = false;
socket.on('new post', function(post){
console.log(post);
socket.emit('posted', data);
});
});
client.js
$(function(){
function submit(){
socket.emit('new post', $("#text").val());
console.log("submitted");
}
function addPost(data){
console.log(2);
var $post = $('<p></p>').text(data);
console.log($post);
$("#posts").append($post);
}
$("#submit").on("click", function(){
submit();
});
socket.on('posted', function(data){
console.log(1);
addPost(data);
});
});
的index.html
<html>
<head>
<title>title</title>
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<input type="text" id="text">Input</input>
<button id="submit">Submit</button>
<script src="client.js"></script>
<br>
<br>
<br>
<div id="posts"></div>
<script>
var socket = io();
</script>
</body>
</html>
当我启动服务器时,控制台记录&#34;服务器正在运行&#34;精细。我无法通过提交帖子按钮执行任何操作。没有调试控制台消息出现,也没有任何反应。它应该发出新的帖子&#34;单击提交按钮但看起来好像什么都没有通过
答案 0 :(得分:0)
我能够让你的代码在我自己的计算机上运行,如下所示:
index.js
var express = require('express');
var app = express();
var path = require('path');
var server = require('http').Server(app);
var io = require('socket.io')(server);
var users = [];
connections = [];
app.get('/', function(req, res){
res.sendFile(path.join(__dirname, 'index.html'));
});
app.use(express.static(__dirname));
console.log('server running');
io.on('connection', function (socket) {
console.log("connection");
socket.on('new post', function(post){
console.log(post);
socket.emit('posted', post);
});
});
server.listen(process.env.PORT || 3000);
client.js
$(function(){
function submit(){
socket.emit('new post', $("#text").val());
console.log("submitted");
}
function addPost(data){
console.log(2);
var $post = $('<p></p>').text(data);
console.log($post);
$("#posts").append($post);
}
$("#submit").on("click", function(){
submit();
});
socket.on('posted', function(data){
console.log(1);
addPost(data);
});
});
的index.html
<html>
<head>
<title>title</title>
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<input type="text" id="text">Input</input>
<button id="submit">Submit</button>
<script src="/client.js"></script>
<br>
<br>
<br>
<div id="posts"></div>
<script>
var socket = io();
</script>
</body>
</html>
对index.js的更改
express
变量,以便可以重复使用。app.get()
之前定义app.use(express.static(...))
,因此我们确保使用app.get()
提供index.html,而不是静态位置。res.sendfile()
更改为res.sendFile()`socket.emit("posted", data)
更改为socket.emit("posted", post)
。server.listen()
移至结束。path.join()
电话中移除express.static()
,因为那里不需要。{/ li>
path.join()
到res.sendFile()
要求跨平台安全。其中,唯一一个我确定导致错误的是#4,其他人都是很好的管家。
对client.js的更改
无
对index.html的更改
将client.js的路径更改为/client.js
。
如果此代码在heroku上不起作用,那么您要么没有在正确的目录中放置文件,要么没有正确配置heroku以允许您的app或socket.io正常工作。如果我是你,我会先验证这段代码是否可以在你自己的本地计算机上运行,然后在heroku上尝试先消除变量。