如何解决为什么我的React Project Server路由在部署到Heroku时不起作用
当我在localhost:8000上工作时,一切正常,但是当我将其部署到heroku时,所有路由都无法工作
这是我的server.js:
const express = require("express"),app = express(),cors = require("cors"),port = process.env.PORT || 8000,db = "beuter",path = require("path"),server = app.listen(port,() => console.log(`Listening to on port ${port}`));
app.use(cors());
app.use(express.json());
if (process.env.NODE_ENV === "production") {
app.use(express.static('beuter/build'))
app.get('*',(req,res) => {
res.sendFile(path.resolve(__dirname,'beuter','build','index.html'));
})
}
require("./server/config/database.config")(db);
require("./server/routes/product.route")(app);
这是我的server/routes/product.route.js
:
const product = require("../controllers/product.controller");
var path = require("path");
module.exports = (app) => {
app.get("/api/products",product.index);
// Create a product
app.post("/api/products",product.create);
// Get one product by title_url
app.get("/api/products/:title_url",product.show_title_url)
// Delete a product
app.delete("/api/products/:id",product.deleteProduct)
//Edit a product
app.put("/api/products/:id",product.update)
app.get('*','index.html'));
})
};
这是我的Chrome控制台中的错误
Access to XMLHttpRequest at 'localhost:8000/api/products' from origin 'https://thebeuter.herokuapp.com' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http,data,chrome,chrome-extension,https.
如果您想查看我的代码,这里是github项目: https://github.com/nathannewyen/the-beuter
已更新:
这是前端的Form.jsx:
const addProduct = (e) => {
e.preventDefault();
const product = {
title,title_url,price,description1,description2,description3,description4,description5,img_url1,img_url2,img_url3,img_url4,size,size2,fit,fit2,category,};
axios
.post("https://localhost:8000/api/products",product)
.then((res) => {
if (res.data.errors) {
setErrors(res.data.errors);
} else {
navigate("/");
}
})
.catch((err) => console.log(err));
};
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。