Я создаю музыкальный c сайт плейлиста / блога, используя React, Node / Express и PostgreSQL. Я использую Heroku. Вот ссылка на приложение в реальном времени:
Приложение в реальном времени: https://earth-nights.herokuapp.com/
Когда пользователь нажимает на карту «Earth Nights # 1» на домашней странице, пользователь попадает на страницу контента для этого конкретного списка воспроизведения (https://earth-nights.herokuapp.com/episode/1). Это здорово, но когда я обновляю sh страницу, я вижу только информацию API для этой страницы:
{
"id": 1,
"title": "Earth Nights #1",
"date_of_show": "April 24, 2020",
"teaser": "Welcome to the first Earth Nights playlist!",
"card_image": "https://cdn.technologynetworks.com/tn/images/thumbs/jpeg/640_360/the-psychedelic-revolution-in-psychiatry-333007.jpg"
}
Я следовал инструкциям на этой странице, чтобы отключить все кэширование для Node.js приложений: https://devcenter.heroku.com/articles/nodejs-support#cache -поведение , и проблема все еще возникает.
Есть ли что-то, что я делаю неправильно с кэшированием, или какие-либо другие проблемы, которые вы можете увидеть? Мой код сервера ниже. Я был бы очень признателен за любую информацию, которую вы можете предоставить.
index. js
const express = require('express');
const app = express();
const cors = require('cors');
const pool = require('./db');
const path = require("path");
const PORT = process.env.PORT || 5000;
//middleware
app.use(cors());
app.use(express.json());
app.use(express.static("client/build", {
etag: true, // Just being explicit about the default.
lastModified: true, // Just being explicit about the default.
setHeaders: (res, path) => {
const hashRegExp = new RegExp('\\.[0-9a-f]{8}\\.');
if (path.endsWith('.html')) {
// All of the project's HTML files end in .html
res.setHeader('Cache-Control', 'no-cache');
} else if (hashRegExp.test(path)) {
// If the RegExp matched, then we have a versioned URL.
res.setHeader('Cache-Control', 'max-age=31536000');
}
},
}));
if(process.env.NODE_ENV === "production") {
app.use(express.static(path.join(__dirname, "client/build")));
}
console.log(__dirname);
console.log(path.join(__dirname, "client/build"));
//routes
//get all episodes
app.get('/episode', async (req, res) => {
try {
const allEpisodes = await pool.query("SELECT * FROM card ORDER BY id DESC");
res.json(allEpisodes.rows);
} catch (err) {
console.error(err.message);
}
});
//select one episode
app.get('/episode/:id', async (req, res) => {
try {
const { id } = req.params;
const episodeContent = await pool.query(
"SELECT * FROM card WHERE id = $1", [
id
]);
res.json(episodeContent.rows[0])
} catch (err) {
console.error(err.message)
}
});
app.get('/episode/:id/playlist', async (req, res) => {
try {
const { id } = req.params;
const episodeContent = await pool.query(
"SELECT * FROM playlist WHERE episode = $1", [
id
]);
res.json(episodeContent.rows)
} catch (err) {
console.error(err.message)
}
});
app.post("/send", async (req, res) => {
try {
const { name, email, message } = req.body;
const newMessage = await pool.query(
"INSERT INTO messages (name, email, message) VALUES ($1, $2, $3) RETURNING *", [
name,
email,
message
]
);
res.json(newMessage.rows[0]);
} catch (err) {
console.error(err.message)
}
});
app.get("*", (req, res) => {
res.sendFile(path.join(__dirname, "client/build/index.html"));
});
app.listen(PORT, () => {
console.log(`server has started on http://localhost:${PORT}`);
});