Question

我正在开发一个 MERN 堆栈应用程序，今天我将它部署到 Heroku。一切（API，UI）在主页上都运行良好。除了主页，我无法导航到其他页面。

我已经检查了这些问题的答案，但没有任何效果。

React Routing works in local machine but not Heroku

React routes are not working in facebook's create-react-app build

Express status 404 with react-router

我的 heroku 应用链接 - https://af-global-2021.herokuapp.com/ .尝试使用导航进行导航。

检查 Git 中的完整编码 - https://github.com/DeepikaSharma5/AFHost

请帮助我找到我需要做什么才能使用导航。

这是我在根文件夹中的 app.js 页面（节点，我已经删除了一些代码）

const express = require("express");
const cors = require("cors");
const mongoose = require("mongoose");
const nodemailer = require("nodemailer");
const path = require("path");

require("dotenv").config();

const app = express();
const port = process.env.PORT || 6060;

app.use(cors());
app.use(express.json());

const url = process.env.MONGODB_URI;
global.URL = url;

mongoose.connect(url, { useNewUrlParser: true, useCreateIndex: true, useUnifiedTopology: true 
 })

const connection = mongoose.connection

if (process.env.NODE_ENV === 'production') {
  app.use(express.static('client/build'));
}

connection.once("open", () => {
console.log("MongoDB connection successfully")
})

const admin_accept_budject = require("./routers/admin_accept_budject.js")
app.use("/admin_accept_budject", admin_accept_budject)

const admin_side_user = require("./routers/admin_side_user")
app.use("/admin_side_user", admin_side_user)

const admin_keynote = require("./routers/admin_keynote")
app.use("/admin_keynote", admin_keynote)

const admin_supplier = require("./routers/admin_supplier")
app.use("/admin_supplier", admin_supplier)

const AboutUs = require("./routers/AboutUs")
app.use("/aboutus", AboutUs)

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

//Contact Us Email sending configuration
app.post("/contactdata", (req, res) => {
  let data = req.body
  let smtpTransoprt = nodemailer.createTransport({
    service: "gmail",
    port: 465,
    auth: {
      user: "applicationframework2021@gmail.com",
      pass: "applictio435@",
    },
  })
let mailOptions = {
  from: data.email,
  to: "applicationframework2021@gmail.com",
subject: `Message from ${data.name}`,
html: `
    <h3>Informations</h3>
    <ul>
        <li>Name: ${data.name}</li>
        <li>Email: ${data.email}</li>
        <li>Subject: ${data.subject}</li>
    </ul>

    <h3>Message</h3>
    <p>${data.message}</p>
    `,
 }
 smtpTransoprt.sendMail(mailOptions, (err, info) => {
   if (err) {
     res.send(err)
   } else {
     res.send(info)
   }
 })
 smtpTransoprt.close()
})

先谢谢你。

我尝试添加 -> app.get('/*', (req, res) => {res.sendFile(path.resolve(__dirname, 'client', 'build','index.html'));});}

app.get('/*', (req, res) => {res.sendFile(path.join(__dirname, 'client', 'build','index.html'));});}

app.get('*', (req, res) => {res.sendFile(path.resolve(__dirname, 'client', 'build','index.html'));});}

app.get('*', (req, res) => {res.sendFile(path.join(__dirname, 'client', 'build','index.html'));});}

也尝试过像“client/build”、“index.html”这样的方法。那些给我映射错误。所以我删除了它们，然后就没有映射错误了。只有导航不起作用。

无法导航到部署在 Heroku 上的 react（MERN 堆栈）应用中的页面 - 请协助

0 个答案: