MDB overriding proxy port in package.json

  1. MDB Home Page
  2. Support Main Page
  3. MDB React
Topic: MDB overriding proxy port in package.json

Mike White pro asked 6 years ago

Hi folks, I'm pretty new to programming so excuse me if I fail to provide enough details.

I have a full stack express app that I integrated the MDB React pro them into for the front end.

Somehow the React MDB package is setting or overriding my proxy port setting in 'client/package.json' so I cannot submit data from the front end in the database.

I have had several seasoned devs look at my code base and they cant seem to find the issue. All the routes are configured correctly and we have tested them without the react routes and they are all set correctly.

http://www.istpd.com/assets/images/code-1.jpg

http://www.istpd.com/assets/images/code-2.jpg

http://www.istpd.com/assets/images/code-3.jpg

Does anyone have any tips for finding where the default port is getting set?

Thanks

 

Bartłomiej Malanowski staff pro premium commented 6 years ago

Hi, Mike! I'm afraid I cannot see any of our code in your project. Could you please point me where can I find mdbreact in your repository?

Bartłomiej Malanowski staff pro premium answered 6 years ago

In your package.json, please try to replace: "webpack": "webpack-dev-server -config ./webpack.dev.config.js --watch --open", with: "webpack": "webpack-dev-server --port 3001 --config ./webpack.dev.config.js --watch --open",

Mike White pro commented 6 years ago

Thanks for the response. This breaks things as the backend is running on 3001. I want the front end to run on 8080, AND I need the 3001 proxy to work as well. Seems like webpack wont allow the proxy to work. See a screen grab of the error in the link in the post below

Mike White pro answered 6 years ago

Here's a screen shot of the error. Is there a setting to tell webpack to use a proxy port? http://www.istpd.com/assets/images/code-4.png Also, the issue I'm having might be a web pack bug.... https://github.com/webpack/webpack-dev-server/issues/793 Thanks for the assistance.  

Mike White pro answered 6 years ago

So after hours of rabbit holing on this I found the issue!

It's line 29 - 31 in the file "webpack.dev.config.js"

devServer: {
  historyApiFallback: true
},

needs to change to

devServer: {
  proxy: {
   "*": "http://[::1]:3001"
  }
},

https://github.com/webpack/webpack-dev-server/issues/793

Bartłomiej Malanowski staff pro premium commented 6 years ago

Did it resolve your issue?

Mike White pro commented 6 years ago

Hey Bartłomiej Well mostly. I can now push and pull data from the database after adding the proxy to devServer{} but pages can no longer refresh, so that's a pretty big issue... Any tips?

Dawid Adach pro commented 6 years ago

Mike, what are the symptoms? What do you mean by page no longer refresh?

Mike White pro answered 6 years ago

Hi David, what I mean is that I cannot load any URL of my app except the home page. I can then navigate to the various pages of the app through the nav but If I hit refresh a blank page loads. Then I need to reload the home page and navigate to the page i want to load from there. Its pretty odd and a bit annoying. Any page on the app cannot be refreshed because it loads a blank page again. Does anyone have a working version of the MDB React app running as the front end of an express app? Ie: Express running in the backed and React as the front end? If I could see other versions working I might be able to do some reverse engineering... Thanks for the assistance so far. 
http://localhost:8080/  this loads, and this loads http://localhost:8080/mypage , but if you refresh that a blank page loads
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB React
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: Yes
About author
technoHippy
Pro User
17Support score
4Questions 4Answers
0Snippets likes 0Snippets