WebSocket connection to 'wss://<website>:<port>/ws' failed: - reactjs

I am experiencing a web socket connection error when I have not used web sockets anywhere in my codebase.
Below is an image of my problem:
Breakdown
I have two applications hosted on Heroku, one for the frontend client and one for the backend server. The client is developed with React and the server is developed in Python / Flask. The server is not showing any of these error messages.
This error will periodically show up and I'm not too sure what the root cause is as there's no real way to trace back to the file shown in the image.
All the posts I've found relating to this error has code that uses web sockets in their codebase which is much different from my situation.
I was wondering if anyone else experienced this and found a work-around.

The problem was that I was using the development server in the production environment. This shows how to set up a production environment for Heroku.
Cheers.

Related

Github pages doesnt show HTTP urls

I have a React website hosted on Github Pages, and a Flask Server running to put information on my ArangoDB server which is hosted on a machine that has HTTP address lets call it (http://21.23.24.25:8352)
The problem is that I try to show images which are stored on my local server for e.g.: http://21.23.24.25:8352/data/images/image.jpg
and I'm getting an error: net::ERR_SSL_PROTOCOL_ERROR
How can I bypass this other than creating a new ArangoDB server hosted on another machine, or creating a SSL Certificate on the machine.
I also paid for the pythonanywhere subscription, I thought maybe it was required to bypass the SSL issue. Any ideas?

React consumes API in development, fails after deployment

please help me with the following problem as it already taken me so much time to figure out:
I have an API which I created using PHP and hosted with AWS EC2.
This API is to be consumed by a React frontend app I made, and when I am developing the frontend there are no problems sending and receiving data from the API.
However, after I deploy the app using AWS Amplify, the app loads correctly but fails to connect to the api(i.e. not showing fetched data, unable to post forms)
I read a little bit about proxying but I am not sure it is the solution and if so, how would I implement it.
Thanks a lot in advance.
I resolved the issue.
My problem was that the server was not listening to https port, so the browser blocked the content.

How to deploy a simple json-server?

I completed an online React course and deployed my application to Heroku. During development, I used the 'json-server' module found at https://github.com/typicode/json-server. This served up a folder on my computer which contained a simple json file and a few images for my website while conforming with the REST API. What do I need to do to get the server to operate independently of my machine so that my application can fetch the data ? I have zero experience doing this.
if you mean you want to create a server for your site,
first of all, you need to get a server, which can run nodejs , then you need to deploy and run your JSON server via a nodejs(express) app.
then you can connect to your server via your website/app
in order to do these things, you can follow tutorials
there are lots of tutorials about it.
hope you got the idea.

Google Cloud Server suddenly stopped working with 408 Error

Google Cloud Server suddenly stopped working. Yesterday I got the error , " Error establishing database connection".
Today it is "Request Timeout
Server timeout waiting for the HTTP request from the client"
Any suggestions to get over this issue??
This could happen based on the configuration you have on your app.yaml. If the instances are overloaded you might encounter a 408 when trying to communicate with the server, in that case changing the scaling configuration on your yaml file might fix the issue.
This document can help you with configuration of your yaml file, information with auto and manual scaling, healthcheck, readiness check etc.
And this article would give you general information on how scaling work on App Engine and best practices.
Also, if you’re using WordPress, this is a common issue with WordPress

Production Application Error Reporting for Errors on the Client Side

I have an AngularJS client side application that converts things to YouTube. There is an error occurring when trying to create a playlist on iPhones. I can log YouTube's response to the browser's console, but that doesn't help me since I can't see it. Is there a way to send that client side error to the developer? Is there a good error reporting service I can use? Thanks. My app runs node.js on the server side.
If you plug in the ios device to your computer, with safari then you can debug more easily
http://moduscreate.com/enable-remote-web-inspector-in-ios-6/

Resources