MEAN:服务Angular node_modules的NodeJS返回index.html

时间:2017-04-02 19:14:15

标签: javascript angularjs node.js express nginx

NodeJS https服务器运行api,cms和angular app。 当我使用nodemon在本地计算机(macOS Sierra)上启动服务器时,一切正常。当我尝试在我的VPS上做同样的事情时,一切都失败了。 关于VPS的一些细节:它使用NGINX作为代理服务器,使用pm2作为集群管理器,并使用forsencrypt作为ssl。

即使允许防火墙中的节点服务器的直接端口绕过NGINX,角度前端和CMS也无法正确加载。从pm2切换到nodemon不会改变任何内容。

使用控制台我从公共node_modules所需的每个依赖项中收到此错误消息:

 Refused to execute script from 'https://mydomain/node_modules/jquery/dist/jquery.min.js' because  
 its MIME type ('text/html') is not executable, and strict MIME typechecking is enabled.

当我们从angular而不是请求的包中看到实际返回的是index.html时。 出于测试目的,我允许以下

 app.use('/node_modules', express.static(__dirname + '/node_modules'));
//With a copy of jquery and bootstrap

并且CMS正确加载但角度前端不正确。但它也暴露了服务器依赖性。你能帮助我发现我的错误吗?

api是一个简单的REST API,它使用一些服务与MongoDB进行通信。 CMS由Node使用ejs视图引擎提供服务

 //APP.JS
  let cms = require('./routes/cms'); //An Express Router
  let api = require('./routes/api');//An Express Router
 //The modules containing angular, jquery and bootstrap for the Angular front end and the cms
 //We separated the dependencies for the backend and frontend as a security measure
  app.use('/node_modules', express.static(__dirname + '/public/node_modules')); 
  app.use('/api', api); //Server the api
  app.use('/cms', cms); //Serve the cms
 //The problem is probably here
  app.use('/', express.static(__dirname + '/public')); //Route to the angular frontend
  app.get('/*', function(req, res){ //Support for html5Mode in Angular
        res.sendFile(path.join(__dirname + '/public/index.html'));
 });
 // catch 404 and forward to error handler
  app.use(function (req, res, next) {
        let err = new Error('Not Found\t' + req.header('Referer'));
        err.status = 404;
        next(err);
 });

 //Server.JS
 let options = {
        key: fs.readFileSync('certs/privatekey.pem'),
        cert: fs.readFileSync('certs/certificate.pem')
 };
 let server = https.createServer(options,app);

 //Angular Frontend index.html

  <head>
     <!— … —>    
        <link rel="stylesheet"   href="node_modules/bootstrap/dist/css/bootstrap.min.css">
     <link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
     <link rel="stylesheet" href="node_modules/animate.css/animate.min.css">
     <link rel="stylesheet" href="node_modules/ng-dialog/css/ngDialog.min.css">
     <link rel="stylesheet" href="node_modules/ng-dialog/css/ngDialog-theme-default.min.css">
     <link rel="stylesheet" href="node_modules/angular-moment-picker/dist/angular-moment-picker.css">
     <link rel="stylesheet" href="node_modules/angular-tooltips/dist/angular-tooltips.min.css">
     <link rel="stylesheet" href="dist/css/site.css">
    <!— … —>
  </head>


 //The tree

  ├── api.md    //Some doc
  ├── app.js 
  ├── bin       //Contains server.js
  ├── certs
  ├── config
  ├── coverage
  ├── data      
  ├── database  //Link with the database
  ├── errors
  ├── helpers
  ├── logs
  ├── minigames
  ├── node_modules  //The dependencies for the server
  ├── package.json  //The package for the server
  ├── public        
  │ ├── app     //The controllers for the Angular app
  │ ├── app.js
  │ ├── assets
  │ ├── dist
  │ ├── img
  │ ├── index.html  //Entry point for the Angular app
  │ ├── karma.config.js
  │ ├── node_modules    //The node_modules for the Angular app
  │ ├── npm-debug.log
  │ ├── package.json    //The package for the Angular app
  │ ├── scss
  │ ├── stylesheets
  │ ├── superstatic.json
  │ ├── tests
  │ └── views   
  ├── routes        //Contains the routes for the Api and the CMS
  ├── services  
  ├── test
  ├── tools
  └── views     //The views for the CMS

1 个答案:

答案 0 :(得分:0)

似乎public / node_modules为空。 npm install似乎工作,因为它没有抛出错误,但它在某处失败了。通过sftp复制node_modules解决了我的问题。