Mixing
Laravel, Angular 7, JWT cookie storage
I have a requirement to implement JWT authentication on an application and I'm trying to mitigate as many risks as possible by using cookie storage (httpOnly) instead of localStorage.
A Laravel server is set up as an API and does not serve the Angular 7 app. The login controller response with the following:
return response()->json($user)->cookie('access_token', $token, 15, '/', true, true);
I can see the cookie (token=blahblahblah) in my response after a POST request to the login URL. I've set withCredentials: true in all requests following the login. I might be wildly misunderstanding this but I want that cookie to be sent along with every subsequent request to authenticate my now logged in user. My middleware in Laravel is looking for $request->cookie('access_token') which is always empty.
Is this even possible to achieve?
angular laravel cookies jwt angular7
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
add a comment |
I have a requirement to implement JWT authentication on an application and I'm trying to mitigate as many risks as possible by using cookie storage (httpOnly) instead of localStorage.
A Laravel server is set up as an API and does not serve the Angular 7 app. The login controller response with the following:
return response()->json($user)->cookie('access_token', $token, 15, '/', true, true);
I can see the cookie (token=blahblahblah) in my response after a POST request to the login URL. I've set withCredentials: true in all requests following the login. I might be wildly misunderstanding this but I want that cookie to be sent along with every subsequent request to authenticate my now logged in user. My middleware in Laravel is looking for $request->cookie('access_token') which is always empty.
Is this even possible to achieve?
angular laravel cookies jwt angular7
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
add a comment |
I have a requirement to implement JWT authentication on an application and I'm trying to mitigate as many risks as possible by using cookie storage (httpOnly) instead of localStorage.
A Laravel server is set up as an API and does not serve the Angular 7 app. The login controller response with the following:
return response()->json($user)->cookie('access_token', $token, 15, '/', true, true);
I can see the cookie (token=blahblahblah) in my response after a POST request to the login URL. I've set withCredentials: true in all requests following the login. I might be wildly misunderstanding this but I want that cookie to be sent along with every subsequent request to authenticate my now logged in user. My middleware in Laravel is looking for $request->cookie('access_token') which is always empty.
Is this even possible to achieve?
angular laravel cookies jwt angular7
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
I have a requirement to implement JWT authentication on an application and I'm trying to mitigate as many risks as possible by using cookie storage (httpOnly) instead of localStorage.
A Laravel server is set up as an API and does not serve the Angular 7 app. The login controller response with the following:
return response()->json($user)->cookie('access_token', $token, 15, '/', true, true);
I can see the cookie (token=blahblahblah) in my response after a POST request to the login URL. I've set withCredentials: true in all requests following the login. I might be wildly misunderstanding this but I want that cookie to be sent along with every subsequent request to authenticate my now logged in user. My middleware in Laravel is looking for $request->cookie('access_token') which is always empty.
Is this even possible to achieve?
angular laravel cookies jwt angular7
angular laravel cookies jwt angular7
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
edited Nov 25 '18 at 0:34
Goncalo Peres
1,4691619
1,4691619
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
asked Nov 21 '18 at 16:14
circuitBurncircuitBurn
633622
633622
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
You could use a HttpInterceptor and send your token in the 'Authorization' header, it will be executed with every request.
https://angular.io/api/common/http/HttpInterceptor
export class JwtInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
const clonedRequest = req.clone({ headers: req.headers.set('Authorization', 'YOUR_TOKEN') });
// Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}}
answered Dec 7 '18 at 9:28
L.B.L.B.
34
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53416254%2flaravel-angular-7-jwt-cookie-storage%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You could use a HttpInterceptor and send your token in the 'Authorization' header, it will be executed with every request.
https://angular.io/api/common/http/HttpInterceptor
export class JwtInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
const clonedRequest = req.clone({ headers: req.headers.set('Authorization', 'YOUR_TOKEN') });
// Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}}
answered Dec 7 '18 at 9:28
L.B.L.B.
34
add a comment |
You could use a HttpInterceptor and send your token in the 'Authorization' header, it will be executed with every request.
https://angular.io/api/common/http/HttpInterceptor
export class JwtInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
const clonedRequest = req.clone({ headers: req.headers.set('Authorization', 'YOUR_TOKEN') });
// Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}}
answered Dec 7 '18 at 9:28
L.B.L.B.
34
add a comment |
You could use a HttpInterceptor and send your token in the 'Authorization' header, it will be executed with every request.
https://angular.io/api/common/http/HttpInterceptor
export class JwtInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
const clonedRequest = req.clone({ headers: req.headers.set('Authorization', 'YOUR_TOKEN') });
// Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}}
answered Dec 7 '18 at 9:28
L.B.L.B.
34
You could use a HttpInterceptor and send your token in the 'Authorization' header, it will be executed with every request.
https://angular.io/api/common/http/HttpInterceptor
export class JwtInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
const clonedRequest = req.clone({ headers: req.headers.set('Authorization', 'YOUR_TOKEN') });
// Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}}
answered Dec 7 '18 at 9:28
L.B.L.B.
34
answered Dec 7 '18 at 9:28
L.B.L.B.
34
answered Dec 7 '18 at 9:28
L.B.L.B.
34
answered Dec 7 '18 at 9:28
L.B.L.B.
34
34
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53416254%2flaravel-angular-7-jwt-cookie-storage%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
