Javascript 使用主干网的未经筛选的错误+；纤细的+；图波拉基本认证

我正在尝试将我的主干应用程序与服务器api连接（使用Slim），并使用Tuppola/Basic Auth中间件

这个例子很简单，我只是想让它工作。我可以在我的服务器上直接在浏览器中实现这一点。我得到弹出窗口，输入用户和密码，我得到数据

然而，当我尝试使用我的主干应用程序做同样的事情时，我总是得到相同的错误。 这是我的php代码。正如我所说，直接使用浏览器时效果很好

我的类容器

$container["auth"] = function ()
{
    return new \Slim\Middleware\HttpBasicAuthentication([
        "path" => "/app_rutas",
        "realm" => "Protected",
        "users" => [
            "test" => "123",
        ],
        "environment" => "REDIRECT_HTTP_AUTHORIZATION"
    ]);
};

我的班级路线

class Routes
{
    public static function callbacks($app)
    {
        $app->add(                                       \Controller::class . ':middleware');
        $app->add('auth');
        $app->get('/app_rutas/clients',                  \ClientController::class . ':selectAllClients');
        $app->get('/app_rutas/client/{type}/{values}',   \ClientController::class . ':selectClient');
        $app->put('/app_rutas/client',                   \ClientController::class . ':newClient');
    }
}

这是我的js代码，我想问题是我不能正确地将参数传递给中间件。我试过很多方法，一个都不起作用。我想这应该是它不是的那个

fetchData() {
    if (!_.isEmpty(this.clients_id)) {
        this.url = this.apiUrl('client', this.clients_id);

        this.fetch({ headers: {'Authorization':'Basic test:123'} });
    }
},

---

感谢您提前提出的所有意见。

这是使用主干网传递用户名：密码的正确方法：

this.fetch({ headers: {'Authorization':'Basic ' + btoa('test:123')} })

需要base64编码函数。现在它终于起作用了