Так что в основном моя проблема в том, что я в основном создавал API только с использованием node / express / mon goose и никогда не обслуживал свои приложения для реагирования, поскольку кто-то всегда делал это за меня в нашем Plesk (я думаю через Apache .)
Теперь, когда я, наконец, делаю некоторые вещи стека MERN для клиента на стороне, мне было интересно, какой «правильный» способ обслуживания приложения React, которое уже было создано.
Express и React-Router cla sh. Под этим я подразумеваю, что если у меня есть страница «О программе» и я от go до example.com/about
, как express узнает, что это страница в моем одностраничном приложении React? Есть только индекс. html все, что связано с маршрутами на моей странице, обрабатывается response-router.
Но что, если это файл или папка? Таким образом, это было моим решением, позволяющим обслуживать оба файла веб-сайта и при этом иметь доступ к маршрутам веб-сайта:
const apps = { //websites are put in this object and iterated through to make the code below less bloated.
example: {
folder: "example-website",
app: express(),
server: null,
port: 80,
protocol: "http",
cert: null,
subdomains: []
}
}
for(let website of Object.keys(apps)){ //Itterate through every website.
website = apps[website]; //Make the website key the website object instead.
const websitePath = path.join(__dirname+`/client/${website.folder}/build`); //Save path to website's build folder for ease of use.
fs.readdir(websitePath, (err, files) => { //itterate through all files in the build folder
if(err){ //log errors.
console.log(err)
} else { //continue if there wasn't an error.
const fileArray = files.filter(file => file !== 'index.html')//remove 'index.html' from the array.
website.app.use('/*', (req,res) =>{
let route = req.params["0"].substring(0, req.params["0"].indexOf('/')); //take the first part of the route.
if(fileArray.includes(route)){ //check if the first part of the route matches a file or folder.
res.sendFile(path.join(__dirname+`/client/${website.folder}/build/${req.params["0"]}`));
} else { //If the list of files doesn't include the route than the route is probably a route within the React App in React-Router
res.sendFile(path.join(__dirname+`/client/${website.folder}/build/index.html`));
}
});
//...more irrelevant code here.
}
})
}
Мне было интересно, был ли это правильный способ справиться с конфликтом между моими одностраничное приложение React использует response-router и способ Express обработки маршрутов.