Dummy Rest API not working on phone React Native - api

I am using http://dummy.restapiexample.com/ API .While using POSTMAN and creating a new employee using POST ,it seems to work .But when I use axios in React Native and do the same thing the POST is returning success response but when I try GET method to get all the new employees I'm not seeing the newly created employee which worked on POSTMAN
This is my POST method
create(){
axios.post('http://dummy.restapiexample.com/api/v1/create',{
"name":this.state.name,
"salary":this.state.sal,
"age":this.state.age
}).then((res)=>console.log(res.data)).then(()=>this.setState({createModal:false})).catch(err=>console.log(err))
}
and this is my GET method
async getData(){
await axios.get('http://dummy.restapiexample.com/api/v1/employees').then((res)=>this.setState({employees:res.data.data},()=>console.log(res.data.data))).catch((err)=>console.log(err))
}

From your example code it seems that you are making a call over http. Note that such calls are blocked by iOS and Android unless you explicitely specify a domain that is allowed to be reached over http.
More information about networking can be found here:
https://reactnative.dev/docs/network
By default, iOS will block any request that's not encrypted using SSL.
If you need to fetch from a cleartext URL (one that begins with http)
you will first need to add an App Transport Security exception. If you
know ahead of time what domains you will need access to, it is more
secure to add exceptions only for those domains; if the domains are
not known until runtime you can disable ATS completely. Note however
that from January 2017, Apple's App Store review will require
reasonable justification for disabling ATS. See Apple's documentation
for more information.
Either allow the domain for non-secure request or use https.

The problem had something to do with running on Android device. Once run on the emulator it seemed to work fine

Related

API for the browser AND react-native apps - how to handle auth?

For the first time, we are developing a new project that needs to support the browser (a website) and a mobile app built on react-native.
We have plenty of experience developing for the web, but little to no experience in the mobile app world.
We are now defining our API and trying to make it work for both platforms - This will be a basic JSON API, running on Flask. The API will have some public endpoints, and some protected ones as well (that require auth). We want a cross platform auth solution.
Typically, for the web, we have always relied on cookie based sessions (encrypted) that frameworks like Flask provide. We have been successfully using these in various scenarios: loading HTML templates directly from the web framework, or even when the frontend application runs on React (same domain + HttpOnly + secure cookies).
The introduction of react-native could potentially bring some new challenges, and some of our developers worry about not being able to continue to use our typical session based cookies - They are advocating to using something like JWT for authorization, for both the browser and app (and yes, I know that we can't compare sessions to token based auth).
I'm not a big fan of token based authorization (for a number of reasons, could entertain that conversation if anyone wants to waste some time...), and I can't seem to understand why we shouldn't stick to our normal encrypted "Cookie" value.
Here is how I imagine this could work, based on using the Flask cookie session:
A user hits /api/login with some credentials
The endpoint will validate the user and return back whatever response + the Set-Cookie header with a value of session=<encrypted string>
Any further requests from the browser/app would send back the cookie value again.
Essentially, nothing would change for typical browser implementations, this is how browsers work by default.
The react-native documentation mentions a few issues with cookie based authentication: https://reactnative.dev/docs/network#known-issues-with-fetch-and-cookie-based-authentication
From what I can gather (my knowledge is extremely limited on this subject), react-native might not always respect the Set-Cookie header. Which is OK - we would just have to make sure to send back the expected header with any further requests.
This, in theory, would fulfil our requirements.
I'm looking for feedback on my "solution", am I missing anything? Did I get HTTP completely wrong?
React Native actually provides networking similar to that of websites developed with basic JavaScript, which also supports cookie based authentication, however there are some serious caveats as mentioned in here
The following options are currently not working with fetch
redirect:manual
credentials:omit
Having same name headers on Android will result in only the latest one being present. A temporary solution can be found here:
https://github.com/facebook/react-native/issues/18837#issuecomment-398779994.
Cookie based authentication is currently unstable. You can view some of the issues raised here:
https://github.com/facebook/react-native/issues/23185
As a minimum on iOS, when redirected through a 302, if a Set-Cookie header is present, the cookie is not set properly. Since the redirect
cannot be handled manually this might cause a scenario where infinite
requests occur if the redirect is the result of an expired session.
Therefore, I would advise against using it as it is unstable and might give you a hard time dealing with it
I also suggest looking into frameworks that handle authentication for you, such as auth0
Hope you find this helpful :)

Try it out functionality of tmdb api not working

When I tried to see data through try it out functionality then it is showing the following error
Error: Network Error
Check the developer tools console, it might have more information on the error.
If you are using an Adblocker, it is possible your Adblocker is blocking the request.
I also tried after disabling adblocker but it also does not work
console showing like this
Why this is happening and what is the solution for this?
Thanks in advance
Try the url in your browser with the API key. You can see the response.
Example :
https://api.themoviedb.org/3/movie/popular?api_key=your_api_key
Found out this is due to extension 'stoplight' in their site. Site Manager has said
"I believe Stoplight has temporarily blocked the "Try it out" feature for our account because too many people were using it as the source
for their apps, and not using api.themoviedb.org for some reason. No
timeline on getting it restored, but that's the problem. - Travis Bell"
follow this thread, In case it gets sorted in future.
https://www.themoviedb.org/talk/600184fc6aa8e0004077e364?page=1#6001bbacbe4b36003d514ac3
Apparently it depends on the way you try to access the data.
In my React application I was using Axios.Which ended up with ReferenceError: response is not defined. (got no response)
Afterwards I tried using the javascript fetch API. It worked good for me
So if you are trying to use it in an app you might want to use the fetch API. If you just encounter network error while using Try it out function on site - then you can copy the link and paste it directly, it should work fine.
Currently, I am using it in my dashboard and I have JWT authentication for the API that I'm using. I have implemented the interceptor to update HTTP HEADERS so I saw I'm passing a header name 'token' and checked there if any unnecessary headers were given or not with not accepting the TMDB API server. So I have sent a clean HTTP request and it's working fine.
All you have to just remove the unnecessary HTTP HEADERS

