使用本机浏览器身份验证的Javascript

我目前正在使用Angular2和TypeScript开发一个web应用程序（如果有必要）。
此应用程序必须与请求摘要身份验证的Web服务器通信。
到目前为止，我一直在使用浏览器的本机登录提示符，当服务器返回“401 unauthorized”时，会自动显示该提示符。浏览器只请求一次身份验证，并在将来的请求中自动使用此用户名和密码。因此，我不必关心身份验证，浏览器为我做一切。
不幸的是，现在我必须创建一个自定义登录屏幕，因为我必须实现一些默认操作，例如“注册”或“重置密码”，通常可以从该屏幕访问这些操作。
由于摘要身份验证非常复杂，而且浏览器可以为我完成所有复杂的事情，我想继续使用浏览器功能，但不使用它的登录提示。
那么可以使用浏览器身份验证功能吗？
如果可能的话，我如何设置它应该使用的用户名和密码

编辑：
由于有人想把这个问题归结为“过于宽泛”，我将尝试添加更多细节。
web应用程序从restful web服务获取数据。如果您使用了错误的用户名或密码，此Web服务需要摘要身份验证并以401响应。
如上所述，如果他收到401错误，浏览器会自动显示登录提示。如果您输入有效的登录名，浏览器会将这些值缓存在某个位置，并为以后的每个请求自动设置这些值。
现在，我基本上希望替换登录提示，并通过编程设置浏览器应用于登录的值。

---

我希望这有助于澄清问题。

基本上，您必须编写一个

HTTP

decorator来拦截响应代码401。然后添加

身份验证

头并重播请求

从'@angular/core'导入{Injectable}；
从“@angular/Http”导入{Http，ConnectionBackend，RequestOptions，RequestOptionsArgs，Response，Headers}；
从'rxjs/Rx'导入{Observable}；
@可注射（）
导出类CustomHttp扩展了Http{
/**
*截获请求
*@param{Observable}Observable可使用
*@param{string}要请求的url
*@returns{Observable}返回值
*@私人
*/
私有截取（observable:observable，url:string）：observable{
返回可观察的捕获（错误=>{
如果（error.status==401）{
//添加自定义标题
let headers=新的headers（）；
附加（'Authentication'，''）；
//具有修改标头的重播请求
返回此.get（url，新请求选项({
标题：标题
});
}否则{
返回可观察抛出（错误）；
}
});
};
/**
*建造师
*@param{ConnectionBackend}要使用的后端
*@param{RequestOptions}要使用的默认选项
*@返回{void}无任何内容
*/
构造函数（后端：ConnectionBackend，defaultOptions:RequestOptions）{
超级（后端，默认选项）；
};
/**
*获取请求
*@param{string}要请求的url
*@param{RequestOptionsArgs}要使用的选项
*@returns{Observable}返回值
*/
获取（url:string，options？：RequestOptionsArgs）：可观察{
返回此。\u截取（super.get（url，选项），url）；
};
}

对我来说还不起作用的是确定正确的响应，因为Angular2（）上有一个bug，它在几天前刚刚被合并

在第一个成功请求之后，必须为每个有效请求增加请求计数器

---

也许其他人可以提供一个有效的解决方案。

基本上，您必须编写一个

HTTP

装饰程序来截获响应代码401。然后添加

身份验证

头并重播请求

从'@angular/core'导入{Injectable}；
从“@angular/Http”导入{Http，ConnectionBackend，RequestOptions，RequestOptionsArgs，Response，Headers}；
从'rxjs/Rx'导入{Observable}；
@可注射（）
导出类CustomHttp扩展了Http{
/**
*截获请求
*@param{Observable}Observable可使用
*@param{string}要请求的url
*@returns{Observable}返回值
*@私人
*/
私有截取（observable:observable，url:string）：observable{
返回可观察的捕获（错误=>{
如果（error.status==401）{
//添加自定义标题
let headers=新的headers（）；
附加（'Authentication'，''）；
//具有修改标头的重播请求
返回此.get（url，新请求选项({
标题：标题
});
}否则{
返回可观察抛出（错误）；
}
});
};
/**
*建造师
*@param{ConnectionBackend}要使用的后端
*@param{RequestOptions}要使用的默认选项
*@返回{void}无任何内容
*/
构造函数（后端：ConnectionBackend，defaultOptions:RequestOptions）{
超级（后端，默认选项）；
};
/**
*获取请求
*@param{string}要请求的url
*@param{RequestOptionsArgs}要使用的选项
*@returns{Observable}返回值
*/
获取（url:string，options？：RequestOptionsArgs）：可观察{
返回此。\u截取（super.get（url，选项），url）；
};
}

对我来说还不起作用的是确定正确的响应，因为Angular2（）上有一个bug，它在几天前刚刚被合并

在第一次成功后，必须为每个有效请求增加请求计数器