node.js - 如何使用 Protractor 处理浏览器的 native 身份验证对话框

Question

我需要使用 Protractor (nodeJs)测试网页。该网站受到保护，当您尝试进入该网站时，浏览器将显示其 native 身份验证对话框。我们曾经像这样将用户名和密码添加到 url 中

https://username:password@example.com

但是这种方法在 Chrome 或 Firefox 中不起作用(我不记得是哪一个)。

如果您填写对话框并提交，浏览器将再次发出相同的请求，并添加以下 header

header: { Authorization: "Basic bF0A23Zwdfsf==" }

回到 Protractor ，脚本做的第一件事是

browser.driver.get('https://example.com');

所以我的第一个问题是:是否可以以某种方式添加 header ？

我还尝试在 onPrepare 中调用 fetch (这是在 browser.driver.get 之前)

browser.driver.executeScript(function () {
    let headers = new Headers({"Authorization": "Basic " + new Buffer("username" + ":" + "password").toString("base64")});
    let myInit = {method: "GET", headers: headers};
    fetch("https://example.com", headers);
});

出于某种原因，fetch 似乎忽略了 Authorization header (它不存在于请求中)。

无论如何，这个问题变得越来越复杂，这就是我在这里发帖的原因。有谁知道解决方案或有建议吗？

Answer 1

我从 @Florent B 得到答复。谢谢!!

Protractor 没有用于基本身份验证的 API。

所以我使用node-http-proxy添加基本​​身份验证 header 以通过 Protractor 请求。

如何

1。安装node-http-proxy

$ npm install --save http-proxy

2。编辑protractor.conf.js

var httpProxy = require('http-proxy');
var proxy;
var PORT_PROXY_SERVER = 8899;
exports.config = {
  // do something
    capabilities: {
        'browserName': 'chrome',
        'proxy': {
            proxyType: 'manual',
            httpProxy: `localhost:${PORT_PROXY_SERVER}`,
            sslProxy: `localhost:${PORT_PROXY_SERVER}`
        }
    },        
    onPrepare: function () {
        // create proxy server
        proxy = httpProxy.createProxyServer({
        target: 'https://REAL_HOST.COM', // edit here
        auth: 'USER_NAME:PASSWORD',      // edit here
        changeOrigin: true
    }).listen(PORT_PROXY_SERVER);
  }
  // other your setting
};

运行上面的代码，你的 Protractor 访问http://localhost:8899。 ProxyServer 使用基本身份验证 header 将其传递到 https://REAL_HOST.COM。