喷枪不实时更新

Question

我一直在使用gunjs构建一个简单的聊天应用程序。但显然，聊天并不是实时更新的。我必须重新加载页面以反映更改。我似乎无法解决这个问题。正在添加聊天记录，但必须重新加载页面才能从get调用中获取它们。如有任何帮助，我将不胜感激。

代码:

import React, { useEffect, useState } from 'react';
import GUN, { SEA } from 'gun';
import { user } from '../auth/userAuth';
import ChatMsg from './ChatMsg';
import { useSelector } from 'react-redux';

function Chat() {
const db = GUN();
const [newMessage, setnewMessage] = useState('');
const [messages, setmessages] = useState([]);
const username = useSelector((state) => state.user.value.username);
useEffect(() => {
console.log(db.get('chat'));
db.get('chat').on((data, id) => {
console.log(data);
});
db.get('chat')
.map()
.on(async (data, id) => {
console.log(data);
if (data) {
const key = '#kewk';
const message = {
who: await db.user(data).get('alias'),
what: data.what,
when: GUN.state.is(data, 'what'),
};
console.log(message);
setmessages((old) =>
[...old.slice(-100), message].sort((a, b) => a.when - b.when)
);
}
});
}, []);
const sendMsg = async () => {

const message = user.get('all-msg').set({ what: newMessage });
console.log(message);
const index = new Date().toISOString();
db.get('chat').set(message);
setnewMessage('');
};
return (
<div className="chatbox">
<div className="all-chats">
{messages.map((message, index) => {
return <ChatMsg message={message} sender={username} key={index} />;
})}
</div>
<div className="message-input-cont">
<input
type="text"
name="new-message"
placeholder="Enter message"
value={newMessage}
onChange={(e) => setnewMessage(e.target.value)}
required
/>
<button onClick={sendMsg}>🎇</button>
</div>
</div>
);
}
export default Chat;

我的userAuth文件看起来像这样:

import GUN from 'gun';
import 'gun/sea';
import { updateUsername } from '../features/user';
import { store } from '../store/store';

//Database
export const db = GUN();
//User
export const user = db.user().recall({ sessionStorage: true });
db.get('alias').on((v) => store.dispatch(updateUsername({ username: v })));
db.on('auth', async (event) => {
const alias = await user.get('alias'); // username string
store.dispatch(updateUsername({ username: alias }));
console.log(`signed in as ${alias}`);
});

Answer 1

在bug和其他东西上获得帮助的最佳位置是http://chat.gun.eco

乍一看，它看起来像两件事:

(1)您没有包含AXE

(这是一件好事，因为AXE在2021年9月处于alpha阶段)

(2)如果您不包含AXE，则必须手动将对等体与GUN(peers)连接

如何连接到另一个浏览器?不幸的是，WebRTC需要一个"信号"。所以我们运行了一堆分散的GUN对等体，它们作为内置信号的中继。你可以在npm安装的GUN库中使用npm start来运行你自己的GUN。

GUN(['http://localhost:8765/gun', ...otherPeersHere])

AXE将自动为您处理对等连接、发现、集群和中继。但它(2021年9月)还没有工作。