无法访问 Heroku 中的 Express 服务器

Question

我在前端使用 React 和 express 服务器创建了一个应用程序。它在本地运行良好，在 Heroku 上部署时出现问题。以下是我的代码

反应：

axios.post('http://localhost:5000/blog/myposts'{email:localStorage.getItem('useremail')})
   .then(response=>{
        this.setState({blogs:response.data});
    })
    .catch(function(err){
         console.log(err);
})

快递：

Index.js：

var express= require('express');
var app = express();
var mongoose=require('mongoose');
var bodyParser=require('body-parser');
var cors=require('cors');
var mongoose=require('mongoose');
var Blogrouter= require('./src/route/Blogrouter')
if(process.env.NODE_ENV === 'production'){
    app.use(express.static('client/build'));
}

mongoose.Promise=require('bluebird');
mongoose.connect('mongodb://****:****@ds257838.mlab.com:57838/blogtest')
    .then(()=> {
        console.log('database connected sucessfully');
    })
    .catch(err=>{
        console.log('App Starting error:', err.stack);
        process.exit(1);
    });

app.use(express.static('public'));
app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));
app.use('/blog',Blogrouter);
var port = process.env.PORT || 5000;
var listener=app.listen(port,function(){
    console.log("Listening to port..."+listener.address().port);
});

Blogrouter.js：

Blogrouter.route('/myposts').post(function(req,res){
    Blog.find({email:req.body.email},function(err,postblog){
        if(err){
            console.log(err);
        }
        else
            res.json(postblog);
    });
});

Heroku 日志：

Build succeeded
2018-03-13T11:58:24.970891+00:00 heroku[web.1]: Starting process with command `yarn server`
2018-03-13T11:58:27.680742+00:00 app[web.1]: yarn run v1.5.1
2018-03-13T11:58:27.812888+00:00 app[web.1]: $ node index.js
2018-03-13T11:58:28.525364+00:00 app[web.1]: Listening to port...59689
2018-03-13T11:58:28.689928+00:00 app[web.1]: database connected sucessfully
2018-03-13T11:58:28.644493+00:00 heroku[web.1]: State changed from starting to up
2018-03-13T11:58:30.507630+00:00 heroku[router]: at=info method=GET path="/static/css/main.67da7fa4.css.map" host=learnhosting.herokuapp.com request_id=ad77ccbf-0af8-42c7-829c-a552c68e2cbe fwd="157.50.235.225" dyno=web.1 connect=0ms service=19ms status=200 bytes=14894 protocol=https
2018-03-13T11:58:30.620808+00:00 heroku[router]: at=info method=GET path="/static/js/main.bfee714b.js.map" host=learnhosting.herokuapp.com request_id=50f8d5ea-0b55-4edf-91a6-67a50b4e70b2 fwd="157.50.235.225" dyno=web.1 connect=0ms service=123ms status=200 bytes=5553317 protocol=https
2018-03-13T11:58:30.792514+00:00 heroku[router]: at=info method=GET path="/service-worker.js" host=learnhosting.herokuapp.com request_id=e00c1b9f-820e-4bba-8f9e-36c58b5b9ac4 fwd="157.50.235.225" dyno=web.1 connect=0ms service=4ms status=200 bytes=3681 protocol=https
2018-03-13T11:58:30.931604+00:00 heroku[router]: at=info method=GET path="/static/js/main.bfee714b.js.map" host=learnhosting.herokuapp.com request_id=5d5d78fa-1878-479d-9841-9306afb7dd11 fwd="157.50.235.225" dyno=web.1 connect=1ms service=1ms status=304 bytes=240 protocol=https
2018-03-13T11:58:30.925296+00:00 heroku[router]: at=info method=GET path="/static/css/main.67da7fa4.css.map" host=learnhosting.herokuapp.com request_id=875d14e1-9368-440f-9658-ece6e8aeb18d fwd="157.50.235.225" dyno=web.1 connect=0ms service=2ms status=304 bytes=238 protocol=https
2018-03-13T11:58:31.730206+00:00 heroku[router]: at=info method=GET path="/service-worker.js" host=learnhosting.herokuapp.com request_id=4a391817-e8ee-4c9f-a56b-2e3eae39cb00 fwd="157.50.235.225" dyno=web.1 connect=0ms service=2ms status=304 bytes=237 protocol=https

当我打开我的应用程序（https://learnhosting.herokuapp.com/myposts）时，它在控制台中显示以下消息

GET http://localhost:5000/blog/myposts 404 (Not Found)
Viewpost.js:31 Error: Request failed with status code 404
    at e.exports (https://learnhosting.herokuapp.com/static/js/main.bfee714b.js:1:173370)
    at e.exports (https://learnhosting.herokuapp.com/static/js/main.bfee714b.js:1:747283)
    at XMLHttpRequest.p.(anonymous function) (https://learnhosting.herokuapp.com/static/js/main.bfee714b.js:1:172370)

Answer 1

您需要将此 URL 更改为“localhost...”。

axios.post('http://localhost:5000/blog/myposts'{email:localStorage.getItem('useremail')})
   .then(response=>{
        this.setState({blogs:response.data});
    })
    .catch(function(err){
         console.log(err);
})

Answer 2

假设您尝试 POST 到同一个域，您可以完全省略域和端口。只需像这样 POST 到 /blog/myposts：

axios.post('/blog/myposts'{email:localStorage.getItem('useremail')})
   .then(response=>{
        this.setState({blogs:response.data});
    })
    .catch(function(err){
         console.log(err);
})