1

I have created a functioning web app, which runs great on local host. Now I want this app to be accessible through any computer in the local network. I have server.js serving my ReactJS app (this works fine, other computers are able to access this)

const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/*', function (req, res) {
   res.sendFile(path.join(__dirname, 'build', 'index.html'));
 });
app.listen(9000);

This app makes an API call to service (index.js) which stores data to mongodb. This is index.js

const express = require('express')
const bodyParser = require('body-parser')
var cors = require('cors')
const rakeRouter = require('./router/rake_analysis_router')
const mongoose = require('mongoose')

const app = express()
const apiPort = 5000

app.use(bodyParser.urlencoded({ extended: false }))
app.use(cors())
app.use(bodyParser.json())

mongoose.connect('mongodb://127.0.0.1:27017/rake_analysis_db', { useNewUrlParser: true })
const db = mongoose.connection
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', function() {
  console.log('connected!');
});

app.use('/api', rakeRouter)

app.listen(apiPort, () => console.log(`Server running on port ${apiPort}`))

This is the part where it fails. I don't know what is going wrong here. Is it because the mongoDB server is hosted on localhost, or is this web service running only on localhost..? It would be great if someone could give an explanation of the problem and its possible solution.

I'd be happy to add more information if it is required.

10
  • What is the error message? Commented Aug 17, 2020 at 11:38
  • @BalázsSipos I'm not sure where to look for the error message. I have configured the react app to throw error if the network call fails. Thing is if I access the web-app using my local IP(192.168...) on my PC, everything works fine. But if I open this app in another computer, web-app is rendered, but network calls start failing. Commented Aug 17, 2020 at 11:41
  • hmm, how do you make the call? Commented Aug 17, 2020 at 11:44
  • @BalázsSipos This is part of the reactjs app code making the call on click of a button: await api.post(/rake, payload).then(res => { window.alert(Rake inserted successfully); window.location.reload(false); }).catch(err => { window.alert(Could not save data. Please try again later.); }) Commented Aug 17, 2020 at 11:47
  • 1
    instead of this: baseURL: '0.0.0.0:5000/api', try your local ip (192.168...) And check the browsers console, maybe you can see an error there if the app can't reach the address Commented Aug 17, 2020 at 11:52

1 Answer 1

2

As we talked about the problem in the comments we found out that the API's address was wrong.

Correction:

api = axios.create({ baseURL: '0.0.0.0:5000/api', })

baseUrl change to his LAN ip address:

api = axios.create({ baseURL: '192.168...:5000/api', }) 
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.