node和nginx如何找到静态文件？

Question

我正在尝试使用node / express / nginx在digitalocean中托管不同的应用程序

我还有一个运行主路线的Meteor应用程序

这是我的nginx /etc/nginx/sites-enabled/default配置

server {
        listen 80;

        server_name localhost;

        location / {
                proxy_pass http://localhost:3000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

        location /buscatucanal {
                proxy_pass http://localhost:4000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }


}

第一个/正常工作，但/buscatucanal找不到css / images / js。

这是express js文件：

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

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

app.get('/buscatucanal', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

app.listen(4000, function(){
 console.log("listening in port 4000");
});

以下是index.html文件正在寻找的一些静态文件：

<script type="text/javascript" src="buscatucanal/public2/bower_components/jquery/dist/jquery.min.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/bower_components/angular/angular.min.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/bower_components/angular-aria/angular-aria.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/bower_components/angular-animate/angular-animate.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/bower_components/angular-material/angular-material.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/bower_components/angular-material-data-table/dist/md-data-table.min.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/bower_components/underscore/underscore-min.js"></script>
  <script type="text/javascript" src="buscatucanal/public2/js/app.js"></script>

以下是开发者工具的错误日志：

GET http://myipaddress/buscatucanal/public2/bower_components/angular-material-data-table/dist/md-data-table.min.css 
buscatucanal:9 GET http://myipaddress/buscatucanal/public2/bower_components/angular-material/angular-material.css 
buscatucanal:145 GET http://myipaddress/buscatucanal/public2/bower_components/jquery/dist/jquery.min.js 
buscatucanal:13 GET http://myipaddress/buscatucanal/public2/css/custom.css 
buscatucanal:147 GET http://myipaddress/buscatucanal/public2/bower_components/angular-aria/angular-aria.js 
buscatucanal:146 GET http://myipaddress/buscatucanal/public2/bower_components/angular/angular.min.js 
buscatucanal:148 GET http://myipaddress/buscatucanal/public2/bower_components/angular-animate/angular-animate.js 
buscatucanal:149 GET http://myipaddress/buscatucanal/public2/bower_components/angular-material/angular-material.js 
buscatucanal:152 GET http://myipaddress/buscatucanal/public2/js/app.js 
buscatucanal:43 GET http://myipaddress/buscatucanal/public2/images/logo1.png 404 (Not Found)
buscatucanal:150 GET http://myipaddress/buscatucanal/public2/bower_components/angular-material-data-table/dist/md-data-table.min.js 
buscatucanal:151 GET http://myipaddress/buscatucanal/public2/bower_components/underscore/underscore-min.js 404 (Not Found)

我该怎么做才能解决此问题？

编辑

我更改index.html文件并编辑要查找的文件，如下所示

<script type="text/javascript" src="public2/bower_components/jquery/dist/jquery.min.js"></script>

如果我直接进入http://myipaddress:4000这样的端口，它就可以正常工作。

但是当我像http://myipaddress/buscatucanal一样走时，我得到了不同的错误：

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://myipaddress/public2/bower_components/angular-material-data-table/dist/md-data-table.min.css".
buscatucanal:9 Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://myipaddress/public2/bower_components/angular-material/angular-material.css".
buscatucanal:13 Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://myipaddress/public2/css/custom.css".

似乎服务不正确：

Answer 1

您需要设置哑剧类型。

我假设您已经在Nginx中正确包含了mime类型，在我的机器上我已经知道了。

http {
     include       mime.types;
     default_type  application/octet-stream;

您没有在代码中设置mime类型。 看看快递文档

http://expressjs.com/en/api.html

 res.type(type) 

将Content-Type HTTP标头设置为mime.lookup（）为指定类型确定的MIME类型。 如果type包含“ /”字符，则它将Content-Type设置为type。

res.type('.html');              // => 'text/html'
res.type('html');               // => 'text/html'
res.type('json');               // => 'application/json'
res.type('application/json');   // => 'application/json'
res.type('png');                // => image/png

有一个名为mime mime.lookup的模块，可用于获取MIME类型。

https://github.com/broofa/node-mime?_ga=1.178625127.213417936.1460395729#mimelookuppath

mime.lookup('/path/to/file.txt');         // => 'text/plain'
mime.lookup('file.txt');                  // => 'text/plain'
mime.lookup('.TXT');                      // => 'text/plain'
mime.lookup('htm');  

节点还可以显式设置标头。