Flask suddenly not receiving request from React client - reactjs

I have React app in front-end (client), calling API provided by Flask back-end (server) via axios package.
Both client and server are running locally. Client: localhost:3000. Server: localhost:5000
The problem is: after many requests, the server can not receive request from client.
Here is the picture of the received requests, which is captured in backend:
As you can see, after some success request, the React app stuck with pending request:
The lastest request: 127.0.0.1 - - [11/Jun/2020 09:34:39] "GET /posts HTTP/1.1" is error 500, but in network tab of chrome, the request is still pending, so i dont know if the server received that request or not. Nothing shown in console log of chrome, no error printed in backend terminal windows (i have some lines of code to print error in backend), just the error 500
What am i doing wrong? If this question is still confused, please comment below and i can update more info about it. Thank you!

The fact that your server is reporting a 500 error, but the request on the client is still pending makes me think that something is wrong on the server side.
To verify this, you can try manually calling raise Exception() in one of your endpoints. Then instead of seeing the error resolve through the react app, you can try calling your endpoint with curl, or a client like Postman. If you are able to see a 500 error there, then the error is likely in your React app. If that request does not resolve, then the error is probably in the server.
Is an error response is being sent to the client? The way to do this in flask is using error handlers.

Thank you for helping me.
i debugged my server and found that 2 request call from react app were served by 1 cursor
(i used 1 connector.cursor for the whole connection => 2 request arrives in one moment => the cursor does not know how to serve the result)
=> Solution: change 2 request to 1 new request to new API, in new API, return the result which is containing both result of that 2 request

Related

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.

localhost http 500 internal server error stripe react

I try to use stripe in my LocalHost, but when I post a request to stripe server, I've got this error :
POST https://localhost:3000/charge 500 (Internal Server Error)
But, on the stripe dashboard, the request have 200 return code. In accord with the support, the problem come from my localhost, but I don't have a idea ...
I have just follow this tutorial : https://stripe.com/docs/recipes/elements-react#setup
Thanks !
It's ok, it's work.
This is why it's work now :
If you are on windows, install BashUbuntu, and make all command in bashUbuntu !
First have a look at the access log. 500 error indicates that your front end has some problems talking to the back end, though the TCP port itself and HTTPD server are alive. In the access log (location depends on your OS) you will see the error. Then you will make further steps.

React axios Cors Policy error with 3rd side server

I have react client that sends get request to my node server using axios, which received in my server after I allowed cors,
and the server passes the request to 3rd side server which I have no access to its configuration at all so I cannot allow cors in that server ,and the request sent with the client Origin of course. For that reason, I get No Access-Control-Allow-Origin error. I read and try many ways to solve that, still without success. Any idea how to solve that?
FYI if I send the request from my server without the client its success.
Edit:
React:
axios.get(host+url).then(...)
Node:
app=express();
....some code here for init auth params(clientId,secret)
and session init
app.get(url,auth.authenticate(failUrl,successUrl);
app.use(auth.init());
The auth.authenticate is libary that after logic that I am not fully aware of taking some params of openid connect authentication, and send get request with all of this params.
At the end of the operation I should be redirected to fail/success url, however I am not even get there.

Ionic App aborting request with response status -1

I'm using Ionic platform for my mobile application. Using angular
$http for sending requests to server.
Intermittently when Mobile app tries to access server $http goes to it's errorCallback with response status -1 only no other
data.
When I check log on server, not able to see any hit.
I've changed timeout of application to 2 minutes using interceptors.
I have used chrome debugger but it won't show anything apart from
request it forms, shows nothing in response and preview columns.
I got that in Ionic we use pre-flight to check if server is alive
before sending actual request. But it's for CORS; we have enabled
CORS on server and thats why app is working good since last 15 days.
Thought of using network packet tracer tool but if call not logged on
server no use of it. as Status -1 says $http aborted the request.
My Question is why it's aborting when I click once and do send
when I click same button again.
Please me help to figure out an issue.
After lots of debugging and surfing over internet for issue.
I guess that an issue was like mobile app sending pre-flight messages and so $http aborting the request and even some time Server played a culprit here how will tell you;
We have server hosted on AWS in where we had Load balancer in different zone and actual API server is in different zone. After changing them to same zone ask, production people to test now they are not getting this issue.
The another reason was we were using unstable mobile networks to test.
If any one have any thing else on this please let me know.

Communication with an API

I have a Symfony2 API and an AngularJS app which consumes it.
I'm facing a problem when trying to connect a member. It should work like this :
The client sends a POST request to the API, on the route /api/public/users/connection. The content of the request is a JSON object like this : {"username":"qzdqzd","password":"qzdqzdc"}
The server verifies the request and send back either a 400 response, with a body containing the error message (such as "This username does not exist."), or a 200 response, with the API key in the content to be stored in a cookie.
I'm facing a very strange problem. I have two instances of the API : one in my computer, in local, and the other one on the web (http://api.galaxia-online.com). When my AngularJS code is configured to request the local API, it works as expected :
It's in french, but you can see in red the error message.
But when I change my AngularJS code to request the distant API, with the same request, I receive a 400 error code, but with no content in the response. Plus, Firefox tells me that I have a CORS problem.
I thought at first that I misconfigured CORS on the server, but! When I try to do the exact same request with a dedicated browser addon (RESTClient in my case), it works perfectly :
So I start to think that the problem could be caused by AngularJS. The request seems valid, and seems to work as it do in RESTClient, but AngularJS doesn't receive anything.
I'll be grateful if someone has a clue.

Resources