Google sign in button with automatic approval of authorizations - javascript

I've seen many threads about it but cannot find a satisfying answer: when using the Google sign-in button (https://developers.google.com/identity/sign-in/web/sign-in), is it possible to already have the authorizations accepted ? Like if I add the client ID of my app somewhere in the Google console ?
For now I'm calling the auth2.grantOfflineAccess when clicking the button (so I can pass the returned code to my backend and make sure the user is from the expected domain).
If you're able to answer the first question and - bonus point - know if what I'm doing after clicking the button is right, you'd be awesome !

Thanks to Steven's comment, I'm now able to have the authorizations accepted by default. Be aware there will still be a second popup (after the one that requests your email and password) to inform you that your admin has granted the app to access your data. Only at your first connection though.
So what you need to do is to follow the third step of this document. They say you only need the plus.me and userinfo.email scopes if you only request the basic profile of the user but it was not working in my case, I also needed the userinfo.profile scope (because I use grantOfflineAccess() ?).

Related

About WebAuthn(FIDO)

I was testing out WebAuthn in front side(this means no backend thingy, like challenge, id, etc.)
Why does icon matter?
When I first tried, I could only auth with a security key. But when I added an icon: undefined to publickey.user.icon, I could auth with Windows Hello. And, even if I insert a REAL icon link, it didn't show up. Windows 10 Edu, the latest version
How can I implement it?
I've found that I could use res(navigator.credentials....).response.attestationObject. Is this the right way to use WebAuthn?
About physical security key
Let's say I've got a security key USB with fingerprint support. Then I put my fingerprint then register with WebAuthn. Then my friend comes in, and he does the registration with his fingerprint. Then would the key(.response.attestationObject) be the same together because it's the same physical fingerprint or be different because it's different fingerprints?
[Partial anwser here, I will be happy to see other answers from community members]
The icon parameter has been removed from the new version of the specification.
Webauthn-1: https://www.w3.org/TR/webauthn-1/#dictionary-pkcredentialentity
Webauthn-2: https://www.w3.org/TR/webauthn-2/#dictionary-pkcredentialentity
It was a property with an a priori authenticated URL e.g. data::/ instead of https://
Can you be more precise?
A security key is usually used by only one user. New credentials are generated each time a user uses the key to register on an application. With the use case you mentions, 2 sets of credentials will be generated by the key and associated with biometric data. There is no chance for user 2 to be logged in as user 1

Can I save a unique ID in paypal side like invoice_id after paypal popup closes

I need to store my application's transaction id in paypal console. ie for every transaction i need to save this id and i need to check the respective transaction in paypal console using this id. I will get this transaction id only after closing the paypal popup. I hear that we can use invoice_id for this. But unfortunate invoice_id can pass only to createOrder. Is ther any option to pass this after paypal popup closes. ie in authorize call or anything. Or is there any other solution. Please help
I would highly recommend doing your createOrder itself on the server side, and setting an invoice_id at that time, rather than patching the order object, which adds much undesired complexity.
Create two routes on your server, one for 'create an order' and one for 'capture order', documented here: https://developer.paypal.com/docs/business/checkout/server-side-api-calls/
The best approval flow to pair with the above is this one: https://developer.paypal.com/demo/checkout/#/pattern/server
If, for some strange reason, you insist on the requirement of patching the invoice_id in after approval, then you would need your 'capture order' route to do an additional (third) API call before that final capture, to patch it in. You can see an update order example here: https://www.paypal.com/apex/product-profile/ordersv2/updateOrder . But don't do this.

How to deal with the captcha when doing Web Scraping in Puppeteer?

