无法在node.js中加载js和css文件

Question

这是html页面。我正在从node.js服务器即app.js调用此页面。在这里，我无法加载socket.io.js，bootstrap.js，bootstrap.css页面。

我的index.html：

<html>
<script type="text/javascript" src="/javascripts/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type ="text/javascript" src="/javascripts/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="/stylesheets/bootstrap.css" />


<div id="progressbar">
</div>

<script>
  var socket = io('http://localhost:8085');
  socket.on('connect', function(){});
  socket.on('message', function(data){
    $('#progressbar').progressbar({
    maximum: 100,
    step: JSON.parse(data).percent
    });
  });
  socket.on('disconnect', function(){});
</script>
</html>

我的app.js代码：

var app = express ();
var http = require('http').Server(app);
var io = require('socket.io')(http);
http.listen(8085, function(){
    console.log('listening on *:8085');
});

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', routes);
app.use('/users', users);

app.get('/', function (req, res) {
 res.sendfile(__dirname + '/index.html');
//res.send('Hello World!');

});

在萤火虫中，我正面临着

Answer 1

您为静态文件设置了错误的路径。

在您的情况下，您将需要使用以下代码：

app.use('/javascripts', express.static(__dirname + '/javascripts'));
app.use('/stylesheets', express.static(__dirname + '/stylesheets'));

现在， javascripts和样式表文件夹中的所有文件都将作为静态文件加载。

您当前使用静态文件的方法：

app.use(express.static(path.join(__dirname, 'public')));

这会将公共文件夹下的所有内容加载为静态文件，因此，如果要正常工作，则需要将javascripts和stylesheets文件夹移动到那里。

Answer 2

将您的视图引擎更改为html并修改如下代码：

app.set('views', path.join(__dirname, 'public'));
app.set('view engine', 'html');

并更改sendfile方法：

res.sendFile(path.join(__dirname, '../YOUR_FOLDER_NAME/public', 'index.html'));

EDITED ::

更改index.html文件：

<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<link rel="stylesheet" type="text/css" href="stylesheets/test.css" />

Answer 3

这是app.js。 （基于@Andrius的解决方案），我能够使其在http：// localhost：8085上运行。 index.html保持不变。

var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');
var cookieParser = require('cookie-parser');

var app = express();
var http = require('http').Server(app);
var io = require('socket.io')(http);
http.listen(8085, function(){
    console.log('listening on *:8085');
});

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
//app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());

//test
app.use('/javascripts', express.static(__dirname + '/javascripts'));
app.use('/stylesheets', express.static(__dirname + '/stylesheets'));

app.use(express.static(path.join(__dirname, 'public')));

//app.use('/', routes);
//app.use('/users', users);

app.get('/', function (req, res) {
 res.sendfile(__dirname + '/index.html');
//res.send('Hello World!');

});

无法在node.js中加载js和css文件

问题描述

3 个解决方案

解决方案1
1 2015-11-17 12:20:29

解决方案2
0 2015-11-17 12:16:53

解决方案3
0 2015-11-18 13:42:29

无法在node.js中加载js和css文件

问题描述

3 个解决方案

解决方案1 1 2015-11-17 12:20:29

解决方案2 0 2015-11-17 12:16:53

解决方案3 0 2015-11-18 13:42:29

解决方案1
1 2015-11-17 12:20:29

解决方案2
0 2015-11-17 12:16:53

解决方案3
0 2015-11-18 13:42:29