鍍金池/ 問答/HTML/ webpack-dev-server如何重定向?

webpack-dev-server如何重定向?

下方代碼在webpack-dev-server運行后會打開默認瀏覽器(Chrome)訪問localhost:8080/login,這時根據(jù)配置代理到http://login.example.com進行登錄,該地址登錄后會進行302的跳轉,下方代碼將其set-cookie的值設置到cookieMap中并重定向回localhost:8080,之后調用api相關的請求均能正常帶上cookie值?,F(xiàn)在想模擬外網(wǎng)環(huán)境打開多個瀏覽器登錄多個用戶,但如在Firefox中打開localhost:8080由于沒有登錄所以調用api相關的請求均沒有cookie值。如果在Firefox中打開localhost:8080/login則都正常,現(xiàn)在想減少輸入,打開localhost:8080后,如何根據(jù)下方cookieMap中不存在當前瀏覽器的cookie值跳轉到指定登錄頁localhost:8080/login,如存在則正常打開localhost:8080。

const cookieMap = {};
module.exports = {
  devServer: {
    historyApiFallback: true,
    hot: true,
    inline: true,
    progress: true,
    openPage: 'login',
    proxy: [ {
      context: ['/api'],
      target: "http://api.example.com",
      changeOrigin: true,
      onProxyReq(proxyReq, req, res) {
        let cookie = cookieMap[req.get('User-Agent')] || '';
        proxyReq.setHeader('Cookie', cookie);
      }
    }, {
      context: ['/login'],
      target: "http://login.example.com",
      changeOrigin: true,
      onProxyRes(proxyRes, req, res) {
        if(proxyRes.statusCode === 302) {
          if(proxyRes.headers['set-cookie']) {
            cookieMap[req.get('User-Agent')] = proxyRes.headers['set-cookie'].join(';');
          }
          proxyRes.headers['Location'] = '/';
        }
      }
    }]
  }
}
回答
編輯回答
疚幼

仔細閱讀webpack-DevServer文檔,可以發(fā)現(xiàn)發(fā)現(xiàn)配置中加入index: '',即可代理根目錄,所以只需在代理中再配置一個根目錄,代碼如下

const cookieMap = {};
module.exports = {
  devServer: {
    index: '',// specify to enable root proxying
    historyApiFallback: true,
    hot: true,
    inline: true,
    progress: true,
    openPage: 'login',
    proxy: [ {
      context: ['/api'],
      target: "http://api.example.com",
      changeOrigin: true,
      onProxyReq(proxyReq, req, res) {
        let cookie = cookieMap[req.get('User-Agent')] || '';
        proxyReq.setHeader('Cookie', cookie);
      }
    }, {
      context: ['/login'],
      target: "http://login.example.com",
      changeOrigin: true,
      onProxyRes(proxyRes, req, res) {
        if(proxyRes.statusCode === 302) {
          if(proxyRes.headers['set-cookie']) {
            cookieMap[req.get('User-Agent')] = proxyRes.headers['set-cookie'].join(';');
          }
          proxyRes.headers['Location'] = '/';
        }
      }
    }, {
      context: ['/'],
      bypass: function(req, res, proxyOptions) {
        if (req.url === '/' && !cookieMap[req.get('User-Agent')]) {
          res.redirect('/login');
          return true;
        }
      }
    }]
  }
}
2017年11月24日 20:53