I'm using Puppeteer for Web Scraping and I have just noticed that sometimes, the website I'm trying to scrape asks for a captcha due to the amount of visits I'm doing from my computer. The captcha form looks like this one:
So, I would need help about how to handle this. I have been thinking about sending the captcha form to the client-side since I use Express and EJS in order to send the values to my index website, but I don't know if Puppeteer can send something like that.
Any ideas?
This is a reCAPTCHA (version 2, check out demos here), which is shown to you as the owner of the page does not want you to automatically crawl the page.
Your options are the following:
Option 1: Stop crawling or try to use an official API
As the owner of the page does not want you to crawl that page, you could simply respect that decision and stop crawling. Maybe there is a documented API that you can use.
Option 2: Automate/Outsource the captcha solving
There is an entire industry which has people (often in developing countries) filling out captchas for other people's bots. I will not link to any particular site, but you can check out the other answer from Md. Abu Taher for more information on the topic or search for captcha solver.
Option 3: Solve the captcha yourself
For this, let me explain how reCAPTCHA works and what happens when you visit a page using it.
How reCAPTCHA (v2) works
Each page has an ID, which you can check by looking at the source code, example:
<div class="g-recaptcha form-field" data-sitekey="ID_OF_THE_WEBSITE_LONG_RANDOM_STRING"></div>
When the reCAPTCHA code is loaded it will add a response textarea to the form with no value. It will look like this:
<textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="... display: none;"></textarea>
After you solved the challenge, reCAPTCHA will add a very long string to this text field (which can then later be checked by the server/reCAPTCHA service in the backend) when the form is submitted.
How to solve the captcha yourself
By copying the value of the textarea field you can transfer the "solved challenge" from one browser to another (this is also what the solving services to for you). The full process looks like this:
Detect if the page uses reCAPTCHA (e.g. check for .g-recaptcha) in the "crawling" browser
Open a second browser in non-headless mode with the same URL
Solve the captcha yourself
Read the value from: document.querySelector('#g-recaptcha-response').value
Put that value into the first browser: document.querySelector('#g-recaptcha-response').value = '...'
Submit the form
Further information/reading
There is not much public information from Google how exactly reCAPTCHA works as this is a cat-and-mouse game between bot creators and Google detection algorithms, but there are some resources online with more information:
Official docs from Google: Obviously, they just explain the basics and not how it works "in the back"
InsideReCaptcha: This is a project from 2014 which tries to "reverse-engineer" reCAPTCHA. Although this is quite old, there is still a lot of useful information on the page.
Another question on stackoverflow: This question contains some useful information about reCAPTCHA, but also many speculative (and very likely) outdated approaches on how to fool a reCAPTCHA.
You should use combination of following:
Use an API if the target website provides that. It's the most legal way.
Increase wait time between scraping request, do not send mass request to the server.
Change/rotate IP frequently.
Change user agent, browser viewport size and fingerprint.
Use third party solutions for captcha.
Resolve the captcha by yourself, check the answer by Thomas Dondorf. Basically you need to wait for the captcha to appear on another browser, solve it from there. Third party solutions does this for you.
Disclaimer: Do not use anti-captcha plugins/services to misuse resources. Resources are expensive.
Basically the idea is to use anti-captcha services like (2captcha) to deal with persisting recaptcha.
You can use this plugin called puppeteer-extra-plugin-recaptcha by berstend.
// puppeteer-extra is a drop-in replacement for puppeteer,
// it augments the installed puppeteer with plugin functionality
const puppeteer = require('puppeteer-extra')
// add recaptcha plugin and provide it your 2captcha token
// 2captcha is the builtin solution provider but others work as well.
const RecaptchaPlugin = require('puppeteer-extra-plugin-recaptcha')
puppeteer.use(
RecaptchaPlugin({
provider: { id: '2captcha', token: 'XXXXXXX' },
visualFeedback: true // colorize reCAPTCHAs (violet = detected, green = solved)
})
)
Afterwards you can run the browser as usual. It will pick up any captcha on the page and attempt to resolve it. You have to find the submit button which varies from site to site if it exists.
// puppeteer usage as normal
puppeteer.launch({ headless: true }).then(async browser => {
const page = await browser.newPage()
await page.goto('https://www.google.com/recaptcha/api2/demo')
// That's it, a single line of code to solve reCAPTCHAs 🎉
await page.solveRecaptchas()
await Promise.all([
page.waitForNavigation(),
page.click(`#recaptcha-demo-submit`)
])
await page.screenshot({ path: 'response.png', fullPage: true })
await browser.close()
})
PS:
There are other plugins, even I made a very simple one because captcha is getting harder to solve even for a human like me. You can read the code here.
I am strongly not affiliated with 2Captcha or any other third party services mentioned above.
I had created my own solution which is similar to the other answer by Thomas Dondorf, but gave up soon since Captcha is getting more ridiculous and I do not have mental energy to resolve them.
Proxy servers can be used so that the destination site does not detect a load of responses from a single IP address.
(Translated into Google Translate)
I tried #Thomas Dondorf suggestion, but I think the problem with the steps described in "How to solve the captcha yourself" section is that the token of the CAPTCHA it's valid only one time.
I'll try to explain everything in detail below.
WHAT I'M USING
I'm using as first browser (the one that will not solve the captcha) Google Chrome, and as a second browser (the one where i solve the captcha and i take the token) Firefox.
STEPS
I manually solve the captcha on this site https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox.php
I type the following code document.querySelector('#g-recaptcha-response').value in the google chrome console, but I get an error (VM22:1 Uncaught TypeError: Cannot read property 'value' of null
at :1:48), so I just search the token by opening Elements in Google Chrome and searching g-recaptcha-response with CTRL+F
I copy the token of the recaptcha (here is an image to show where the token is, after the text highlighted in green)
I type the following code document.querySelector('#g-recaptcha-response').value = '...'in the firefox console, replacing the "..." with the recaptcha token just copied
I get the following error and, if you then click on the documentation linked, you'll read that the error is due to the fact that a token can be used only one time, and it has of course already been used for the CAPTCHA you just solved to obtain the token itself (so it seems that the only objective of the token it's to say that the CAPTCHA has already been solved, it seems a sort of defense measurement to prevent replay attacks, as said here in the official documentation of the recaptcha.

