How to get accessToken of React Native GoogleSignIn? - javascript

I am not able to get accessToken, i need it in my backend api.
When i try this,
googleLogin = () => {
GoogleSignin.signIn()
.then((data) => {
console.log("TEST "+JSON.stringify(data));
var postData = {
access_token: data.accessToken,
code: data.idToken,
};
let axiosConfig = {
headers: {
'Content-Type': 'application/json',
"Accept": "application/json",
}
};
....
//Backend api axios call
....
})
.then((user) => {
console.log("TEST G LOGIN 1 "+JSON.stringify(user))
})
.catch((error) => {
console.log("....."+JSON.stringify(error))
});
}
got this response, it doesn't inculde
accessToken
{
"scopes": ["https://www.googleapis.com/auth/userinfo.profile", "https://www.googleapis.com/auth/userinfo.email", "https://www.googleapis.com/auth/drive.readonly"],
"serverAuthCode": "4/jwE5LLLLLLa7-f33333jmMD2V978oyp44444eb9yGe_qhHnkXXXXXXXLFXKZlQdDzlH-iIJx_gzqlLLLLLL3Q0PP0",
"idToken": "...v65a4MCC-ZUQmys_wf_DoCOBJEMuI........",
"user": {
"photo": "https://lh3.googleusercontent.com/-tLLLLLyeS0KE/AAAMMMMAAAI/AAAAAAAAAAA/ACHi3reMhihoeTe_6NjL666666EUVU82Q/s96-c/photo.jpg",
"email": "test#gmail.com",
"familyName": "tech",
"givenName": "test",
"name": "testtech",
"id": "11688888817288868"
}
}
as per documentation
getTokens() Resolves with an object containing { idToken: string,
accessToken: string, } or rejects with an error. Note that using
accessToken is discouraged.
So, i tried this in
GoogleSignin.Sign({
....
var gettoken = GoogleSignin.currentUserAsync(data.user).then((token) => {
console.log('USER token', token);
}).done();
...
})
it got error and also tried const token = GoogSignIn.getTokens(), it return null.
package.json info
{
...
"react": "16.8.3",
"react-native": "0.59.9",
"react-native-firebase": "5.3.1",
"react-native-google-signin": "^2.0.0"
...
}
Please suggest what would be procedure to get accessToken.

Finally i get accessToken.
Step 1:-
I deleted all the generated clidenId in goolge developer console (keep only web application clientId as i used in my web project) and also deleted android app in firebase project.
Step 2:-
Created new android app in firebase and download google-services.json and paste it in android/app/google-services.json
Step 3:-
Copied the clidenId from this part of google-services.json
...
"services": {
"appinvite_service": {
"other_platform_oauth_client": [
{
"client_id": "xxxxxxx-xxxxx.apps.googleusercontent.com", //<--- copied this clientID
"client_type": 3
},
{
"client_id": "XXXXXXXXXX-fBBBBBBBBBBBBBBBBBBBBBBBBpugnhrade.apps.googleusercontent.com",
"client_type": 2,
"ios_info": {
"bundle_id": "com.projectios"
}
}
]
}
}
...
and paste in
GoogleSignin.configure({
webClientId: 'paste it here',
});
Step 4:-
This is the code to get accessToken
(But this code was not working in my previous google-services.json file)
googleLogin = () => {
GoogleSignin.signIn()
.then((data) => {
console.log("TEST " + JSON.stringify(data));
const currentUser = GoogleSignin.getTokens().then((res)=>{
console.log(res.accessToken ); //<-------Get accessToken
var postData = {
access_token: res.accessToken,
code: data.idToken,
};
let axiosConfig = {
headers: {
'Content-Type': 'application/json',
"Accept": "application/json",
}
};
-----
backend api call
-----
});
})
.then((user) => {
console.log("TEST G LOGIN 1 " + JSON.stringify(user))
})
.catch((error) => {
console.log("....." + JSON.stringify(error))
});
}

Related

Cookie error while trying to authenticate for data scraping

