将 HTTP Basic Auth 添加到 Webpack Dev Server

Question

有没有一种简单的方法可以在零配置反应应用程序中将简单的 HTTP 基本身份验证添加到 Webpack 开发服务器。

我做了什么：

1. 我使用create-react-app创建了一个 React 应用程序，然后构建了我的整个应用程序。
2. 然后我使用npm run eject弹出它。
3. 然后我用谷歌搜索了几个小时，没有找到任何提示。

有这方面的配置还是我必须添加中间件？ 或者是将 webpack 与快递一起使用的唯一/最简单的方法？

Answer 1

嗨，是的，你可以看看 webpack 配置中的设置密钥或这个 url https://webpack.js.org/configuration/dev-server/#devserver-setup我一直面临这样的问题，你可以简单地使用 basic-auth package 满足您的需求

Answer 2

一个非常简单的方法是使用express-basic-auth中间件。

将其安装为开发依赖项：

npm install --save-dev express-basic-auth

然后配置webpack如下：

const basicAuth = require('express-basic-auth');

module.exports = {
  ...
  devServer: {
    ...
    setupMiddlewares: (middlewares, devServer) => {
      devServer.app.use(basicAuth({
        users: {
            'user1': 'password1',
            'user2': 'password2'
        },
        challenge: true
      }));

      return middlewares;
    }
  }
}

或者你希望它工作。