如何在 Angular 应用程序中处理 API 凭据?
Posted
技术标签:
【中文标题】如何在 Angular 应用程序中处理 API 凭据?【英文标题】:How to handle API credentials in an Angular app? 【发布时间】:2018-04-07 21:03:55 【问题描述】:我在 Laravel 中创建了一个 API,并且在 Angular 中有一个小型 SPA,它通过用户名和密码登录应用程序并接收令牌。有了这个令牌,你可以用 API 做一些基本的事情。
不能在 Angular 应用程序(纯文本 - javascript 等)中保存凭据(用户和密码)。如何在 Javascript 中处理这种身份验证?什么是最佳做法?
【问题讨论】:
你的token和user&pass一样吗? 没有没有。您通过用户名和密码登录 api。登录后,您会收到一个令牌。问题在于该用户并传递数据。 如果您从 API 获取令牌,那么您不需要用户和传递来保存前端的任何位置。只需在每个请求中使用令牌来验证用户。 【参考方案1】:登录后,您可以返回令牌并存储在 localstorage 以供将来使用和刷新,如果您不想手动将令牌放入每个 ajax 调用中,您可以添加到 $http 喜欢:
$http.defaults.headers.common['Authorization'] = 'Bearer ' + storage.token;
我已经在 angularjs 和 laravel 中尝试过这个库: https://github.com/tymondesigns/jwt-auth
【讨论】:
您所说的看起来不错,但是我如何(以及在哪里)进行第一次登录?这是一个大问题。 对不起,我不明白,“我第一次登录”是什么意思?你有经典的登录页面或登录表单吗?以上是关于如何在 Angular 应用程序中处理 API 凭据?的主要内容,如果未能解决你的问题,请参考以下文章
在 Angular 应用程序的 API 调用中处理发送两个参数
如何在 Angular 客户端中处理 passport-facebook 回调?
处理内存不足后返回的 Angular API 致命错误处理程序
Angular 中应该使用哪个函数来处理 api post 请求?
如何从Angular向同一域上的Laravel API发送请求?
在 Angular 11 中,如何通过 API Gateway 将应用程序/json HTTP POST 到 AWS Lambda?