I'm trying to scrape some data from truepush website, but first it needs to be authenticated. So here is what I'm doing:
const loginUrl = 'https://app.truepush.com/api/v1/login'
let loginResult = await axios.get(loginUrl)
.then(({ headers }, err) => {
if (err) console.error(err);
return headers['set-cookie'][0];
})
.then((cookie, err) => {
if (err) console.error(err);
const splitByXsrfCookieName = cookie.split("XSRF-TOKEN=")[1]
return splitByXsrfCookieName.split(';')[0];
}).then(xsrfToken => {
return axios.post(loginUrl, {
headers: {
"Content-Type": "application/json",
"X-XSRF-TOKEN": xsrfToken
}
})
}).then(res => console.log(res))
It throws xrsfToken on second then response and when I try to login in third response with that xsrf token, it shows me this error:
{
"status_code": "XSRF-ERROR",
"status": "ERROR",
"message": "Cross domain requests are not accepting to this endpoint. If you cleared the cookies, please refresh your browser."
}
I'm not sure what wrong I'm doing :(
The main issue is that the call also requires the original cookie to be sent. You need to keep the original cookie your get from set-cookie header and pass it in cookie header in the second call like cookie: originalCookie. Also in your code, there is no body sent in the POST call.
The following code reproduces the login :
const axios = require("axios");
const originalUrl = 'https://app.truepush.com';
const loginUrl = 'https://app.truepush.com/api/v1/login';
const email = "your-email#xxxxxx";
const password = "your-password";
(async () => {
await axios.get(originalUrl)
.then(({ headers }, err) => {
if (err) console.error(err);
const cookie = headers['set-cookie'][0];
return {
cookie: cookie,
xsrfToken: cookie.split("XSRF-TOKEN=")[1].split(";")[0]
};
})
.then((data, err) => {
if (err) console.error(err);
return axios.post(loginUrl, {
"email": email,
"password": password,
"keepMeLoggedIn": "yes"
}, {
headers: {
"X-XSRF-TOKEN": data.xsrfToken,
"cookie": data.cookie
}
})
})
.then(res => console.log(res.data))
})();
Output:
{
status_code: 'SUCCESS',
status: 'SUCCESS',
message: 'Login Successful',
data: {
id: 'xxxxxxxxxxxxxxxxxxx',
name: 'xxxxx',
email: 'xxxxxxx#xxxxxx'
}
}
Note that both cookie and xsrfToken are consumed by the second promise

How to resolve Empty error with status code 500 axios?

this is my code :
Express Routes:
router.route('/block')
.post(controller.ticketBlocking);
Express Controller:
const axios = require('axios');
const OAuth = require('oauth-1.0a');
const crypto = require('crypto');
const ticketBlocking = (req, res) => {
const data = JSON.stringify({
source = req.body.source
});
const oauth = OAuth({
consumer: {
key: '....', //Hided the key
secret: '....', //Hided the secret
},
signature_method: 'HMAC-SHA1',
hash_function(base_string, key) {
return crypto.createHmac('sha1', key).update(base_string).digest('base64');
}
});
const request_data = {
url: 'http://link.vvv/blockTicket',
method: 'post',
};
axios({
method: request_data.method,
url: request_data.url,
headers: {
'Content-Type': 'application/json',
Accept: 'application/json',
...oauth.oauth.toHeader(oauth.oauth.authorize(request_data)),
},
data : data
})
.then((response) => {
console.log(JSON.stringify(response.data));
})
.catch(function (error) {
if (error.response) {
console.log(error.response.data);
console.log(error.response.status);
} else if (error.request) {
console.log(error.request);
} else {
console.log('Error', error.message);
}
console.log(error.config);
});
};
the npm package which am using is - "oauth-1.0a"
The problem am facing is, when i use GET method with different end point, i get an output but when ever i use POST method am getting an empty error with status code 500
I dont know where is the mistake, am using oauth1.0a for authorization, please help !

React Native unable to to set AsyncStorage after Fetch API

this question has been answered, you can ignore that and click away
i am making my app using react native expo, and after successfully login, my server return an token an i want to store it in the AsyncStorage, this is my code:
import { Alert, AsyncStorage } from "react-native";
export const login_as_student = async (code, password, navigation) => {
return fetch("http://192.168.47.102:5000/users/login/student", {
// Windows + CMD
// Wireless LAN adapter Wi-Fi
method: "POST",
headers: {
"content-type": "application/json; charset=UTF-8",
},
body: JSON.stringify({ code, password }),
})
.then((response) => {
return response.json();
})
.then((json) => {
const { currentUser, token } = json;
console.log(json);
if (token && currentUser) {
AsyncStorage.setItem("token", token)
.then((value) => console.log("token", value))
.catch((error) => console.log(error));
return navigation.navigate("Darshboard");
} else {
console.log(json);
Alert.alert(json.message);
}
})
.catch((err) => {
console.log(err);
Alert.alert(err.message);
});
};
and this is the result:
Object {
"currentUser": Object {
"__v": 0,
"_id": "5f8be6bf0220db23d096ca14",
"activated": false,
"code": "16020503",
"fullname": "Đỗ Xuân An ",
"password": "$2b$10$PQ5EAc3Vkn1WT00uKadYi.ue2UR1lRBfSeF.cXgZps2pqejV4bAUy",
"profileImage": "https://avataaars.io/?accessoriesType=Prescription01&avatarStyle=Circle&clotheColor=Blue02&clotheType=BlazerSwet
er&eyeType=WinkWacky&eyebrowType=FlatNatural&facialHairColor=Platinum&facialHairType=MoustacheFancy&hairColor=Platinum&hatColor=PastelRed&mouthType=Vomit&skinColor=Brown&topType=LongHairMiaWallace",
"role": "student",
"vnumail": "16020503#vnu.edu.vn",
},
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjoiXCI1ZjhiZTZiZjAyMjBkYjIzZDA5NmNhMTRcIiIsImlhdCI6MTYwMzU1ODYyOSwiZXhwIjoxNjAzNjQ1MDI5fQ.cxOHxddB_ha94ZGXY_XLcCs1MgDJHhZDgbl4GFOzk80",
}
token null
as you can see, i received a json which contains 2 objects is token and currentUser, after that i stored it in the AsyncStorage but it returns null, i am totally newbie with React Native, thank you for help me out and have a good day :)
update:
thanks everyone, i have been figured it out that the AsyncStorage is no longer imported from "react-native", it is now imported from "#react-native-community/async-storage", have a good day
You are missing await before AsyncStorage.setItem()
Modify your code like this:
.then(async (json) => { // Make this async
const { currentUser, token } = json;
console.log(json);
if (token && currentUser) {
await AsyncStorage.setItem("token", token) // add await here
.then((value) => console.log("token", value))
.catch((error) => console.log(error));
return navigation.navigate("Darshboard");
} else {
console.log(json);
Alert.alert(json.message);
}
})
Are you sure you are getting right (non NULL) token and currentUser values after destructuring?
If you are getting null, wrap the statement within parenthesis
({currentUser, token} = json)
Also, an advice, better mask or hide the token value or any other sensitive info before posting :)

