需要在JS文件之前加载和显示HTML文件,express.static不提供HTML文件

时间:2017-01-01 21:25:33

标签: javascript express

在我的server.js文件中,我有以下

var path = require('path');
var express = require('express');
var app = express();
var htmlRoutes = require('./app/routing/routes.js')(app, path, express);

在我的route.js

module.exports = function(app, path, express){

    app.use(express.static(__dirname + '/../public'));

    //also tried doing 
    //app.use('/', express.static(__dirname + '/../public'));

    app.listen(10003, function(){
        console.log('connected on 10003')
    })
}

我不知道为什么我一直在浏览器上收到“无法获取/”的消息。我的目录布局如下

dir main
    -server.js
    dir subMain
      dir routing
        -routes.js
      dir public
        -home.html
        -list.html

我想要做的是,当我运行'node server.js'时,我想在routes.js文件之前加载并显示home.html页面。这是因为我需要加载文档以便我可以使用jquery选择器'$'并在home.html中选择一个按钮类并给它一个click事件,该事件将对'/ list'进行AJAX调用以显示list.html

我也尝试过做

module.exports = function(app, path, express){

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

    app.use(function(request, response, next){
        response.sendFile(path.resolve(__dirname + '/../public/home.html'));
    })

    app.listen(10003, function(){
        console.log('connected on 10003')
    })
}

但是我收到以下错误

  

未捕获的SyntaxError:意外的标记<

我也尝试过多行express.static

module.exports = function(app, path, express){
    //loading the directory with the home.html
    app.use(express.static(path.join(__dirname + '..', 'public')));
    //loading directory with server.js by going up two level, from routing directory -> app -> main (has server.js)
    app.use(express.static(path.join(__dirname + '..', '..')))

    app.listen(10003, function(){
        console.log('connected on 10003')
    })
}


//Edit, added jquery event handler for button click on home.html
$(document).on('click', '.btn', sendSurvery);

    function sendSurvery(){

        var myQueryUrl = "http://localhost:10003/survey";

        $.ajax({url: myQueryUrl, method: 'GET'}).done(function(response){

        });
    }

但我仍然得到消息不能GET /。我需要首先显示home.html,以便加载那里的jquery库,这样我就可以选择按钮并在click事件上发送survey.html  我忘了我的目录public和routing在一个名为subMain

的子文件夹中

1 个答案:

答案 0 :(得分:0)

试试这个

您的服务器文件应该如下所示

    var path = require('path');
var express = require('express');
var app = express();

require('./subMain/routing')(app, path, express);
    app.listen(9000, function(){
      console.log('connected on 9000')
    })

另外,将routes.js的名称更改为index.js。将其保留在路由文件夹中(不要更改名称)。以下代码应该在那里。我也改变了你的端口号。不应该那么高。

      module.exports = function(app, path, express){
    app.use(express.static(__dirname + "/public"));
    app.use(function(request, response, next){
      response.sendFile(process.cwd() + "/subMain/public/home.html");
    })
}

我已经在github repo上发布了所有内容,因此您可以看到文件结构。

https://github.com/eliezerwohl/stackoverflowAnon