Express.js + angularjs 分离路由答案

【问题标题】：Experess.js + angularjs separate routingExpress.js + angularjs 分离路由
【发布时间】：2015-11-07 17:26:27
【问题描述】：

我在尝试设置 express + angular 应用时遇到问题。

我可以将资产文件加载到其中。

我将在此处发布我的 express 和 html 文件中的代码。据我所知，Express 只返回 index.html 文件，没有其他任何内容，使所有路由都返回该文件。

这里是快递代码：

//server.js

// set up ========================
var express = require('express'),
    bodyParser = require('body-parser'),
    morgan = require('morgan'),
    path   = require('path'),
    app    = express(),
    mongoose = require('mongoose'),
    jwt    = require('jsonwebtoken'), // used to create, sign, and verify tokens
    config = require('./config'), // get our config file
    User   = require('./model/users'), //get our mongo model
    routes = require('./middleware/routes'); 

// configuration =================
//var port = process.env.PORT || 8080;
app.use(express.static('/client'));
app.use(morgan('dev'));
app.use(bodyParser.urlencoded({'extended':'true'}));          
app.use(bodyParser.json());                                    
app.use(bodyParser.json({ type: 'application/json' }));
mongoose.connect(config.database);
app.set('superPin', config.secret);
// start server =================
//
app.listen(8080);
console.log('App strated and is listening on the port 8080');
//
app.get('/checkServer', function(request,response){
    response.send('Works fine. Server started at default get routing to check if server runns.');
});
//
app.get('*',function(request,response){
    response.sendFile(path.resolve('../client/view/index.html'));
});
//
//exports = module.exports = app;

这是我的 index.html 文件：

<!DOCTYPE html>
<html>
  <head>
    <title>My </title>
  </head>
  <body ng-app="pmt">
    <div ng-view></div>
    <script src="client/assets/vendor/angular/angular.min.js"></script>
    <script src="client/assets/vendor/angular-bootstrap/ui-bootstrap.min.js"></script>
    <script src="client/assets/vendor/angular-message/angular-message.min.js"></script>
    <script src="client/assets/vendor/angular-touch/angular-touch.min.js"></script>
    <script src="client/assets/vendor/angular-ui-router/angular-ui-router.min.js"></script>
    <script src="client/assets/vendor/angular-touch/angular-touch.min.js"></script>
    <script src="client/assets/vendor/moment/min/moment.min.js"></script>
    <script src="client/controller/routes.js"></script>
  </body>
</html>

我现在将从我的文件夹结构中添加一个打印屏幕：

这里是回购的链接：https://bitbucket.org/cojok/pmt/

我看到了其他相关的帖子，但我无法找到我做错了什么。

我在浏览器中收到此错误

【问题讨论】：

你到底想做什么？你想要服务器端路由还是角度路由？
无法理解您做错了什么，需要帮助？
我正在尝试进行角度路由，但我无法加载我需要的文件。我总是收到这个愚蠢的错误，Uncaught SyntaxError: Unexpected token

标签： javascript angularjs express url-routing

【解决方案1】：

据我了解您的问题是您无法弄清楚如何在视图中链接文件或如何在目录上设置文件路由，因此您可以在此处执行此操作添加目录，如

app.use(express.static(path.join(__dirname, 'scripts')));
app.use(express.static(path.join(__dirname, 'Content')));
app.use(express.static(path.join(__dirname, 'Angular')));
app.use(express.static(path.join(__dirname, 'Views/Main')));
app.use(express.static(path.join(__dirname, 'Views/Authentication')));

作为内容，角度和脚本是根目录，并将 jquery 文件引用为

<script src="angular-resource.js"></script> //in angular folder on root
<script src="angular-ui-router.js"></script> //in script folder on root
<script src="/Controllers/MainController.js"></script> // in angular folder with child directories

【讨论】：

【解决方案2】：

我发现了我的错误，或者这可能只是一个修复。但实际上改变了这一点

 app.use(express.static('/client'));
 app.get('*',function(request,response){
    response.sendFile(path.resolve('../client/view/index.html'));
});

到这里

 app.use('/client',express.static('../client/'));
 app.get('/',function(request,response){
    response.sendFile(path.resolve('../client/view/index.html'));
});

解决了我的问题。

谢谢

【讨论】：