I am using 0authv2 and Ionic 2
My application needs to create a GET request that looks like this:
Get GET_URL
client_id <clientid>
redirect_uri URL
response_type code
scope offline_access
The response should provide me with an access code to place in a POST request, this will look something like this:
POST POST_URL
client_id <clientid>
client_secret <client secret>
code CODE_FROM_GET
grant_type authorization_code
redirect_uri URL
The instructions provided say to use a get, then URL load the user to the login page. At the point of logging in, they would get a URL that contains the code as well. I would then pass this with the POST to the server to get the access token. I am getting the same code with the GET, so is there a way to store this, then pass it with a POST to receive an access token?
I can provide my broken code if that helps, but I have been looking at combinations for a week with no success. Thanks again!
I guess you are trying to oauth2 grant type code implementation.
There are possible to different approuch. But you can use this:
-
First open the url in browser. Use InAppBrowser for this: http://ionicframework.com/docs/native/in-app-browser/
-
Follow the url with inappbrowser “loadstop” event and get the code.
-
After you get the code, you will send a http post request with this code header and you can get the token.
-
Save the token and add the token all request.
Thanks, the code I have for this is below, but its going right to the error in the console. I used loadstart, because the code is in the redirect after the user signs in.
public createAccountPOST() {
var access_token: any;
var urlsp = "COMPANY_SIGN_IN_URL";
let browser = new InAppBrowser(urlsp, '_blank', 'location=yes,zoom=yes,enableViewportScale=yes');
browser.on("loadstart").subscribe((event: InAppBrowserEvent) => {
var url_code = this.getQueryVariable(event.url, "code");
localStorage.setItem('auth_token', url_code);
//url_code = localStorage.getItem('url_code');
//setup for POST
let details = {
client_id: "client_id",
client_secret: "client_secret",
code: url_code,
grant_type: "authorization_code",
redirect_uri: "redirect_uri"
}
return this.http.post('TOKEN_ENDPOINT', details)
.map(res => res.json())
.subscribe(
data => {
this.getData = JSON.stringify(data)
var access_token = data.getData;
localStorage.setItem('access_token', access_token);
},
(err) => {
console.log("post didnt work")
alert("POST failed");
}
);
});
}
Logging the error would probably be useful. I also think it’s a really important habit to declare return value types for every function in your code. Since createAccountPOST()
doesn’t have one, I have to ask: “what are you expecting it to return?”.
What is error ? I think you forget Authorization header. You must add client id to header for token.
let headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
headers.append('Accept', 'application/json');
headers.append('Authorization', 'Basic ' + this.authClient);
let options = new RequestOptions({ headers: headers });
// use string not object.
let details = "client_id=client_id&client_secret=client_secret" ...;
this.http.post('TOKEN_ENDPOINT', details, options)
.map(res => res.json())
.subscribe(
data => {
this.getData = JSON.stringify(data)
var access_token = data.access_token;
localStorage.setItem('access_token', access_token);
// you can use navController. Didn't return anything.
},
(err) => {
console.log("post didnt work")
alert("POST failed");
}
);
Thank you so much for your help. My issue was I was not correctly sending the headers, and I applied the cleaned up logic you made. Your code works, and now I am getting an undefined response. Do I need to convert it so that I can see it?
Ok I converted the response to JSON and now I can pull out elements based on the name. Thank you so much again for your help. Your answer is the solution, and I just added some internal headers for it to work properly.