close all network request in chrome devtool - reactjs

I created a React and Spring boot project (not mvc). I build the React part by using "npm run build" and added the ssl certificate. This project is running inside windows server. But when I make request to backend I can see all the request in dev tools and it is big issue for safety. also when user make request to login it is appeared in chrome devtools username and password. How can I hide them.
Thanks

Related

GSI_Logger Given origin is not allowed in Electron + React application

Being kinda new to React and everything clientside related, I am trying to build a Electron application with React.
At this point I can't tell if that's a good idea, but I wanted to try it.
Currently it works fine (see Github).
However I now wanted to add #react-oauth/google to give users the option to sign into their Google Account to allow the application to access their google drive and I'm struggling with that.
See the testing_auth_2 branch for that.
I enabled the drive-api in GCP and created credentials for a web application, adding http://localhost and http://localhost:3000 as authorised Javascript origins.
Now it works, but only when I start it as a webpage (npm start in my Github)
Starting it as an electron app failes, probably because electron doesnt run under localhost somehow (npm run electron:dev in my github code).
I tried creating Desktop and ios credentials since those dont ned authorised origins but the error persists.
Steps to recreate:
Enable drive api and create credentials in GCP
clone git#github.com:Urr4/electron-archive.git
checkout testing_auth_2 branch
Replace XXX in index.tsx with the client_id
The Google login should work using npm start, but not using npm run electron:dev
Any help is appreciated

You need to enable JavaScript to run this app. Vercel

I just published my React app to vercel, the problem occurs when I make a call from my API, when I see the response from the server "Network" I get this error "You need to enable JavaScript to run this app". I have seen some problems regarding this and it seems that the problem may be in the package.json file, to be more precise in proxy, in this is the endpoint for my API:
"proxy": "https://URL"
Regarding the API, it is published on Heroku.
I have tested the project locally and the program works correctly, but when I run it in vercel I get the error.
just to show an example of how I consume my API this is an example.
const data = await axios.get("/places")
I have already restarted my server on heroku but the problem still continues

How to force HTTPS with create-react-app on heroku

I'm running a very basic react app on Heroku and would like to force https on the production server, while still running localhost on https. I cannot for the life of me figure out how to do this on Heroku.
SSL and domain has been setup and works fine when I manually enter https:// before the domain. But if I manually type http:// this also works.
How do I redirect all http traffic to https for my react app on Heroko. I would like this to happen:
localhost:3000 still works in development
https is forced on production domain
create-react-app still runs without being "ejected"
Typically I'd set this up on the DNS, but Heroku only allows for a CNAME setup, so I cannot do this on the DNS level. I assume a custom server is required like express, but I cannot find any documentation on how to do this for production while stille working normally in development/localhost.

create-react-app live reloading with proxy

We're developing a web app in React using create-react-app. The backend is written in Python and therefore we define a proxy in package.json to forward API calls to it during development as described here.
This, however, seems to interfere with the live reloading of the React development server when a source file is modified. In the Browser console we see:
The development server has disconnected.
Refresh the page if necessary.
And the backend server sees unexpected requests:
127.0.0.1 - - [22/May/2019 08:01:38] "GET /sockjs-node/227/inixucqn/websocket HTTP/1.1" 401 -
Is there any way to fix this? I guess we could configure the proxy manually, but this must be a problem everyone has when using proxy.

React web is not working properly after build (related axios api)

I use
"webpack": "3.8.1" ,
"react": "^16.5.2"
when start to yarn start app is working
but after the yarn build and serve -s build, not to call api. (but react-router is working)
In other words, it does not work for the http request. After the build
But as a yarn start, http request runs well.
(I use proxy in package.json. front-end is react, backend is spring boot)
I suspect your issue is like this. When you are developing you are using a proxy setup in your package.json as you have stated in your question.
When you have this proxy setting, webpack dev server will proxy your request from the client to the server. This is what allows you to leave the baseurl off your request in the app. In other words, because of this proxy you can simply write /api/endpoint/.
When you build and serve using the serve module however, webpack dev server is no longer the one serving your app the the browser, which means there is no more proxying requests from client to server. This means you are making a request to just /api/endpoint/ which means there is no server actually getting your request.
Without actually changing your react code to use the full url including the base url in requests, you would need to actually have the server be responsible for serving the build folder to the web statically. By doing this, your /api/endpoint will point back the server that served the app which is also your api.

Resources