API connect published api in developer portal can't work

https://new-console.ng.bluemix.net/docs/services/apiconnect/apic_tutorial.html#apic_tutorial_01
Follow previous link to do create loopback project named ibmsvt and do test locally, we can post and get.
then publish this api as running api app on bluemix and we will get api target url and tls file.
type url and tls in api designer invoke, and publish api product again.
check api connect service and we can find that published api product has been published, configure developer portal, and invite developers
login developer portal and register one app
subscribe app to api product and run post command.
We will see that we only get can't post error information...
Please see attachment info for error info and api file.
From the screen capture provided, it looks like you're displaying the logs for the loopback application deployed on bluemix. It also looks like the POST request from APIConnect hit the Bluemix application as well. However, I'm unable to see the exact message of the error. What error did you get when you execute the POST from APIConnect? I suspect the POST did not include the $(request.path), what did you change the invoke url to be ? Can provide the x-ibm-configuration section in your yaml file? It will be located in your /definitions.
Thanks and best regards,
I am just have the exact problem, and struggled for days on redoing the tutorial several times, but still met with the same problem until found the upper reply, and gave me a hint.
In the tutorial, it says like the following:
Update the following fields with the values you copied previously:
Invoke URL: Insert the API target URL. You must specify the secure protocol HTTPS. For example:
apiconnect-ca3283b0-525c-488d-993b-3ab72fca78d0.youremail-dev.apic.mybluemix.net
TLS Profile: Insert the API invoke tls-profile.
For example:
client:Loopback-client
The origininal URL is $(runtime-url)$(request.path)$(request.search).
And the correct URL after updating is like following:
https://apiconnect-ca3283b0-525c-488d-993b-3ab72fca78d0.youremail-dev.apic.mybluemix.net$(request.path)
no slash before $(request.path), and $(request.search) should be deleted.
I also checked a tutorial video, it also do like this, but the screen for this step is passed away very quickly, you will not pay attention to this detail normally.
https://www.youtube.com/watch?v=Qku71JLv8vA&list=PLFa8jnU0KqE2eW5E449ziaurv8obSbcou&index=3&cm_mc_uid=24774488665514672571374&cm_mc_sid_50200000=1468400063

Possible proxy issue with WSO2 API Manager

Whenever I try to add the following endpoint, "http://ws.cdyne.com/phoneverify/phoneverify.asmx", during the Managed API setup process and press the Test button I get an error on the server. ERROR - APIProviderHostObject Error occurred while connecting to backend : "stackOverflow preventing me from showing this link", reason: Connect to ws.cdyne.com:80 timed out
When I try this exact same process on a machine outside of our proxy it works fine. I have gone into the axis2.xml file and added proxy information and even went as far as installing cntlm and setting the proxy to localhost - same error.
I can browse to the above link just fine on this machine.
My environment is Windows 10.
I assume you talk about clicking the Test button when providing Backend Endpoint in API publisher.
The way that Test button works at the moment (as far as I understand) is that it invokes HTTP HEAD method on the endpoint provided (because according to RFC 2616, "This method is often used for testing hypertext links for validity, accessibility, and recent modification.")
Then it checks response. If response is valid or 405 (method not allowed), then the URL is marked as Valid.
Thus sometimes, if backend is not properly following RFC, you might get otherwise working URLs declared as Invalid during the test because of that improper HEAD response evaluation. Obviously, this is just a check for your convenience and you can ignore the check if you know the endpoint works for the methods and resources you need it to work.
So my advice would be to try ignoring the Test and just finishing setting up and publishing the API.
P.S. I am checking it on WSO2 API Cloud but behavior is identical to downloadable API Manager.

REST API Works in Browser, But Not Client

I am developing a REST API, and have found a very interesting problem.
When I access the resources in a web browser (in my case Chrome), everything works fine. However, when I access the resources using a REST client (Google Chrome plugin, web-based client, and a Java applet), NONE of the variables pass to the API. This happens both with GET and POST methods.
I have absolutely no idea why this would be the case, and it's proving very difficult to test the methods before putting them into production (especially with POST methods).
Please help!
At first glance it sounds it could be 2 things:
You are not correctly passing API parameters via your client or
applet
A problem with authentication or cookie management. Does the API require any type of authorization?
Are you forgetting to set a necessary HTTP header?
Do you have control of the API also or is it a third party API? If so, do the params arrive at all or do they arrive empty? What's the error code? - a 403 not authorized (which would make sense if the key doesn't pass) or something else due to missing params.
Try the intermediate step of doing it with CURL form the command line - that'll give you more detail on what's coming back.