Sending message on Intercom on user's behalf

does anyone know how to send a message from intercom(https://www.intercom.com/) on user's behalf? I need to set up an event listener that opens intercom chat window and sends a message when a some button is clicked.
i am working with react version of intercom if it helps.
will be very grateful for any hints.
If you are using the Intercom chat widget, you can pre-populate a custom message in the widget on the user's behalf like so
const myCustomMessage = 'Hi there!'
window.Intercom('showNewMessage', myCustomMessage)
Of course, the user still has to actually send the message. This might not be exactly what you wanted but it's an alternative in case you want to fully automate everything except the decision to send the message (which is the right UX in a lot of situations).
Documentation is here.
for those who are in the same trouble:
https://developers.intercom.com/reference#user-or-contact-initiated-conversation
For sending messages on the user's behalf, you may check this out https://developers.intercom.com/intercom-api-reference/reference/create-a-conversation
You may need the user's user_id or id from the reference above to create a conversation. For those who are using MobileSDK or intercom_flutter, the id is not provided within the package or SDK. I found a workaround by using this Search for contacts API to get the id.

make turn on/off or deauthorized user from my app, and list action of user from app

I submitting an app to Facebook with open graph news read type by javascript.
All done so well with flow from user asking for authorized my app, and show the button help user can public the article then they can remove if they want to.
Today I got the request from Facebook need to change my app:
requirements
(https://developers.facebook.com/docs/opengraph/actions/builtin/#read).
Please make sure your users can (1) Turn sharing on/off globally on
each page an article appears. (2) Remove articles they shared within
your app on each page an article appears. (3) Only generate read
actions when you're sure someone is interested in reading the article
- only publish after 10 seconds.
The third request is easy just use timeout to show the button submit after user read article.
The seconds is so hard because I don't know how to full the array list of pass action of user doing with my app include action id and title of article they post which I can use to create "remove link" for each of them if user want to.
The fist request I did search for method of javascript to de-authorized the app from user (not revoke permission) so I can ask user to be reauthorized if they need.
Please help.
Beside I see very nice 2 sample in guild page
https://developers.facebook.com/attachment/OG_App_PublishToggle.png
https://developers.facebook.com/attachment/OG_App_DeleteActivity.png
But they din't give out the link of live site using it.
or may be that is one of Facebook markup similar "recommend box" , but how/where we can get it?
Please advices for the script or sample as Facebook dose will be help full
regards
UPDATE 1 I found the way to reauthorized all app or revoke one permission.
here the function:
var permsNeededPub = "publish_stream";
///notice that if permission is "publish_actions" revoke function not work
function xlfb_revokePerm() {
FB.api("/me/permissions", "delete",{permission:permsNeededPub}, function(response){
console.log(response);
if(response){
console.log(' Remove success '+permsNeededPub);
}
});
}
function xlfb_removeApp() {
FB.api("/me/permissions", "delete", function(response){
console.log("User removed the app from acount: "+response);
});
};
The seconds is so hard because I don't know how to full the array list of pass action of user doing with my app include action id and title of article they post which I can use to create "remove link" for each of them if user want to.
Whenever a user takes an OG action on your site - save the action_instance_id you are getting back from the API call and whatever extra data you might need to your database.
The fist request I did search for method of javascript to de-authorized the app from user (not revoke permission) so I can ask user to be reauthorized if they need.
Why would you want to de-authorize the app?
All that’s required here is to have a global on/off switch for all sharing activity – so if the user sets it to off, then you just don’t publish any actions for him as long as he leaves this setting set to off.

Categories