Authentication flow in React and Django

RikutoNakamura
Excursionist
40 1 5

I'm trying to create an app with Django and React, how should I do the authentication flow?
I would like to know how to solve this problem if the front-end and back-end domains are different.

Replies 13 (13)
shubhamsoni2617
New Member
8 0 0

@RikutoNakamura Hi mate, I am having same doubt, were you able to get through ?

 

RikutoNakamura
Excursionist
40 1 5

Get an access token in the frontend and throw a request to the django backend
You can then use that token to send a request from the backend to the Shopify API
You can also make a request to the ShopifyAPI directly from the frontend if the process is light.

RikutoNakamura
Excursionist
40 1 5

I commented.

shubhamsoni2617
New Member
8 0 0

@RikutoNakamura Thanks, I am getting session token from the frontend and passing the same in django app to call admin api. however, I am getting '[API] Invalid API key or access token (unrecognized login or wrong password)' Am I doing anything wrong here or is there another way to get data from shopify in django. Also, calling graphql api from frontend is working for me. However, since I have to perform heavy operations. I can't call it from frontend.

 

@api_view(('GET',))
@renderer_classes((TemplateHTMLRenderer, JSONRenderer))
def index(request):
    url = 'https://myshop.myshopify.com/admin/api/2021-04/products.json'
    headers = {
        'Authorization': request.headers.get('Authorization')
    },
    r = requests.get(url, headers=headers)
    result = r.json()
    return Response(status=200, data={"res": result})

 

 

RikutoNakamura
Excursionist
40 1 5

Why don't you try using the shopify module?
https://pypi.org/project/ShopifyAPI/

Anonymous
Not applicable

Is your app public or private?

 

If it is private, and not using oauth, the following URL layout should be used:

 

https://{username}:{password}@{shop}.myshopify.com/admin/api/2021-07/{resource}.json

 

Edit: The above is not entirely correct. You can use 'X-Shopify-Access-Token' with the private app's Admin API password (https://shopify.dev/apps/auth/basic-http).

 

If it is public and you have obtained the token via oauth, you should use the header: X-Shopify-Access-Token

Anonymous
Not applicable

Sorry for the double post. My mistake.

shubhamsoni2617
New Member
8 0 0

@Anonymous MIne is public app. I have got the session token from app bridge, are session and access token same ? I am still getting the same error

shubhamsoni2617_0-1625224472793.png

 

Anonymous
Not applicable

Please try removing 'Bearer' from the header value and include just the token.

shubhamsoni2617
New Member
8 0 0

it's still same. 😞

shubhamsoni2617
New Member
8 0 0

@RikutoNakamura I tried by following https://github.com/Shopify/shopify_django_app and app ran successfully. However, when I tried integrating with react and invoked oauth api it gives cors error. Also, I am new to Django.

Anonymous
Not applicable

I've got this wrong. Apologies for the confusion. It seems you were correct to use the 'Authorization' header with 'Bearer' when using a session token obtained via the app bridge.  

shubhamsoni2617
New Member
8 0 0

@Anonymous But  still no luck 😞