expressJWT 阻止公用文件夹，如何解除阻止？答案

【问题标题】：expressJWT blocking public folder, how to unblock?expressJWT 阻止公用文件夹，如何解除阻止？
【发布时间】：2018-05-30 15:37:14
【问题描述】：

我的 express/node 后端应用程序和前端应用程序以前是分开的，后端运行在 localhost:3000 上，前端应用程序使用 ng serve 启动并在 localhost:4200 上运行

然而，在我构建了应用程序之后，所有前端的东西都被缩小并放入 /public/ 文件夹中，它们都在端口 3000 上运行。我很确定它们应该像那样工作。由于我正在使用 expressJWT 中间件来保护我的一些没有令牌的访问者的路线，我现在在尝试在浏览器中接收前端应用程序时得到未经授权的 401 .....

如图所示，我可以毫无问题地加载 index.html，我还可以加载所有外部托管源，例如 boots strap 和 jquery 等... 但我自己的 .js 文件是 401。我认为这是因为 expressJWT，但我不完全确定。有谁知道问题是什么以及如何解决？

也可能是express配置错误？如您所见，我试图像这样“ubnlock”公用文件夹：

 app.use(expressJWT({secret: secret}).unless({path : 
 ['/','../public/*','/api/authenticate', '/api/register']}))

全程快递：

const express = require("express")
const bodyParser = require("body-parser")
const logger = require('morgan')
const api = require("./api/api")
const path = require('path')
const secret = require('./models/secrets')
const expressJWT = require('express-jwt')
const cors = require('cors');

const app = express()

app.set("json spaces", 2)
app.use(logger("dev"))
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: false }))

// CORS middleware
app.use(cors());

app.use(expressJWT({secret: secret}).unless({path : ['/','../public/*','/api/authenticate', '/api/register']}))

app.use("/api/", api)

app.get('*', (req,res) => {
  res.sendFile(path.join(__dirname, 'public/index.html'));
});

app.use(function (req, res, next) {
  var err = new Error('Not Found')
  err.status = 404
  next(err)
})

app.use(function (err, req, res, next) {
  console.error(err.status)
  res.status(err.status || 500)
  res.json({ msg: err.message, status: err.status })
})

// Body Parser middleware
app.use(bodyParser.json());

// Set static folder
app.use(express.static(path.join(__dirname, 'public')));
//Call this to initialize mongoose
function initMongoose(dbConnection) {
  require("./db/mongooseConnect")(dbConnection)
}

app.initMongoose = initMongoose

module.exports = app

【问题讨论】：

还可以简化您的应用文件夹结构。我认为路径解析有问题，而不是 jwt。
抱歉，简化我的应用程序文件夹结构是什么意思？如果我注释掉我的行 app.use(expressJWT.......) 那么我可以访问 bundle.js 文件。至少他们不会取消授权 401 .. 而是将他们的内容替换为与 index.html 相同的内容。这引发了一个意外的令牌错误，因为 tehre 突然是 .js 文件中的 html 代码...我检查了公用文件夹中的原始文件，它们包含正确的 javascript 代码。真的很混乱
通常这个包文件是 webpack 加载器文件，并在你构建时生成。在更大的项目中，webpack 配置处理专有的 dist 文件夹，所有资源和页面都可以在延迟加载中访问。此外，您有两个不同的端口在使用中，它需要指定/设置在 index.html 中解析的基本 href。在大多数情况下，'/' 有效。但主要与您的文件夹结构有关。如果一切正常，还要检查“CORS”，也许秘密无法通过不同端口上的标头。

标签： angularjs node.js express jwt unauthorized

【解决方案1】：

在使用 jwt 之前使用 express 静态中间件。

示例：

app
  .use(express.static(STATIC_PATH))
  .use(
    exjwt({ secret: SECRET }).unless({
      path: [/\/api\/v1\/identify/]
    })
  )

【讨论】：

【解决方案2】：

我不是 100% 确定，但我猜你对这条线有疑问。

app.use(expressJWT({secret: secret}).unless({path : ['/','../public/*','/api/authenticate', '/api/register']}))

app.use("/api/", api)`

试试这个。放单/应该可以解决。

app.use('/api',expressJwt({secret: secret}).unless({path: ['/','/public/*','/api/authenticate', '/api/register']});

【讨论】：