我在letschat 文件夹中有index.html、css 和js 文件。运行 node express 服务器后,它不会加载 css 和 js 文件。我正在提供 server.js 代码。请让我知道如何解决这个问题。
var express = require('express');
var app = express();
var server = require('http').createServer(app);
var io = require('socket.io').listen(server);
users = [];
connections = [];
app.use("/letschat",express.static(__dirname + '/letschat'));
app.listen(process.env.PORT || 3000);
console.log('Server running....');
app.get('/letschat', function(req, res){
res.sendFile(__dirname + '/index.html');
});
我的 index.html ---
enter code here
<script src="http://code.jquery.com/jquery-2.1.0-rc1.min.js"></script>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="/letschat/chat.js"></script>
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<style>
body{
background: skyblue;
margin:0px;
}
.chat_box,.msg_box{
position: fixed;
cursor: pointer;
bottom:0px;
background: white;
right:20px;
width:250px;
border-radius: 5px 5px 0px 0px;
}
.chat_head,.msg_head{
background:#3498db;
padding: 15px;
color:white;
border-radius: 5px 5px 0px 0px;
}
.chat_body{
height:300px;
}
.user{
cursor: pointer;
padding :20px;
position: relative;
}
.user:hover{
background: orange;
}
.user:before{
content:"";
position:absolute;
background: green;
width:10px;
height:10px;
left:6px;
top:25px;
border-radius: 5px;
}
.msg_box{
width:250px;
background: white;
height: 300px;
bottom:-5px;
}
.close{
float: right;
}
.msg_body{
background: white;
font-size: 14px;
width: 250px;
height: 200px;
overflow: auto;
overflow-x: hidden;
}
.msg_footer{
}
.msg_input {
border: transparent;
border-top: 2px solid green;
width: 100%;
padding: 5px;
-webkit-box-sizing: border-box;
-moz-box-sizing:border-box;
box-sizing: border-box;
}
.msg_a{
margin-left: 20px;
padding: 15px;
background: orange;
position: relative;
}
.msg_a:before{
content: "";
position: absolute;
width: 0px;
left: -30px;
top :10px;
height: -9px;
border: 15px solid;
border-color: transparent orange transparent transparent;
}
.msg_b{
margin-right: 20px;
padding: 15px;
background: skyblue;
position: relative;
}
.msg_b:before{
content: "";
position: absolute;
width: 0px;
right:-30px;
top :10px;
height: -9px;
border: 15px solid;
border-color: transparent transparent transparent skyblue ;
}
</style>
</head>
<body>
<div>TODO write content</div>
<div class="chat_box">
<div class ="chat_head"> Chathead </div>
<div class ="chat_body">
<div class="user" >Sunil Kumar</div>
</div>
</div>
<div class="msg_box" style="right:300px">
<div class="msg_head">Sun
<div class="close">x</div>
</div>
<div class="msg_wrap">
<div class="msg_body">
<div class="msg_a">This is from a</div>
<div class="msg_b">This is from b</div>
<div class="msg_insert"></div>
</div>
<div class="msg_footer"><textarea class="msg_input" rows="4">sample</textarea></div>
</div>
</div>
<script>
$(函数(){
var socket = io.connect();
和我的 jquery 文件
在此处输入代码
$(文档).ready(函数(){
$('.chat_head').click(function(){
$('.chat_body').slideToggle('slow');
});
$('.msg_head').click(function(){
$('.msg_box').slideToggle('slow');
});
$(".close").click(函数(){
$('.msg_box').hide();
});
$(".user").click(function(){
$('.msg_wrap').show();
$('.msg_box').show();
});
应用程序仍处于初始开发阶段。我正在尝试使用聊天框在 node express 上托管 3 个文件。但 jquery 无法运行。请让我知道要执行的程序。