如何使用 Node.js 和 Angular.js 获取外部文件答案

【问题标题】：How to get the external files using Node.js and Angular.js如何使用 Node.js 和 Angular.js 获取外部文件
【发布时间】：2016-07-01 11:20:53
【问题描述】：

我无法使用 Node.js 获取包含在索引页面中的外部文件链接。这是我的代码。

server.js：

var port=8888;
var express=require('express');
var http=require('http');
var morgan         = require('morgan');
var bodyParser     = require('body-parser');
var methodOverride = require('method-override');
var expressSession = require('express-session');
var cookieParser = require('cookie-parser'); // the session is stored in a cookie, so we use this to parse it
var app            = express();
var server=http.createServer(app);
var io=require('socket.io')(server);
//var admin=require('./route/route.js');
app.use(express.static(__dirname + '/public'));     // set the static files location /public/img will be /img for users
app.use(morgan('dev'));                     // log every request to the console
app.use(bodyParser.urlencoded({ extended: false }))    // parse application/x-www-form-urlencoded
app.use(bodyParser.json())    // parse application/json
app.use(methodOverride());                  // simulate DELETE and PUT
app.use(cookieParser());
app.use(expressSession({secret:'odiyaDoctor'}));
app.get('/admin',function(req,res){
    res.sendfile('admin/view/index.html');
});
server.listen(port);   
console.log('Magic happens on port'+port);          // shoutout to the user

让我展示一下我的文件夹结构：

root-
  ->admin
      ->js
         ->angular.min.js
      ->css
         ->style.css
         ->responsive.css
      ->view
         ->index.html
      ->public
   ->server.js
   ->package.json

根据上面的结构，在根文件夹内我有一个名为admin 的文件夹。在 admin 文件夹中，有 css,js,view etc 之类的文件夹来包含相应的文件。

admin/view/index.html:

<!DOCTYPE html>

<head ng-app="doctorAdmin">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to Odia Doctor Admin Panel</title>

<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,500,700,900' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css' />
<link rel="shortcut icon" href="img/favicon.png" type="image/x-icon">
<!-- Styles -->
<link rel="stylesheet" href="font-awesome-4.2.0/css/font-awesome.css" type="text/css" /><!-- Font Awesome -->
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" /><!-- Bootstrap -->
<link rel="stylesheet" href="css/style.css" type="text/css" /><!-- Style -->
<link rel="stylesheet" href="css/responsive.css" type="text/css" /><!-- Responsive -->  
<script src="js/angular.min.js" type="text/javascript"></script>
<script src="adminController/loginController.js" type="text/javascript"></script>
</head>
<body style="background-image: url('images/resource/login-bg.jpg')">
    
<div class="login-sec" ng-controller="loginController">
    <div class="login-sec">
    <div class="login">
        <div class="login-form">
            <span><img src="images/logo.png" alt="" /></span>
            <h5><strong>Identify</strong> Yourself</h5>
            <form action="#" method="post">
                <fieldset><input type="text" placeholder="Username" class="logininputdiv" /><i class="fa fa-user"></i></fieldset>
                <fieldset><input type="password" placeholder="Password" class="logininputdiv" /><i class="fa fa-unlock-alt"></i></fieldset>
                <label><input type="checkbox" />Remember me</label><button type="button" class="blue" onClick="document.location='dashboard.html'">LOG IN</button>
            </form>
        </div>
        <span>Copyright © 2015 Odia Doctor</span>
    </div>
</div><!-- Log in Sec -->   

</body>

</html>

在上面的文件中，我包含了一些链接，但我的问题是我无法获取这些链接。

【问题讨论】：

标签： javascript angularjs node.js

【解决方案1】：

将所有链接添加到公用文件夹中，因为您在 server.js 中设置了以下代码

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

这意味着您的所有外部文件都在公用文件夹中具有相对路径，如果您不想将 css 文件夹放在公用文件夹中，则将其放在公用文件夹中，而不是在下面的代码中设置

app.use(express.static(__dirname));

【讨论】：

我按照你的要求做了。我将所有 css,js etc 文件夹放入 admin/public 文件夹并包含类似 <link rel="stylesheet" href="css/style.css" type="text/css" /> 的链接，但仍然遇到同样的问题。
添加并尝试
我按照你的方法添加了，但还是同样的问题。
你能给我这个输出吗？ 'console.log('__dirname);'
我是这样做的app.use(express.static(__dirname + '/admin/public'));。得到了结果。