即使节点服务器成功运行,index.html也未加载

时间:2015-08-31 12:53:04

标签: javascript angularjs node.js

我是AngularJS的新手,我使用$ http尝试了一段新代码。我已经安装了nodeJS并使用npm安装了express。当我在节点 - node server.js上运行server.js时,我会收到post post消息。但是当我尝试在浏览器中加载index.html时,我收到一条错误消息,指出它无法获取该文件。

我的代码: 的 server.js

var express = require('express'), app = express();
//
//app.configure(function(){
//    app.use(express.static(__dirname,'/'));
//});
app.listen(8080, 'localhost');

app.get('/customers/:id', function(req,res){
    var customerid = parseInt(req.params.id);
    var data = {};

    for(var i=0, len = customers.length;i<len;i++){
        if(customers[i].id === customerid) {
            data = customers[i];
            break;
        }
    }
    res.json(data);
});

app.get('/customers', function(req, res){
    res.json(customers);
});



console.log('Express listening on port 8080');

var customers = [
            {
                id:1,
                joined: '2012-09-12', 
                name: 'John', 
                city:'Chandler', 
                orderTotal: 22.8699,
                orders: [ 
                    {
                        id: 1,
                        product:'shoes',
                        total: 9.9956
                    },
                    {
                        id:2,
                        product: 't-shirts',
                        total: 12.8743
                    }
                ]
            },
            {
                id:2,
                joined: '2010-12-02', 
                name: 'Tina', 
                city:'New York City', 
                orderTotal: 10.345,
                orders: [ 
                    {
                        id:1,
                        product: 'shoes',
                        total: 10.345
                    }
                ]
            }, 
            {
                id:3,
                joined: '2013-10-25', 
                name:'Dave', 
                city:'Seattle', 
                orderTotal: 15.534,
                orders: [
                    {
                        id:1,
                        product: 'shoes',
                        total: 8.453
                    },
                    {
                        id:2,
                        product: 'shorts',
                        total: 7.081
                    }

                ]
            }, 
            {
                id:4,
                joined: '1998-01-15', 
                name:'Zed', 
                city:'Las Vegas', 
                orderTotal: 20.9305,
                orders:[
                    {
                        id:1,
                        product: 'shirts',
                        total: 10.9484
                    },
                    {
                        id:2,
                        product: 't-shirts',
                        total: 9.9821
                    }
                ]
            }
        ];

的index.html

<!doctype html>

    <html ng-app="myApp">
        <head>
            <title>Routing Demo</title>
            <link type="text/css" href="css/styles.css" rel='stylesheet'/>
        </head>
        <body>
            <div ng-view></div>

            <script type="text/javascript" src='scripts/angular.js'></script>
            <script src="scripts/angular-route.js"></script>
            <script type="text/javascript" src='app/app.js'></script>
            <script type="text/javascript" src='app/services/customersService.js'></script>
            <script type="text/javascript" src='app/controllers/customerCtrl.js'></script>
            <script type="text/javascript" src='app/controllers/ordersCtrl.js'></script>
            <script type="text/javascript" src='app/services/values.js'></script>


        </body>
    </html>

请指导我哪里出错了。我是新手,所以请帮忙。

发布目录结构的图片 enter image description here

2 个答案:

答案 0 :(得分:1)

要为您需要添加的服务器静态文件添加:

app.use(express.static('public'));

documentation

中所述

当然,您可以使用除'public'之外的任何其他目录,具体取决于静态文件的位置。

答案 1 :(得分:0)

感谢您的帮助。我可以通过添加第app.use(express.static(__dirname,'/'))行并将其更改为app.use(express.static(__dirname))

来解决此问题

再次感谢