将 Laravel、Facebook 和 Angular 与基于令牌的身份验证集成
Integrating Laravel, Facebook and Angular with token-based-authentication
我的用例:
用户已经使用带有 laravel 和 Socialite 的 Facebook 自动登录服务器端。
我检查用户是否存在于数据库中,如果不存在则创建它并将其登录到 laravel。
然后我需要启动一个 Angular 应用程序并确保他们使用 Laravel / Facebook 登录。
阅读这篇 article 之后,我应该采用这种基于标记的方法。
在本教程中,您使用 Angular 提供登录表单,然后将电子邮件和密码传递给身份验证控制器 (Laravel),其中 returns 一个令牌(创建者JWT-Auth).
令牌进入 Angular 后一切正常,我的问题是我想直接将令牌放入 Angular 而无需登录表单,因为用户已经如上所述登录.
我想知道我是否可以在某个地方的标记中输出令牌,然后从 Angular 中获取它,或者这会不会以某种方式存在安全风险?我想人们将只能查看源代码并看到他们自己的令牌?
如果这是错误的做法,那我该怎么做呢?我是否需要使用 Javascript 对 Facebook 进行身份验证,然后使用 ajax 创建一个新的 laravel 用户?
非常感谢!
您可以采取的一种方法是向 .config
块添加一些内容,以检查本地存储中是否存在 JWT,如果不存在,则向 API 查看用户是否在 Laravel 端登录。如果用户已登录,则返回一个 JWT,可以将其提取并保存在本地存储中。由于 .config
块在 Angular 应用程序加载时是 运行,因此这只会发生一次,这可能就是您正在寻找的。
这可能是这样的。首先是 Laravel 方:
// AuthenticateController.php
...
// Simulates a user being logged in on the Laravel side through something
// other than credentials sent from the front-end. Obviously you would use
// Socialite
public function authenticate()
{
$user = User::find(1);
$token = JWTAuth::fromUser(1);
return response()->json(compact('token'));
}
...
然后 Angular:
// app.js
...
.run(function($rootScope, $state, $auth) {
if(!$auth.isAuthenticated()) {
// No credentials provided because the user is already logged in on the server
$auth.login().then(function() {
$state.go('users');
}
}
$rootScope.$on('$stateChangeStart', function(event, toState) {
...
这只会在 Angular 应用程序加载时 运行,这将在您的用户使用 Socialite 登录之后。它本质上只是检查是否有用户在后端登录,如果是,则检索令牌。它有点 hacky,界面也不明显,因此它可能不是 最佳 解决方案。
您需要在 Laravel 端安排您的 authenticate
控制器,这样它 returns 如果用户通过社交名流登录,则它是令牌;如果 [=32],则需要凭据=] 没有(这是传统登录)。
您也可以看看这种方法是否适合您:https://github.com/barooney/jot-bot/tree/socialite
如果成功了请告诉我!
我的用例:
用户已经使用带有 laravel 和 Socialite 的 Facebook 自动登录服务器端。
我检查用户是否存在于数据库中,如果不存在则创建它并将其登录到 laravel。
然后我需要启动一个 Angular 应用程序并确保他们使用 Laravel / Facebook 登录。
阅读这篇 article 之后,我应该采用这种基于标记的方法。
在本教程中,您使用 Angular 提供登录表单,然后将电子邮件和密码传递给身份验证控制器 (Laravel),其中 returns 一个令牌(创建者JWT-Auth).
令牌进入 Angular 后一切正常,我的问题是我想直接将令牌放入 Angular 而无需登录表单,因为用户已经如上所述登录.
我想知道我是否可以在某个地方的标记中输出令牌,然后从 Angular 中获取它,或者这会不会以某种方式存在安全风险?我想人们将只能查看源代码并看到他们自己的令牌?
如果这是错误的做法,那我该怎么做呢?我是否需要使用 Javascript 对 Facebook 进行身份验证,然后使用 ajax 创建一个新的 laravel 用户?
非常感谢!
您可以采取的一种方法是向 .config
块添加一些内容,以检查本地存储中是否存在 JWT,如果不存在,则向 API 查看用户是否在 Laravel 端登录。如果用户已登录,则返回一个 JWT,可以将其提取并保存在本地存储中。由于 .config
块在 Angular 应用程序加载时是 运行,因此这只会发生一次,这可能就是您正在寻找的。
这可能是这样的。首先是 Laravel 方:
// AuthenticateController.php
...
// Simulates a user being logged in on the Laravel side through something
// other than credentials sent from the front-end. Obviously you would use
// Socialite
public function authenticate()
{
$user = User::find(1);
$token = JWTAuth::fromUser(1);
return response()->json(compact('token'));
}
...
然后 Angular:
// app.js
...
.run(function($rootScope, $state, $auth) {
if(!$auth.isAuthenticated()) {
// No credentials provided because the user is already logged in on the server
$auth.login().then(function() {
$state.go('users');
}
}
$rootScope.$on('$stateChangeStart', function(event, toState) {
...
这只会在 Angular 应用程序加载时 运行,这将在您的用户使用 Socialite 登录之后。它本质上只是检查是否有用户在后端登录,如果是,则检索令牌。它有点 hacky,界面也不明显,因此它可能不是 最佳 解决方案。
您需要在 Laravel 端安排您的 authenticate
控制器,这样它 returns 如果用户通过社交名流登录,则它是令牌;如果 [=32],则需要凭据=] 没有(这是传统登录)。
您也可以看看这种方法是否适合您:https://github.com/barooney/jot-bot/tree/socialite
如果成功了请告诉我!