zishuo/message-pusher
1
0
Fork 0
mirror of https://github.com/songquanpeng/message-pusher.git synced 2025-09-27 04:26:31 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: set auto refresh is on by default

Browse Source
This commit is contained in:
JustSong
2024-11-10 16:51:31 +08:00
parent 03b3636d74
commit 0f39a36ec2
1 changed files with 24 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
web/src/components/MessagesTable.js
View File

@@ -8,7 +8,14 @@ import {
Popup, Popup,
Table, Table,
} from 'semantic-ui-react'; } from 'semantic-ui-react';
import { API, openPage, showError, showSuccess, showWarning } from '../helpers'; import {
API,
openPage,
showError,
showInfo,
showSuccess,
showWarning,
} from '../helpers';
import { ITEMS_PER_PAGE } from '../constants'; import { ITEMS_PER_PAGE } from '../constants';
import { renderTimestamp } from '../helpers/render'; import { renderTimestamp } from '../helpers/render';
@@ -20,7 +27,7 @@ function renderStatus(status) {
case 1: case 1:
return ( return (
<Label basic color='olive'> <Label basic color='olive'>
正在投递 正在发送
</Label> </Label>
); );
case 2: case 2:
@@ -53,7 +60,7 @@ function renderStatus(status) {
const MessagesTable = () => { const MessagesTable = () => {
const [messages, setMessages] = useState([]); const [messages, setMessages] = useState([]);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [autoRefresh, setAutoRefresh] = useState(false); const [autoRefresh, setAutoRefresh] = useState(true);
const [autoRefreshSeconds, setAutoRefreshSeconds] = useState(10); const [autoRefreshSeconds, setAutoRefreshSeconds] = useState(10);
const autoRefreshSecondsRef = useRef(autoRefreshSeconds); const autoRefreshSecondsRef = useRef(autoRefreshSeconds);
const [activePage, setActivePage] = useState(1); const [activePage, setActivePage] = useState(1);
@@ -125,14 +132,21 @@ const MessagesTable = () => {
showError(reason); showError(reason);
}); });
checkPermission().then(); checkPermission().then();
const eventSource = new EventSource('/api/message/stream'); const connectEventSource = () => {
eventSource.onerror = (e) => { const eventSource = new EventSource('/api/message/stream');
showError('服务端消息推送流连接出错！'); eventSource.onmessage = (e) => {
}; const newMessage = JSON.parse(e.data);
eventSource.onmessage = (e) => { insertNewMessage(newMessage);
let newMessage = JSON.parse(e.data); };
insertNewMessage(newMessage); eventSource.onerror = () => {
showError('服务端消息推送流连接出错！即将重试...');
eventSource.close();
setTimeout(connectEventSource, 1000); // 1000ms
};
return eventSource;
}; };
const eventSource = connectEventSource();
showInfo('服务器消息推送流已连接，您将实时收到新消息');
return () => { return () => {
eventSource.close(); eventSource.close();
}; };