handle passport-facebook callback in angular4+
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I have express and Angular app with the passport-facebook strategy to sign up users.
In my Service in Angular, I call "https://host/auth/facebook/" triggered from a button in a template:
Service code excerpt:
fbLogin() {
this.http
.get<{ token: string; expiresIn: number; userId: string, slug:string }>('https://host/auth/facebook/')
.subscribe(response => {
//save token to local storage, etc
...}
So after clicking a button user is redirected to Facebook where he consents to give an app some access and then facebook calls "/facebook/callback".
Upon success, I generate jwt token + some other metadata and put it into JSON, then send it to Angular to save to a local storage.
So token is generated, passed back to Angular and shown in browser window like that:
{name: "NewName",
email: "email@email.com",
token: "eyJhbGciOiJIUzfdI1NiIsInR5cCfdfI6IkpXVCJ9.eyJpZCI6IjViZjc0NTQ1YTRhMjdfI3NDI2ZGM5ZTYwYSIsIm5hbWUiOiJBbGVrc2fdfFuZHIiLCJzbHVnIjoiYWxla3NhbmRyLTZwdWpnZyIsImV4cCI6MTU0ODI1MjM0NywiaWF0IjoxNfdfTQzMDY4MzQ3fQfdf.nfZHE_IFT-Eaa2u_GXUFkVKkChT7Faqsyh_2x2g-ix4",
expiresIn: 3600,
userId: "5bf74545a4afdfd227426dc9e60a",
}
along with a redirect to "https://host/api/auth/facebook/callback?code=AQA32HfWnlDCT...."
But I need to have it in the Angular Service after calling "https://host/auth/facebook/" to save it, and I don't have it cause facebook is calling "auth/facebook/callback" not the Angular app.
A similar question is here:
how to handle passport-facebook callback in angular client? and the answer was about redirecting to another endpoint in Express, but even if to do that how to handle it in Angular is not clear.
Please advise how to approach that.
angular mean-stack passport-facebook asked Nov 24 '18 at 14:40
AlexAlex
113111
add a comment |
I have express and Angular app with the passport-facebook strategy to sign up users.
In my Service in Angular, I call "https://host/auth/facebook/" triggered from a button in a template:
Service code excerpt:
fbLogin() {
this.http
.get<{ token: string; expiresIn: number; userId: string, slug:string }>('https://host/auth/facebook/')
.subscribe(response => {
//save token to local storage, etc
...}
So after clicking a button user is redirected to Facebook where he consents to give an app some access and then facebook calls "/facebook/callback".
Upon success, I generate jwt token + some other metadata and put it into JSON, then send it to Angular to save to a local storage.
So token is generated, passed back to Angular and shown in browser window like that:
{name: "NewName",
email: "email@email.com",
token: "eyJhbGciOiJIUzfdI1NiIsInR5cCfdfI6IkpXVCJ9.eyJpZCI6IjViZjc0NTQ1YTRhMjdfI3NDI2ZGM5ZTYwYSIsIm5hbWUiOiJBbGVrc2fdfFuZHIiLCJzbHVnIjoiYWxla3NhbmRyLTZwdWpnZyIsImV4cCI6MTU0ODI1MjM0NywiaWF0IjoxNfdfTQzMDY4MzQ3fQfdf.nfZHE_IFT-Eaa2u_GXUFkVKkChT7Faqsyh_2x2g-ix4",
expiresIn: 3600,
userId: "5bf74545a4afdfd227426dc9e60a",
}
along with a redirect to "https://host/api/auth/facebook/callback?code=AQA32HfWnlDCT...."
But I need to have it in the Angular Service after calling "https://host/auth/facebook/" to save it, and I don't have it cause facebook is calling "auth/facebook/callback" not the Angular app.
A similar question is here:
how to handle passport-facebook callback in angular client? and the answer was about redirecting to another endpoint in Express, but even if to do that how to handle it in Angular is not clear.
Please advise how to approach that.
angular mean-stack passport-facebook asked Nov 24 '18 at 14:40
AlexAlex
113111
add a comment |
I have express and Angular app with the passport-facebook strategy to sign up users.
In my Service in Angular, I call "https://host/auth/facebook/" triggered from a button in a template:
Service code excerpt:
fbLogin() {
this.http
.get<{ token: string; expiresIn: number; userId: string, slug:string }>('https://host/auth/facebook/')
.subscribe(response => {
//save token to local storage, etc
...}
So after clicking a button user is redirected to Facebook where he consents to give an app some access and then facebook calls "/facebook/callback".
Upon success, I generate jwt token + some other metadata and put it into JSON, then send it to Angular to save to a local storage.
So token is generated, passed back to Angular and shown in browser window like that:
{name: "NewName",
email: "email@email.com",
token: "eyJhbGciOiJIUzfdI1NiIsInR5cCfdfI6IkpXVCJ9.eyJpZCI6IjViZjc0NTQ1YTRhMjdfI3NDI2ZGM5ZTYwYSIsIm5hbWUiOiJBbGVrc2fdfFuZHIiLCJzbHVnIjoiYWxla3NhbmRyLTZwdWpnZyIsImV4cCI6MTU0ODI1MjM0NywiaWF0IjoxNfdfTQzMDY4MzQ3fQfdf.nfZHE_IFT-Eaa2u_GXUFkVKkChT7Faqsyh_2x2g-ix4",
expiresIn: 3600,
userId: "5bf74545a4afdfd227426dc9e60a",
}
along with a redirect to "https://host/api/auth/facebook/callback?code=AQA32HfWnlDCT...."
But I need to have it in the Angular Service after calling "https://host/auth/facebook/" to save it, and I don't have it cause facebook is calling "auth/facebook/callback" not the Angular app.
A similar question is here:
how to handle passport-facebook callback in angular client? and the answer was about redirecting to another endpoint in Express, but even if to do that how to handle it in Angular is not clear.
Please advise how to approach that.
angular mean-stack passport-facebook asked Nov 24 '18 at 14:40
AlexAlex
113111
I have express and Angular app with the passport-facebook strategy to sign up users.
In my Service in Angular, I call "https://host/auth/facebook/" triggered from a button in a template:
Service code excerpt:
fbLogin() {
this.http
.get<{ token: string; expiresIn: number; userId: string, slug:string }>('https://host/auth/facebook/')
.subscribe(response => {
//save token to local storage, etc
...}
So after clicking a button user is redirected to Facebook where he consents to give an app some access and then facebook calls "/facebook/callback".
Upon success, I generate jwt token + some other metadata and put it into JSON, then send it to Angular to save to a local storage.
So token is generated, passed back to Angular and shown in browser window like that:
{name: "NewName",
email: "email@email.com",
token: "eyJhbGciOiJIUzfdI1NiIsInR5cCfdfI6IkpXVCJ9.eyJpZCI6IjViZjc0NTQ1YTRhMjdfI3NDI2ZGM5ZTYwYSIsIm5hbWUiOiJBbGVrc2fdfFuZHIiLCJzbHVnIjoiYWxla3NhbmRyLTZwdWpnZyIsImV4cCI6MTU0ODI1MjM0NywiaWF0IjoxNfdfTQzMDY4MzQ3fQfdf.nfZHE_IFT-Eaa2u_GXUFkVKkChT7Faqsyh_2x2g-ix4",
expiresIn: 3600,
userId: "5bf74545a4afdfd227426dc9e60a",
}
along with a redirect to "https://host/api/auth/facebook/callback?code=AQA32HfWnlDCT...."
But I need to have it in the Angular Service after calling "https://host/auth/facebook/" to save it, and I don't have it cause facebook is calling "auth/facebook/callback" not the Angular app.
A similar question is here:
how to handle passport-facebook callback in angular client? and the answer was about redirecting to another endpoint in Express, but even if to do that how to handle it in Angular is not clear.
Please advise how to approach that.
angular mean-stack passport-facebook angular mean-stack passport-facebook asked Nov 24 '18 at 14:40
AlexAlex
113111
asked Nov 24 '18 at 14:40
AlexAlex
113111
edited Nov 24 '18 at 19:53
Alex
asked Nov 24 '18 at 14:40
AlexAlex
113111
asked Nov 24 '18 at 14:40
AlexAlex
113111
asked Nov 24 '18 at 14:40
AlexAlex
113111
113111
add a comment |
add a comment |
0
active
oldest
votes
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%2f53459265%2fhandle-passport-facebook-callback-in-angular4%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
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%2f53459265%2fhandle-passport-facebook-callback-in-angular4%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
