Axios API call speed less than Postman's - reactjs

I have API call and it is taking 0.5 seconds in postman whereas the same API call taking 10 seconds with axios. How should I increase this speed?

Actually, in the browser, you make 2 requests, unlike Postman. One is OPTIONS for check CORS and one is GET, POST, etc. Your API server returns a header when OPTIONS request which is Access-Control-Max-Age. Access-Control-Max-Age value stands for how long wait for the next OPTIONS request. May your API was not set an Access-Control-Max-Age header or set for too short therefore your browser always makes 2 requests. Needs to be more investigation here to be sure.

There is no other way for improve speed with Axios because postman is s/w and axios is package lib with different functionality and using your application to run it while postman run api directly thats why its faster than axios.

The Postman isn't a browser so it will not worry about CORS and can send the POST without sending the OPTIONS, so only incurs the cost of the POST.
and your sever may take time to process the OPTIONS request and then the POST request so whether you are using axios or fetch even XHRHttpRequest it will take more time than postman

Related

Axios taking long time to fetch response

I am using Axios instance in a React app to fetch data from GET requests. Backend server is deployed on Heroku(Professional Dyno) and written in Django REST framework. Database is deployed on AWS.
On postman, APIs are giving response in around 2-3 seconds:
Postman Screenshot
But in the react app, response time is around 25-30 seconds.
React app response time Screenshot
Please note that I am calling around 10 different APIs in a single page. Is this affecting the response times?
The problem is, your request got blocked for 18 seconds. When you are executing multiple heavy requests, it's definitely possible that this requests takes some time to be even executed. If you want to check whether this is the reason for it, you could just comment out the other requests an examine what happens.
An interesting request on what blocked means can be found here.

HTTP:TIMEOUT error through mule request connector but api working through postman

I am using mule-4. I am trying to integrate a third-party API(confidential). It is working from the postman and is returning responses within 1 second.
When I wrote a request connector for the same in mule, The API kept giving a timeout exception.
I increased the response timeout to 2 minutes then also got the same error i.e. timeout exceeded.
Please help.
EDIT 1:
I was able to reproduce this issue on postman. SO postman is adding Connection:keep-alive header by default and when this particular header is added then the API gives response within seconds but when this header is missing then the API gives a timeout error.
You are not really providing too much details of the issue. I can give some generic guidelines:
Ensure that there is network connectivity. If you are testing Postman and Mule from the same computer it is probably not an issue.
Ensure host, port and certificates (if using TLS) are the same. Pointing an HTTPS request to port 80 could cause a timeout sometimes.
Enable HTTP Wire logging in Mule and compare with Postman code as HTTP to identify any significant difference between the requests. For example: headers, URI, body should be the same, except probably for a few headers. Depends on the API. This is usually the main cause for differences between Postman and Mule, when the request are different.

Multiple request for 1 endpoint block request to other endpoints

I need to upload multiple pdf’s to an endpoint.
Currently I am bombarding api with 1 pdf per 1 request (using devextreme-react file uploader)
It works fine for 3-5 request but more than that queues them into pending.
The problem is that I also still need an api to handle other endpoints.
Maybe something like telling the browser “use up to 3 parallel requests for this endpoint and leave the rest pending but when I request other endpoints then handle them immidiately”.
How to do that?
My stack is React with Next, axios for request, Django Rest Framework on Back end.

App Engine different response on browser vs postman

I have a nodejs express server running on app engine.
If i make a GET request to https://astral-pursuit-252600.appspot.com/users in the browser it works fine to say unauthorized (401).
If I do the same GET request in postman it returns 400 bad request.
Is there any obvious reason why this is occurring?
This is a known issue with postman. This tool sends certain headers by default that you cannot remove. App Engine does not like them for some reason. I had to use the Insomnia tool instead which does not include default headers.
The first thing that I can think about is that, in order to do an API call, you need to use an API key in your request. You should create one, after that you need to obtain an access token. Your requests should be send to an address like https://astral-pursuit-252600.appspot.com/users?key=YOUR_API_KEY and include in your request a header to contain the access token. Something like this : --header 'authorization: Bearer YOUR_ACCESS_TOKEN'.
In order to do that I do not think you need to change manually each request, but you need to change some POSTMAN settings. You can find here a guide with exactly what setting should be changed for this use case.
You can see more details about this topic and a more detailed guide for doing an API calls here.
In case this was not the issue, could you please provide me your POSTMAN settings? I am pretty sure this is about the way POSTMAN does the requests anyway.

duplicate ajax calls in angularjs

I am using express-jwt to build a restful api. Now the client is making duplicate ajax calls, for the first one the initiator is angularjs and for the second one the initiator is other. The first one gets 204 as the response code and the second one gets 200 as the response code. I tried to debug to get to the source of this duplicate requests, but I am not able to.
Below is the header details for the one with 204 status code
Below is the header details for the one with 204 status code
Can any one suggest what could be the issue?
The first call is OPTIONS type. That's a pre-flight call which a browser sends if the page and api are not on same domain.
The purpose of this call is to deal with CORS. Backend usually needs to send the allowed request method types (GET, POST etc.). The browser will then send the real call if the desired request type is among those returned.
Here's a sample of the response headers.
You can ignore it for all intents and purposes. It does not contain any normally useful payload or return data.
Take a look at AJAX in Chrome sending OPTIONS instead of GET/POST/PUT/DELETE? for more info.
Those two requests are different one is OPTIONS and other is GET.
For cross-domain requests, setting the content type to anything other than application/x-www-form-urlencoded, multipart/form-data, or text/plain will trigger the browser to send a preflight OPTIONS request to the server.
You need to handle in the server when the request method OPTIONS , then you need to exit with out processing.

Resources