Node and React app. POST access_token and shop

Highlighted
Shopify Partner
4 0 0

Hello.
I have a sales app made based on the tutorial. What i want to do is: when the user clicks a button to POST the access_token, the shop url to a custom API that i have (this API will get products and other info needed).

Is it possible to access the token and the url in a react component? They are both accessible in server.js file

...
afterAuth(ctx) { const { shop, accessToken } = ctx.session; console.log(`accessToken: ${accessToken}`); console.log(`shop: ${shop}`); ctx.cookies.set('shopOrigin', shop, { httpOnly: false }); ctx.redirect('/'); },
...

 

0 Likes
Highlighted
Shopify Partner
1840 177 707

Hello!

 

Not sure I understand why you want to or need to pass the access token to the React app? Your node app authenticates and receives a token that as you noted you have access to through the Koa context. When your React app performs an action such as a button click which in turn does a request to your node app, that request gets checked whether the token is still valid and thus you can or cannot handle that request. Why would your React app need the token?

 

Maybe I am missing something here so please let me know if that's the case.

 

Best wishes!

Liked this post? You might also like our fantastic upsell apps Candy Rack and Candy Cart or offer free gifts with Gift Box. All made with ❤️  and care by Digismoothie
0 Likes
Highlighted
Shopify Partner
4 0 0

Hi Karl!

Thanks for trying to help me.
What i mean is that when the user clicks the button, i want to connect to an external custom API (not to my node app), build in java, and provide them the token and the url.
How am i supposed to send them if i don't have them in my component when the user clicks the button? (Like should i make a request to my node app, get them somehow and then send them to the external api?)

 

The external API after that will collect all products, collections etc.

(btw it's a sales app)

0 Likes
Highlighted
Shopify Partner
4 0 0

@KarlOffenbergerSo Karl, could you direct me please on the right path for this?

0 Likes
Highlighted
Shopify Partner
1840 177 707

Eh, sorry. Lost track of pending replies.

 

So let me get this right - or try to confirm I understood what you're trying to do.

 

  1. You have a Shopify app that uses node.js as a backend and React as frontend
  2. Your app goes through the standard app auth, receives its token and bob's your uncle
  3. However, once in your app frontend, you want your app frontend to directly communicate with a 3rd party Java application / service that will perform some actions against the Shopify Admin API and therefor needs a valid token?

Point 3 is where I am not sure about whether I understood you correctly and if I did, it is cause for a little concern.

Liked this post? You might also like our fantastic upsell apps Candy Rack and Candy Cart or offer free gifts with Gift Box. All made with ❤️  and care by Digismoothie
0 Likes
Highlighted
Shopify Partner
4 0 0
Yes you got this right.
The thing that i need is to send access token and shop url to the 3rd party api.
0 Likes
Highlighted
Shopify Partner
1840 177 707

Eh... doesn't sound right to me, but then again I don't know the exact circumstances. I mean, really can't advise you here because I honestly don't know the entire scope of requirements and constraints, what that 3rd party application does, why it cannot auth itself but needs your app as a mediator etc etc.

 

Sorries 🤷

Liked this post? You might also like our fantastic upsell apps Candy Rack and Candy Cart or offer free gifts with Gift Box. All made with ❤️  and care by Digismoothie
0 Likes
Highlighted
Shopify Partner
1840 177 707

Might be of interest to you @theopl - Delegating access to subsystems

 

p.s. 👏 Shopify docs team

Liked this post? You might also like our fantastic upsell apps Candy Rack and Candy Cart or offer free gifts with Gift Box. All made with ❤️  and care by Digismoothie
0 Likes
Highlighted
Tourist
9 0 1

Hi Karl, just found your reply to this question. I also got a problem on authentication. I would like to fetch data in the file index.js. But my access_token is accessible in server.js. How can I use the accessToken in index.js as a request header?

 

 
identifyItems(orderNum, emailAdd){
        fetch(`someUrl`, {
            mode: 'no-cors',
            method: 'GET',
            headers: {
                "X-Shopify-Access-Token": ???What should I wirite here???,
                "Content-type": "application/json",
            },
        }).then(response => response.json()).then(resData=>{
            console.log(JSON.stringify(resData));
        })
        
    }

I know it's a silly question....

thanks in advance

0 Likes
Highlighted
Shopify Partner
20 2 14

@Ireneludi I just solved a similar problem. See the solution in my post here, it should help you.

0 Likes