I have a react application and I’m trying to implement a "Sign in with Ebay" authentication (Like Google/Facebook OAuth process)
So currently In Ebay Developer I defined the callback url to a route in my backend (‘/auth/ebay/callback’), But this is the flow I’m trying to achieve:
- User clicks "sign in with ebay" in my app
- Ebay OAuth popup window shows up
- User authenticates
- Ebay is calling my callback in backend with user’s code
- Closing popup window in React after authentication
- Continue authencation in my app (get user data, access token…)
I’m having trouble in step 5:
When ebay calls my callback route, how can I know the client application that initiated the "auth" request to the code ebay given me?
React -> Ebay Auth popup -> backend callback
My backend has no way to know what client React app made the auth request
Currently this is what I have:
In my React app:
function EbaySignIn() {
const signInWithEbay = () => {
const EBAY_AUTH_URI = 'https://auth.sandbox.ebay.com/oauth2/authorize/.....'
window.open(EBAY_AUTH_URI)
}
return (
<button onClick={signInWithEbay}>
sign in with ebay
</button>
)
}
In my Backend (Node.js + NestJS app):
@Get('/auth/ebay/callback')
public authCallback(@Req() req: Request) {
const ebayCodeForGettingUserData = req.query.code
// Interact with ebay API on behalf of the user....
// Rest of app logic....
}
Is there a way to solve this? can I somehow intercept the http requests that the ebay auth page makes to my backend and somehow make the callback route call from my react?
2
Answers
What i would suggest is that, once the user have logged in through 0auth, you must also define a unique identifier token for them so it can give you response, that if this {Token User} have logged in, you’ll know, if not, then he wasn’t able to logged it in or there was something technical, this is what i do most of the time implementation of 0auth.
The use of state parameter in the OAuth 2.0 protocol was made for this purpose. You can append a state parameter to the EBAY_AUTH_URI which will be sent back as part of the callback success URL. The client_app_id can be added as the state parameter and this can be used to interpret who the callback was initiated for. state parameter is free text and you can have your own custom key-value mapping as well (url encoded and within the realms of URL size management) to manage your applications.
Refer here for more details
https://www.oauth.com/oauth2-servers/server-side-apps/authorization-code/