У меня есть простое приложение React, которое позволяет выполнять операции CRUD с различными объектами. Он использует RTK Query для взаимодействия с бэкендом, и я хочу использовать его встроенную систему кэширования — аннулирование кеша только тогда, когда мутация выполняется на конечной точке с заданным тегом. Пока у меня открыта только одна вкладка, работает нормально. Если с приложением взаимодействует несколько пользователей, и один из них выполняет мутацию, кеш будет аннулирован только на вкладке браузера этого пользователя. Обновление не будет распространяться на другие браузеры или вкладки, которые в данный момент подключены к приложению. Каждый пользователь должен был бы вручную обновить страницу после того, как другой пользователь выполнил мутацию. Один из способов решить эту проблему — периодически аннулировать кэш , что не идеально, другой — заставить каждый запрос повторно получать данные в фокусе, что еще хуже. Лучшим сценарием было бы каким-то образом обнаружить, что другой пользователь отправил мутацию для данной конечной точки, а затем аннулировать кеш этой конечной точки (по тегам) на каждой другой вкладке браузера, подключенной к приложению. Я ищу решение, которое лучше, чем то, что я уже реализовал, а именно следующее:
Благодаря этому все приложение работает так, как если бы оно было инструментом совместной работы в реальном времени, где каждое изменение, сделанное любым пользователем, немедленно отражается на всех подключенных вкладках браузера. Тем не менее, я думаю, что это слишком сложно, и я чувствую, что заново изобретаю велосипед. Этот сценарий, безусловно, довольно популярен, и должно быть что-то, что я упустил, например, пакет npm, решающий эту проблему, вариант RTK Query, который я пропустил, или известный шаблон проектирования. Конечно, есть несколько пакетов, которые позволяют синхронизировать Redux Store на нескольких вкладках, но это не решает проблему подключения нескольких пользователей с разных устройств.
Он работает нормально, пока у меня открыта только одна вкладка.
Код JS по умолчанию находится на одной вкладке/открытой странице.
Это включает в себя переменные и логику JS, а хранилище Redux — это просто еще одна переменная JS.
RTK Query не предназначен специально для взаимодействия между вкладками. Вам придется написать эту часть самостоятельно.
Если проблема заключается в том, что несколько пользователей взаимодействуют с одним и тем же внутренним сервером, для этого предназначены параметры опроса RTK Query. В качестве альтернативы, да, вы можете заставить сервер отправлять сигнал через веб-сокет, чтобы сообщить клиенту, что ему нужно обновить данные. Но опять же, это то, что вам нужно будет написать самостоятельно, так как это зависит от потребностей вашего собственного приложения.
Спасибо! К счастью, я уже написал часть с WebSocket, и она работает, но я просто хотел подтвердить, что не упускаю ничего очевидного, например известного шаблона проектирования, который следует использовать в таких сценариях. Спасибо за подтверждение!