I've ran into a problem where when I host a server with webpack on my local network (Webpack default I suppose), on the laptop that the front-end server is being run, everything works when connecting through localhost or the IPv4. When trying to connect to the website through IPv4 on my desktop I get this error.
createError.js:16 Uncaught (in promise) Error: Network Error
at createError (createError.js:16)
at XMLHttpRequest.handleError (xhr.js:84)
My CORS:
const cors = require('cors');
app.use(cors());
I set CORS before any APIs are created. Also my front-end is being ran my webpack since I'm using CRA. Webpack running front-end on network:
Try Using below code :
app.UseCors(builder =>builder.WithOrigins("http://example.com").AllowAnyHeader());
replace http://example.com with the request origin domain address .
try adding app.use(cors({origin: 'you localhost eg https'}))
this will allow only your localhost to access in your server
Fixed it. Hosted my Node JS server on my network IP instead of my localhost aswell as configured all front-end requests to the network IP. Works like a charm.
app.listen(9999, '192.168.1.226', () => {
console.log(
'Arclight back-end is online.\n',
'',
);
});
Related
I'm new to Ubuntu and Apache.
When I CRUD through Express, instead of using the server´s localhost, server/browser will use my computer's localhost.
If I turn off Express server in localhost, the server's get, post and delete don't work, and I can't seem to find a way to use the server's localhost instead of my computer's.
I've also tried sending my requests to:
http://localhost:8383/decrypted
http://127.0.0.1:8383/decrypted
The routes above throw an error as they are http and server is https.
https://example.com/8383/decrypted
The route about throws error connection refused
https://example.com/8080/decrypted
I tried adding a virtualhost in 8080 and routing it through apache to 8383, but shows the same error as above, connection refused.
How can I make the server use its localhost instead of the user's localhost?
I am setting up a reactjs application on port 3000 as well as a nodejs API server on port 3500 on the same box on the internet. Assume the box has a domain name example.com, and I am using nginx in reverse proxy to receive the end users over https, and internally direct it to the port 3000 of the reactjs server.
On the react code, while calling axios API for a get command, which of the following should I be using:
localhost:3500
http://localhost:3500
https://localhost:3500
example.com:3500
http://example.com:3500
https://example.com:3500
Few tests I did:
Access from my browser the reactjs application successfully as example.com (nginx does the mapping to port 3000)
Using https://reqbin.com/ I was able to access the nodejs server API and get the correct result using: http://example.com:3500/users
Using https instead of http causes an error: SSL connection error Error code: 10035
If end user is supposed to connect over https to the react server, then the react server as well as the nodejs server should be running in https mode, or the browser will block the request and it will never reach the server.
Here is how to:
Run the react server in https mode:
Change nginx reverse proxy configuration to be:
proxy_pass https://localhost:3000;
Changed the URL for the nodejs server that axios is calling from http://localhost:3500 to https://example.com:3500
After npm run build, and upload the build directory to the server, run the following commands:
su
serve -s build --listen 3000 --ssl-cert "/etc/letsencrypt/live/example.com/fullchain.pem" --ssl-key "/etc/letsencrypt/live/example.com/privkey.pem"
Run the nodejs server in https mode:
Change the code of server.js with the following:
const https = require('https');
const fs = require('fs');
const options = {
key: fs.readFileSync('/etc/letsencrypt/live/example.com/privkey.pem'),
cert: fs.readFileSync('/etc/letsencrypt/live/example.com/fullchain.pem')
};
https.createServer(options, app).listen(PORT, ()=>{
console.log(`Server running https on port ${PORT}`)
});
Run the following commands:
su
node server
I have an expo mobile application running on an Android emulator and I'm trying to make a request to a local Node.js API. The request is through HTTPS protocol so I created self-signed certificates to be able to try the application.
Every time I try to make a request to the API Axios throws a Network error.
Network Error
Stack trace:
http://192.168.1.35:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:168381:25 in createError
http://192.168.1.35:19001/node_modules%5Cexpo%5CAppEntry.bundle? platform=ios&dev=true&hot=false&minify=false:168285:26 in handleError
node_modules\event-target-shim\dist\event-target-shim.js:818:20 in EventTarget.prototype.dispatchEvent
node_modules\react-native\Libraries\Network\XMLHttpRequest.js:600:10 in setReadyState
node_modules\react-native\Libraries\Network\XMLHttpRequest.js:395:6 in __didCompleteResponse
node_modules\react-native\Libraries\vendor\emitter\EventEmitter.js:189:10 in emit
node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:416:4 in __callFunction
node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:109:6 in __guard$argument_0
node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in __guard
node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:108:4 in
callFunctionReturnFlushedQueue
[native code]:null in callFunctionReturnFlushedQueue
...
I tried the following:
Configuring the API IP on the mobile application as 10.0.2.2 as suggested in the GitHub issue and didn't work.
Testing the application without HTTPS, which works perfectly fine.
Testing my application on an iOS device, but it has the same behaviour as the Android emulator, it works with HTTP but it does not with HTTPS.
Accessing the HTTPS URL from the emulator's browser, which also works.
My HTTPS server is configured as follows:
const httpsServer = https.createServer(Certificate.getCertificate(), app);
httpsServer.listen(Environment.PORT, "0.0.0.0");
Logger.logInfo(`Listening on port ${Environment.PORT} under HTTPS protocol.`);
In order to create the self-signed certificates, I followed the Heroku guide
I am trying to develop a React Client that consumes the Frappe REST API but on each request I am getting a CORS error. according to the community forum, I have to edit the Nginx conf to allow CORS requests but I am facing this error on my machine (localhost) and the dev server is not Nginx so how can I allow CORS requests on localhost?
// site_config.json
{
// allow all origins
"allow_cors": "*"
// restrict to Origin:
"allow_cors": ["http://demo-site.com"]
}
Reference:
https://github.dev/frappe/frappe/blob/07af98255b6ac9bb3b277fc1b9d6999a86a90e9f/frappe/app.py#L159
I don't think you need to configure CORS, especially during local development.
Let's say your React client is running the port 8080 and Frappe server is on 8000. You can proxy all your requests from localhost:8080 to localhost:8000.
In production, you can generate the static assets and put them in the www folder of the Frappe app.
Add "allow_cors": "*" to common_site_config.json and restart bench
I am running a Node server locally on port 3000. I am using axios in ReactNative app to get and post data from the server.
I am setting the baseURL as:
const axiosObj = axios.create({
baseURL: 'http://localhost:3000'
});
This is not working and resulting in Network Error. However, if I use baseURL like this then it works
const axiosObj = axios.create({
baseURL: 'http://172.XX.X.X:3000'
});
I have also tried with baseURL:http://127.0.0.1:3000 which also doesn't work
I really need it to work with http://localhost:3000 or http://127.0.0.1:3000 without having to provide the actual IP address. Help would be appreciated.
React Native app run on other device, so you can't access localhost or http:127.0.0.1 directly, use
adb reverse tcp:3000 tcp:3000
for react-native app that run on android.
for ios, there is no way to do port reverse.