I have recently developed an React app in which I made HTTP request to external API using Axios library. Then I used gh-pages to deploy it. But it doesn't even show up (it's a blank page). I know GitHub only hosts static pages. The React app is running perfectly fine on localhost.
When I host React App on Localhost using npm start and request data using HTTP GET request using Axios Library. I receive a JSON format data from the API. And I use this data to show on front end of the React App.
But when I host the react app on git hub pages and request for data using the same way. It does not send HTTP requests to the API. And hence webpage is static in nature
have you tried to change http:// to https://?
because browsers nowadays don't let http requests to happen
Related
HTTP Error 404.3 - Not Found
The page you are requesting cannot be served because of the extension configuration. If the page is a script, add a handler. If the file should be downloaded, add a MIME map.
I got this error when accessing react frontend. the app is hosted on the azure app service. so anyone knows how to fix this? is it need to be done in react side?
I have a React application (create-react-app) running on http://localhost:3000/ and I need to send a request to an API (Java with Spring Boot) that is available on "https://review-feature-...api/partner".
However, when I send the request, I get the following error on my Chrome console:
POST https://review-feature-...api/partner net::ERR_CERT_AUTHORITY_INVALID
I've tried to change my React application to run on https://localhost:3000, but it doesn't work because I have a Keycloak authorization server running behind my React app, so I have to find a way to send the request using http://localhost:3000/ anyway.
I've also tried to use the following environment variables (How can I provide a SSL certificate with create-react-app?) but it doens't work.
SSL_CRT_FILE=.cert/server.crt
SSL_KEY_FILE=.cert/server.key
Thanks in advance.
I need to use react js as frontend and yii2 as backend.I've tried create-react-app for installing react. but it serves on port (cant serve on port:80). therefore I'm having trouble to fetch data from the backend.
the error I receive is (CORS error). but actually I need an absolute solution for fetching data from API.
Just a quick question:
I'm building a React/Electron app and inside the React app I've got a few async/await calls to an API. These calls are made with axios and work fine when in development.
When the app is wrapped in Electron, the requests return with a "400 Headers required" error. When running a dev version of React it call the api correctly.
Any idea why this is happening?
I came across the WebRequest Electron method https://electronjs.org/docs/api/web-request. It looks like I could intercept the requests and change the headers, but it seems strange to have to do that.
Thank you for the help! 🙌
It looks like the issue was my CORS proxy https://cors-anywhere.herokuapp.com/.
The 3rd party API I'm calling hasn't got CORS enabled and when I'm developing locally in React, I had to use the CORS proxy.
That being said when I bundle the app inside Electron, the call to https://cors-anywhere.herokuapp.com/ return '400 Header required' since that's how that proxy handles non-CORS related call. If it didn't respond like this you could use it as a general proxy.
So removing the CORS proxy url from my links made the app work inside Electron. By that logic I guess it means that by default the render API calls (coming from React) from inside Electron are not affected by CORS.
I'm trying to integrate my single page React app with GitHub.
I successfully run first stage of authentication, i.e. receiving redirect with code from https://github.com/login/oauth/authorize
The problem is the second part, i.e. POST to https://github.com/login/oauth/access_token
I can't do POST or GET from my web page itself via JavaScript or JQuery. Using $.ajax or $.post all end up with error Access-Control-Allow-Origin.
The app was created with create-react-app and run with npm start.
How can I avoid Access-Control-Allow-Origin error in my scenario? Is there a way to get GitHub token for GitHub API in some other way?
I've tried to do POST with , and it does not complain on Access-Control-Allow-Origin. In fact after .submit() I receive expected response (as per https://developer.github.com/apps/building-oauth-apps/authorizing-oauth-apps/#web-application-flow) but it comes as a file, which Chrome immediately downloads.