Zapier Javascript: Unexpected token ]

In a Zapier Zap, I'm extracting data from Google Sheets and using JS to prettify it to later send in an email. I'm bumping into an error with the following message:
SyntaxError: Unexpected token ]
My code in zap
const data = {
"list_ids": [
"a0b30126-69d6-4822-ac06-bf76c3ff4770"
],
"contacts": [
{
"email": "email",
"first_name": "name",
"custom_fields": {
"e5_T": "list",
"e6_T": "y",
"e7_T": "z"
}
]
}
const res = await fetch('https://api.sendgrid.com/v3/marketing/contacts', {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
'authorization': 'Bearer <<my api key>>'
},
body: JSON.stringify(data),
})
.then(response => response.json())
.then(data => {
console.log('Success:', data);
})
.catch((error) => {
console.error('Error:', error);
});
return { res };
I used code from this blog https://joelaguero.com/how-to-add-a-sendgrid-contact-with-zapier-code-snippets/. Author said it worked for him.
It's because you have more { than }.
You probably forgot about closing } in custom_fields or in contacts.

Download Url with tempauth throws 403 error in Microsoft graph

I have been working to create a filehandler to open file in sharepoint. I have implemented the Oauth to authorize the application.
Upto now i can access the file object as shown below:
{
"#odata.context":"https://graph.microsoft.com/v1.0/$metadata#shares('u%21aHR0cHM6Ly9yYXBpZHBsYXRmb3JtLnNoYXJlcG9pbnQuY29tL1NoYXJlZCUyMERvY3VtZW50cy9maWxlLnRlc3Q_dGVtcGF1dGg9ZXlKMGVYQWlPaUpLVjFRaUxDSmhiR2NpT2lKdWIyNWxJbjAuZXlKaGRXUWlPaUl3TURBd01EQXdNeTB3TURBd0xUQm1aakV0WTJVd01DMHdNREF3TURBd01EQXdNREF2Y21Gd2FXUndiR0YwWm05eWJTNXphR0Z5WlhCdmFXNTBMbU52YlVBeE9XVXhNakE0WkMweU1qVm1MVFEzWVdNdE9XTXpaQzAzWXpaa00yVTVPVGxpWVdJaUxDSnBjM01pT2lJd01EQXdNREF3TXkwd01EQXdMVEJtWmpFdFkyVXdNQzB3TURBd01EQXdNREF3TURBaUxDSnVZbVlpT2lJeE5USTJNemt3TURnMElpd2laWGh3SWpvaU1UVXlOalEzTmpRNE5DSXNJbVZ1WkhCdmFXNTBkWEpzSWpvaU5IRTFlV0pCT1ZONlkyaHFaVmd3WWxKSWRFb3hjelF5YkdGYVUxRjRNRU12VVRsVlNGaG9ZVFJUVFQwaUxDSmxibVJ3YjJsdWRIVnliRXhsYm1kMGFDSTZJall6SWl3aWFYTnNiMjl3WW1GamF5STZJbFJ5ZFdVaUxDSmphV1FpT2lKYVJFa3lUVlJaTTA5WFZYUmFWRUpvV21rd01VMUVRWGRNVjFFMFRrUlJkRnB0V21wTmFsazBUVVJKZDFwVVJtMGlMQ0oyWlhJaU9pSm9ZWE5vWldSd2NtOXZablJ2YTJWdUlpd2ljMmwwWldsa0lqb2lUMWRWTTAxVVZUTk5SRUYwVFVSck1FNXBNREJaYW1NeVRGZEplVnBxUlhSUFJFazFXbFJDYlU1NlRYaFpWRmsxSWl3aWMybG5ibWx1WDNOMFlYUmxJam9pVzF3aWEyMXphVndpWFNJc0ltNWhiV1ZwWkNJNklqQWpMbVo4YldWdFltVnljMmhwY0h4aGJtbHphRUJ5WVhCcFpIQnNZWFJtYjNKdExtOXViV2xqY205emIyWjBMbU52YlNJc0ltNXBhU0k2SW0xcFkzSnZjMjltZEM1emFHRnlaWEJ2YVc1MElpd2lhWE4xYzJWeUlqb2lkSEoxWlNJc0ltTmhZMmhsYTJWNUlqb2lNR2d1Wm54dFpXMWlaWEp6YUdsd2ZERXdNRE5pWm1aa1lXRXlOV0UyT1RoQWJHbDJaUzVqYjIwaUxDSjBkQ0k2SWpBaUxDSjFjMlZRWlhKemFYTjBaVzUwUTI5dmEybGxJam9pTXlKOS5hV0U1WTFGalVYQjNUVkpMYmtWSFMzWkJXVGgxUTJGNE5IRnFTM0U1UTBscGRrNTFZMEZIY0dsd1p6MA')/driveItem/$entity",
"#microsoft.graph.downloadUrl":"https://{tenant}.sharepoint.com/_layouts/15/download.aspx?UniqueId=2d7dfb93-1fae-402a-8219-0126a74d4a37&Translate=false&tempauth=eyJ0eXAiOiJKV1QiLCJhbGciOiJub25lIn0.eyJhdWQiOiIwMDAwMDAwMy0wMDAwLTBmZjEtY2UwMC0wMDAwMDAwMDAwMDAvcmFwaWRwbGF0Zm9ybS5zaGFyZXBvaW50LmNvbUAxOWUxMjA4ZC0yMjVmLTQ3YWMtOWMzZC03YzZkM2U5OTliYWIiLCJpc3MiOiIwMDAwMDAwMy0wMDAwLTBmZjEtY2UwMC0wMDAwMDAwMDAwMDAiLCJuYmYiOiIxNTI2MzkwMDg3IiwiZXhwIjoiMTUyNjM5MzY4NyIsImVuZHBvaW50dXJsIjoiaEdpb1hmbXZjT3cveFJkMWRYNnlMV3d0dHhXSVlkeXg3UERXbmR5MFE0OD0iLCJlbmRwb2ludHVybExlbmd0aCI6IjEyNCIsImlzbG9vcGJhY2siOiJUcnVlIiwiY2lkIjoiWVdZMVlUSmhOR010WldOak15MDBaV1l4TFdJellXSXRPR1ZsWkRNM1pqZGtZekpqIiwidmVyIjoiaGFzaGVkcHJvb2Z0b2tlbiIsInNpdGVpZCI6Ik9XVTNNVFUzTURBdE1EazBOaTAwWWpjMkxXSXlaakV0T0RJNVpUQm1Oek14WVRZNSIsImFwcF9kaXNwbGF5bmFtZSI6IkJQTU4gVEVTVCIsInNpZ25pbl9zdGF0ZSI6IltcImttc2lcIl0iLCJhcHBpZCI6IjMwN2M5NmZkLTZiZTAtNDJiYi1hODNhLWE2ZDFhMGQyMTE4YiIsInRpZCI6IjE5ZTEyMDhkLTIyNWYtNDdhYy05YzNkLTdjNmQzZTk5OWJhYiIsInVwbiI6ImFuaXNoQHJhcGlkcGxhdGZvcm0ub25taWNyb3NvZnQuY29tIiwicHVpZCI6IjEwMDNCRkZEQUEyNUE2OTgiLCJzY3AiOiJhbGxwcm9maWxlcy5yZWFkIiwidHQiOiIyIiwidXNlUGVyc2lzdGVudENvb2tpZSI6bnVsbH0.aDNPQi9rWmVxSFVmemNCV3d5OUpUTTROcFd2WmxKUGdySmV4ZWxkWDU5ST0&ApiVersion=2.0",
"createdDateTime":"2018-05-09T15:02:38Z",
"eTag":"\"{2D7DFB93-1FAE-402A-8219-0126A74D4A37},2\"",
"id":"01P7SZWCUT7N6S3LQ7FJAIEGIBE2TU2SRX",
"lastModifiedDateTime":"2018-05-09T15:02:40Z",
"name":"file.test",
"webUrl":"https://{tenant}.sharepoint.com/Shared%20Documents/file.test",
"cTag":"\"c:{2D7DFB93-1FAE-402A-8219-0126A74D4A37},2\"",
"size":13453,
"createdBy":{
"user":{
"email":"anish#{tenant}.onmicrosoft.com",
"displayName":"Anish Duwal"
}
},
"lastModifiedBy":{
"user":{
"email":"anish#{tenant}.onmicrosoft.com",
"displayName":"Anish Duwal"
}
},
"parentReference":{
"driveId":"b!AFdxnkYJdkuy8YKeD3MaaVPyxX7gqyZNrG2Ojd27BJ6-8E-AHhORQ6Fx04pQ_BGq",
"driveType":"documentLibrary",
"id":"01P7SZWCV6Y2GOVW7725BZO354PWSELRRZ",
"path":"/drives/b!AFdxnkYJdkuy8YKeD3MaaVPyxX7gqyZNrG2Ojd27BJ6-8E-AHhORQ6Fx04pQ_BGq/root:"
},
"file":{
"mimeType":"application/octet-stream",
"hashes":{
"quickXorHash":"1D02as0SaS8K4jo+JF1b5S6PUjo="
}
},
"fileSystemInfo":{
"createdDateTime":"2018-05-09T15:02:38Z",
"lastModifiedDateTime":"2018-05-09T15:02:40Z"
}
}
However I get the 403 error upon requesting the content using #microsoft.graph.downloadUrl
Any help would be highly appreciated. Thanks
Update
I am using express to call the api. The below request returns the file object response as shown above.
if(requestBody.items) {
let [driveItem] = JSON.parse(requestBody.items);
try {
let content = await request.get(`${driveItem}`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
res.render('test', {content: content});
} catch(e) {
res.render('test', {content: e.message});
}
}
but upon requesting the content it throws 403
let fileobject = JSON.parse(content);
let file = await request.get(`${fileobject["#microsoft.graph.downloadUrl"]}`)
I also tried adding content to the url directly, but it didn't work too.
if(requestBody.items) {
let [driveItem] = JSON.parse(requestBody.items);
try {
let content = await request.get(`${driveItem}/content`, {
headers: {
Authorization: `Bearer ${token}`,
},
});
res.render('test', {content: content});
} catch(e) {
res.render('test', {content: e.message});
}
}
I use these methods to get access token.
async function getAccessToken(code, callback) {
let jsonAuth = await request.post({
url: 'https://login.microsoftonline.com/common/oauth2/token',
formData: {
'grant_type' : 'authorization_code',
'code' : code,
'client_id' : config.clientId,
'client_secret' : config.clientSecret,
'redirect_uri' : 'https://simpliapp.herokuapp.com/'
}
});
callback(jsonAuth);
}
function getAuthorizationCode(res) {
res.writeHead(302, {
'Location': `https://login.microsoftonline.com/common/oauth2/authorize?response_type=code&client_id=${config.clientId}&resource=${encodeURIComponent('https://graph.microsoft.com/')}&redirect_uri=${encodeURIComponent('https://simpliapp.herokuapp.com/')}`
});
res.end();
}

Categories