SignalR 与 React Native Expo:: 什么都没有发生
SignalR with React Native Expo:: NOTHING is happening
我有一个具有消息传递功能的移动应用程序。后端是 .NET Core 6.0 控制台应用程序。前端是 React Native Expo 应用程序。当用户点击“发送”按钮时,它会将消息保存在数据库中并将新消息推送到其他用户的屏幕(目前只是一对一的对话)。一切正常,除非它试图将新消息推送给收件人。我在 Whosebug 上尝试过其他解决方案,但 none 到目前为止很有帮助...
.NET 应用程序托管在 Azure 上,我正在使用实际设备 运行 Expo 应用程序。
新消息没有推送到收件人的屏幕上。我之前收到一些 404 错误,但结果是其他错误。我遍历了代码,它执行了 _messageHub.Clients.All.SendAsync("ReceivedMessage", message);
,但另一个 phone 没有收到新消息。
React Native Expo 代码:
import { HubConnectionBuilder } from '@microsoft/signalr';
import React, { useEffect, useState } from 'react';
export default function Conversation({ navigation, route }: any) {
const [messages, setMessages] = useState([]);
const [message, setMessage] = useState("");
const conversation = route.params.data;
const personId = getCurrentUser().personId;
useEffect(() => {
loadMessages();
try {
const connection = new HubConnectionBuilder()
.withUrl(`${Settings.ApiUrl}/hubs-message`)
.build();
connection.start().then(() => console.log("started"));
connection.on("ReceivedMessage", message => {
console.log(message);
let updateMessage = messages;
updateMessage.unshift(message);
setMessages(updateMessage);
});
}
catch (e) { console.error("error here", e); }
}, []);
const sendMessage = () => {
postUser(`${Settings.ApiUrl}/v1/Message/Send`, {
message: message,
conversationId: conversation.id
}).then((data: any) => {
setMessage("");
let updateMessages = [...messages];
updateMessages.unshift(data.Message);
setMessages(updateMessages);
});
};
....
....
}
.NET核心代码:
Program.cs
builder.Services.AddSignalR();
var app = builder.Build();
...
...
app.UseCors();
app.UseHttpsRedirection();
app.MapControllers();
app.UseAuthentication();
app.UseAuthorization();
app.MapHub<MessageHub>("/hubs-message");
MessageHub.cs //目前没有多少...
[Authorize]
public class MessageHub : Hub
{
}
NotificationService.cs //消息保存到数据库后MessageController调用此方法将新消息推送给接收者
public class NotificationService
{
private readonly IHubContext<MessageHub> _messageHub;
public NotificationService(IHubContext<MessageHub> messageHub)
{
_messageHub = messageHub;
}
...
...
if (newMessageSentData.ActiveOnConversationId == conversationId)
{
try
{
//push new message to receiver
_messageHub.Clients.All.SendAsync("ReceivedMessage", message);
}
catch (Exception ex)
{
//NO exception thrown
var a = ex.Message;
}
}
}
我可以通过迁移到 Azure SignalR 来让它工作。设置起来很容易。这是一个展示如何做到这一点的 YouTube 视频 https://www.youtube.com/watch?v=wpQZrQ6Wnbw&t=759s。
Azure 门户
将SignalR服务添加到我的资源组,并复制Settings组
下的连接字符串
program.cs,
builder.Services.AddSignalR().AddAzureSignalR("[Azure SignalR Connection String]");
var app = builder.Build();
...
...
app.UseAzureSignalR(routes =>
{
routes.MapHub<MessageHub>("/hubs-message");
});
我有一个具有消息传递功能的移动应用程序。后端是 .NET Core 6.0 控制台应用程序。前端是 React Native Expo 应用程序。当用户点击“发送”按钮时,它会将消息保存在数据库中并将新消息推送到其他用户的屏幕(目前只是一对一的对话)。一切正常,除非它试图将新消息推送给收件人。我在 Whosebug 上尝试过其他解决方案,但 none 到目前为止很有帮助...
.NET 应用程序托管在 Azure 上,我正在使用实际设备 运行 Expo 应用程序。
新消息没有推送到收件人的屏幕上。我之前收到一些 404 错误,但结果是其他错误。我遍历了代码,它执行了 _messageHub.Clients.All.SendAsync("ReceivedMessage", message);
,但另一个 phone 没有收到新消息。
React Native Expo 代码:
import { HubConnectionBuilder } from '@microsoft/signalr';
import React, { useEffect, useState } from 'react';
export default function Conversation({ navigation, route }: any) {
const [messages, setMessages] = useState([]);
const [message, setMessage] = useState("");
const conversation = route.params.data;
const personId = getCurrentUser().personId;
useEffect(() => {
loadMessages();
try {
const connection = new HubConnectionBuilder()
.withUrl(`${Settings.ApiUrl}/hubs-message`)
.build();
connection.start().then(() => console.log("started"));
connection.on("ReceivedMessage", message => {
console.log(message);
let updateMessage = messages;
updateMessage.unshift(message);
setMessages(updateMessage);
});
}
catch (e) { console.error("error here", e); }
}, []);
const sendMessage = () => {
postUser(`${Settings.ApiUrl}/v1/Message/Send`, {
message: message,
conversationId: conversation.id
}).then((data: any) => {
setMessage("");
let updateMessages = [...messages];
updateMessages.unshift(data.Message);
setMessages(updateMessages);
});
};
....
....
}
.NET核心代码:
Program.cs
builder.Services.AddSignalR();
var app = builder.Build();
...
...
app.UseCors();
app.UseHttpsRedirection();
app.MapControllers();
app.UseAuthentication();
app.UseAuthorization();
app.MapHub<MessageHub>("/hubs-message");
MessageHub.cs //目前没有多少...
[Authorize]
public class MessageHub : Hub
{
}
NotificationService.cs //消息保存到数据库后MessageController调用此方法将新消息推送给接收者
public class NotificationService
{
private readonly IHubContext<MessageHub> _messageHub;
public NotificationService(IHubContext<MessageHub> messageHub)
{
_messageHub = messageHub;
}
...
...
if (newMessageSentData.ActiveOnConversationId == conversationId)
{
try
{
//push new message to receiver
_messageHub.Clients.All.SendAsync("ReceivedMessage", message);
}
catch (Exception ex)
{
//NO exception thrown
var a = ex.Message;
}
}
}
我可以通过迁移到 Azure SignalR 来让它工作。设置起来很容易。这是一个展示如何做到这一点的 YouTube 视频 https://www.youtube.com/watch?v=wpQZrQ6Wnbw&t=759s。
Azure 门户
将SignalR服务添加到我的资源组,并复制Settings组
下的连接字符串program.cs,
builder.Services.AddSignalR().AddAzureSignalR("[Azure SignalR Connection String]");
var app = builder.Build();
...
...
app.UseAzureSignalR(routes =>
{
routes.MapHub<MessageHub>("/hubs-message");
});