Блог

У меня есть навигационная панель, которая должна отображать различную информацию в зависимости от статуса пользователя, вошедшего в систему. Я использую express для бэкэнда, а ejs-в качестве движка просмотра. Способ, которым я это делаю, заключается в следующем:

 <nav class="myNav">
<ul>
    <li><a href="/"><h3 class="bold inline">Find Me Food Now!</h3></a></li>
    <li><a href="/coffeeShops">Home</a></li>
    <li><a href="contact.html">Contact</a></li>
    <div class="justify-end">
        <% if(!userID) {%> 
        <li class="inline"><a href="/register">Sign Up</a></li>
        <li class="inline"><a href="/login">Login</a></li>
        <% }else {%>
        <li><form action="/logout" method="POST"><button class="button button--form navFont">Logout</button></form></li>
        <% } %> 
    </div>
</ul>
 

Переменная «Идентификатор пользователя» — это переменная express res.locals, доступная на всех страницах моего сайта. Это позволяет мне узнать, вошел ли текущий пользователь в систему или нет. Я инициализирую его следующим образом:

 app.use((req, res, next) => {
    res.locals.userID = req.session.user_id;
    next();
});
 

Это работало нормально. Однако недавно я ввел кэширование в свое приложение, чтобы повысить его производительность, но одна неожиданная проблема заключается в том, что теперь содержимое моей навигационной панели не меняется в зависимости от того, вошел ли текущий пользователь в систему или нет. При первом посещении сайта пользователю отображается правильное содержимое, но после этого первого посещения вся страница кэшируется, включая содержимое в навигационной панели. Затем, если вы выйдете из системы и снова посетите эту страницу, содержимое не изменится, так как будет отображаться кэш.

Очевидное решение-просто не кэшировать эту страницу, но я действительно хочу кэшировать ее, потому что это довольно тяжелая страница со значительным количеством изображений, которые меняются не слишком часто (что делает ее идеальной целью кэширования), но я не хочу кэшировать раздел навигационной панели страницы.

Я попытался оставить все содержимое внутри панели навигации нетронутым и передать res.locals.userId в файл javascript, связанный с этой страницей, и на основе этой информации скрыть соответствующий контент с помощью javascript. Таким образом, даже если навигационная панель кэширована, это не будет иметь значения, потому что там будет весь контент, и я могу просто выбрать и выбрать, что я должен показывать пользователям, основываясь на их статусе входа в систему. Но я не смог найти способ передать res.locals в свой файл javascript. Я также попытался перенести эту информацию со своего сервера на сторону клиента, но опять же, я не смог заставить это работать. Я также попытался найти способ кэшировать только определенные части страницы, но не смог найти информацию об этом 🙁

Есть ли способ отображать динамическое содержимое на кэшированной странице? Очевидно, что так и должно быть, но я новичок в веб-разработке, поэтому прошу прощения, если это глупый вопрос.