PWA(Progressive Web App)是一种渐进式网络应用,它结合了网页应用的便利性和原生应用的体验。Laravel 是一个流行的 PHP 框架,用于构建 Web 应用和 API。身份验证是确保用户身份安全的过程。
Laravel 的身份验证机制通常依赖于服务器端的会话和 Cookie,这在离线状态下无法正常工作。
// Laravel 控制器
use Tymon\JWTAuth\Facades\JWTAuth;
public function login(Request $request)
{
$credentials = $request->only('email', 'password');
if (!$token = JWTAuth::attempt($credentials)) {
return response()->json(['error' => 'Unauthorized'], 401);
}
return $this->respondWithToken($token);
}
protected function respondWithToken($token)
{
return response()->json([
'access_token' => $token,
'token_type' => 'bearer',
'expires_in' => JWTAuth::factory()->getTTL() * 60
]);
}
// 前端代码
document.addEventListener('DOMContentLoaded', function () {
const token = localStorage.getItem('access_token');
if (token) {
// 设置 Authorization 头
fetch('/api/some-endpoint', {
headers: {
'Authorization': `Bearer ${token}`
}
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
}
});
// service-worker.js
self.addEventListener('fetch', event => {
event.respondWith(
caches.match(event.request)
.then(response => {
return response || fetch(event.request);
})
);
});
通过上述方法,可以在 PWA 中使用 Laravel 身份验证,保持用户在脱线状态下登录。
领取专属 10元无门槛券
手把手带您无忧上云