Heroku failed to deploy the backend interface written by express

I wrote a small front-end project in Vue. The back-end uses Express, front-end and back-end in two different directories. I use two command line windows locally to open npm start joint call normally. Now I configure the back-end directory separately to heroku and find that the interface is useless.

configure the port in index.js :
const port = process.env.PORT | | 5000;

this is my package.json :

{
  "name": "backend-api",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "start": "node index.js",
    "server": "nodemon index.js"
  },
  "author": "Yeoman_Li",
  "license": "ISC",
  "devDependencies": {
    "body-parser": "^1.18.3",
    "express": "^4.16.4",
    "mongoose": "^5.4.0",
    "webpack": "^4.28.2"
  }
}

I haven"t deployed my front end yet. The problem is that the simple request interface written by my back end doesn"t work right now. no, no, no. It is useless to use postman or browser.

this is the first time I have deployed my code to heroku,.

complete index.js:

const express = require("express");
const mongoose = require("mongoose");
const bodyParser = require("body-parser");

//  
const app = express();

// CORS()
app.all("*", (req, res, next) => {
  // 
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, OPTIONS");
  res.header(
    "Access-Control-Allow-Headers",
    "Content-type, Accept, X-Access-Token, X-Key"
  );
  if ("OPTIONS" == req.method) res.status(200).end();
  else next();
});

//  media
const mediaReq = require("./routes/api/mediaReq");

//  DB 
const db = require("./config/keys").mongoURI;

//  body-parser
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

//  DB
mongoose
  .connect(db)
  .then(() => console.log("MonogoDB Connected"))
  .catch(err => console.log(err));

//  
app.use("/api/mediaReq", mediaReq);

// 
const port = process.env.PORT || 5000;

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

complete route:

//  api 
const express = require("express");
const router = express.Router();

const mediaController = require("../../controllers/media");

// $route GET api/mediaReq/test
// @desc  json
//  test
router.get("/test", (req, res) => {
  res.json({ msg: "test works" });
});

// $route GET api/mediaReq/medias || /medias/:id
// @desc  json
// 
router.get("/medias", mediaController.allMedia);
router.get("/medias/:id", mediaController.byId);
router.post("/medias", mediaController.create);
router.delete("/medias/:id", mediaController.remove);

// 

module.exports = router;
Menu