Need help to create the server.js to work around the CORS issue

Question

So, I need to hit an API and render the response in a html element. I have my app.js doing this:

let url = 'http://localhost:80/db/abc/query/';

class abc extends Component {
state {userinput:""}

getResponse = () => {
        axios.get(url+this.state.userinput, {
            headers: {
                'Content-Type': 'application/json'
            }
        })
        .then(response => {
            this.setState({results: response.data})
        });
 }

render () { //ignore the render for now
   return ()
}
}
export default abc;

But since I was getting the CORS error, I created a server.js & started the proxy using # node server.js command. But for some reason I keep getting Error 500 back from the API.

Server.js

var express = require('express')
var cors = require('cors')
var app = express()
app.use(cors())
app.use('/', function(req, res) {
    var url = 'https://' +
      req.get('url').replace('localhost:80', 'my-real-host-fqdn:8122') + 
      req.url
    req.pipe(request({ qs:req.query, uri: url })).pipe(res);
  })

app.listen(80, function () {
    console.log('CORS-enabled web server listening on port 80')
    })

I call my getResponse() on a button click, which is working but not included in the excerpt above.

Error Messages:

GET http://localhost/db/abc/query/<userinput> 500 (Internal Server Error)
createError.js:17 Uncaught (in promise) Error: Request failed with status code 500

Errors with proxy server:

CORS-enabled web server listening on port 80
TypeError: Cannot read property 'replace' of undefined

OR

CORS-enabled web server listening on port 80
ReferenceError: request is not defined

I am not very familiar with the server.js file and using express. How does this work, and have I made any mistakes here?

No. I don't have any browser plugins and can't install any due to restrictions. — reactjs_user, Dec 02 '19 at 10:04
add `console.log(url)` after defining it, is that your expected url? concating req.url on the end I suspect not — Lawrence Cherone, Dec 02 '19 at 10:11
also when this code is not on localhost:80, its not going to work — Lawrence Cherone, Dec 02 '19 at 10:13
console.log(url); works fine and gives me the right URL. Also, this is just for testing, once the CORS thing is resolved from the backed I will not do this localhost:80 thing. This is just for my testing right now so I just need a work around at the moment. — reactjs_user, Dec 02 '19 at 10:18
maybe follow the official [guide line](https://create-react-app.dev/docs/proxying-api-requests-in-development/) for proxy routing to avoid CORS issues. — Minato, Dec 02 '19 at 10:37

score 0 · Answer 1 · answered Dec 02 '19 at 10:57

0

So what did the trick for me was removing this line from my server.js:

 req.pipe(request({ qs:req.query, uri: url })).pipe(res);

Posting this here so it helps someone with a similar issue. Thanks for trying to help guys!!

answered Dec 02 '19 at 10:57

reactjs_user

159
1
2
8

score 0 · Answer 2 · answered Dec 03 '19 at 19:32

0

to get host, use req.get('host'). Seems like req.get('url') is the issue.

app.get('/one/two', function (req, res) {
    var url = req.url;
}

How to get the full url in Express?

answered Dec 03 '19 at 19:32

xdeepakv

7,835
2
22
32

Need help to create the server.js to work around the CORS issue

2 Answers2