How can I authenticate by rest api oauth2

This is not going to be exact to your needs as the grant_type is different, but if may be helpful to understand how others have setup oauth in Wappler. There’s four parts in different posts.

https://community.wappler.io/search?q=google%20oauth%20%26%20photos%20%40Heather_Mann

Thanks @kfawcett @scalaris,

I will go through the documents and try.

I have my own backend project which will be used in mobile app in wappler for all data/authenticate with rest api. Do I still need to make/host web data project to authenticate/get data in mobile app. (mobile app api action don’t have secret ket etc)

Regards

If your backend project already handles authentication and data, then you do not need to host anything for Wappler. You just create a mobile project and use Wappler to create the mobile app and connect it to your backend.

thanks @kfawcett,

Where/How i should give clientid and secret, it is not available in mobile api action but available only in web app oauth?

This is the data, i should be using to get token:
POST {{Server URI}}
Authorization: Basic {{client_id}} {{client_secret}}
Content-Type: application/x-www-form-urlencoded

grant_type=password
&username={{username}}
&password={{password}}

In react, i am giving like this in httpclient -

const ss = ‘client1234900:secret45216546’;
const body = ‘grant_type=password&username=’ + username + ‘&password=’ + password;
const url = ‘https://stscsurvey.cloudjiffy.net/oauth/token’;
const httpOptions = {
headers: new HttpHeaders({
‘Content-Type’: ‘application/x-www-form-urlencoded’,
‘Authorization’: 'Basic ’ + btoa(ss),
‘Access’: ‘/
})

You can see your ss const is being converted using btoa() in the Authorization field. The btoa function is not standard in Wappler, so you’ll need to set up a custom formatter.

I would think your API Action would look something like this.

I am able to get access_token in web app server connect by these settings

However, it is not working and giving 401 error in app connect api action.

SC has form data type but AC has only json or text. It is working only if form data type is selected in SC also.

Any suggestion?

What error do you see in the Network tab for the request?

What do the request headers show as well?

preflight is successful but then 401 error.

  1. Request URL:

https://sheelonline.cloudjiffy.net/oauth/token?

  1. Request Method:

POST

  1. Status Code:

401

  1. Remote Address:

103.217.220.9:443

  1. Referrer Policy:

strict-origin-when-cross-origin

This is the same error, if i use json or text in data type in SC. Only Form works as data type.

401 is an unauthorized response.

Can you post screenshots of the Request Headers? Here’s an example.

Also, the Preview and/or Response tab.

But same this is working in SC when data_type is form is selected. AC don’t have data_type = form and Sc giges same error if data_type is not json or text. (I think passing grant_type, username and password in body is problem, if data_type is not form)

Your first image is only showing the Response Headers. Please show the Request Headers which appear below the Response Headers.

This is response in SC:

{“api”:{“status”:200,“headers”:{“server”:“openresty”,“date”:“Tue, 07 Mar 2023 17:22:18 GMT”,“content-type”:“application/json;charset=UTF-8”,“transfer-encoding”:“chunked”,“connection”:“close”,“vary”:“Origin, Access-Control-Request-Method, Access-Control-Request-Headers”,“x-frame-options”:“DENY”,“x-content-type-options”:“nosniff”,“x-xss-protection”:“1; mode=block”,“set-cookie”:[“JSESSIONID=3BE50B15AC6CFE373C3B0D865F0F6659; Path=/; HttpOnly”],“cache-control”:“no-store”,“pragma”:“no-cache”,“x-resolver-ip”:“103.217.220.249”,“strict-transport-security”:“max-age=15811200”},“data”:{“access_token”:“9R0Z7PaZd-uU4BFlW1jXU2q4ZP0”,“token_type”:“bearer”,“refresh_token”:“Q9VXYhxTqZ9mUek6NNgBOkZGTC0”,“expires_in”:43199,“scope”:“api”,“OAuth2.SESSION_ID”:“3BE50B15AC6CFE373C3B0D865F0F6659”}},

I don’t think you are sending your Client ID and Client Secret in Authorization Header. That is probably why you’re getting a 401 unauthorized response.

Also, what do you see in the Payload tab?

It is set - 'Basic '+var1.value.encodeBase64()

where var1.value is client_id:secret

It doesn’t seem to be working because we do not see the value in the Request Header’s Authorization.

Formatters were not ok, I defined formatters by this post and it is working-

However now i am getting 500 errors

w2 w3

I think the problem is how to pass grant_type etc in data. I checked with following variations-
grant_type=password
username=admin
password=admin

or body =grant_type=password&username=admin&password=admin

or Form data_type is not available in AC api action as in SC api action (where it is working)
regards

This may be another bug in the AC API Action. @George can you confirm?

Your headers say that you’re sending this as application/x-www-form-urlencoded

But the Payload is formatting it as multipart/form-data, although it looks malformed because you shouldn’t see anything other than the key:value pairs unless you click “view source”.

Correctly formed data for multipart/form-data would look like this.

image
image

Since you’re sending as application/x-www-form-urlencodedyour payload should look like this, but it doesn’t for some reason.

grant_type=password&username:admin&password:admin

I’m curious if the SC API Action is honoring the application/x-www-form-urlencoded header you set or if it’s sending everything as multipart/form-data to your API.

If I give grant_Type, username, password separately then the pay load is as below (This is how i am giving data in SC API action and its working) -

regards