Error: An unexpected error occurred invoking 'JoinRoom' on the server

Question

我使用 React 和 asp.net 核心 SignalR 服务创建了一个聊天应用程序。但我收到一条错误消息“错误：在服务器上调用 'JoinRoom' 时发生意外错误。”

我在服务器端没有收到任何错误，仅在浏览器控制台上使用它。

My React App.js JoinRoom 方法可用的代码如下所示：

const currentUser = JSON.parse(localStorage.getItem('user'));
  const [connection, setConnection] = useState();
  const [messages, setMessages] = useState([]);
  const [users, setUsers] = useState([]);
  let user;
  let room;

  const joinRoom = async () => {
    try {
      if (localStorage.getItem("user") === null) {
        user = "test";
        room = 1;
      }
      else{
        user = currentUser.name;
        room = currentUser.groupId;
      }
      const connection = new HubConnectionBuilder()
        .withUrl("https://localhost:44316/chat")
        .configureLogging(LogLevel.Information)
        .build();

      connection.on("ReceiveMessage", (user, message) => {
        setMessages(messages => [...messages, { user, message }]);
      });

      connection.on("UsersInRoom", (users) => {
        setUsers(users);
      });

      connection.onclose(e => {
        setConnection();
        setMessages([]);
        setUsers([]);
      });

      await connection.start();
      await connection.invoke("JoinRoom", { user, room });
      setConnection(connection);
    } catch (e) {
      console.log(e);
    }
  }

  const sendMessage = async (message) => {
    try {
      await connection.invoke("SendMessage", message);
    } catch (e) {
      console.log(e);
    }
  }

  const closeConnection = async () => {
    try {
      await connection.stop();
    } catch (e) {
      console.log(e);
    }
  }

  useEffect(() => {
    joinRoom();
  }, []);

  return (
    <Switch>
      <Route exact path="/" component={Home} />
      <Route exact path="/login" component={Login} />
      <Route exact path="/register" component={Register} />
      <Route exact path="/notify"  component={Notify} />
      <Route exact path="/chat"  render={(props) => <Chat {...props} sendMessage={sendMessage} messages={messages} users={users} closeConnection={closeConnection} />}/>      
      <Route exact path="/groups"  component={Groups} />
      <Route exact path="/sendnotify"  component={SendNotification} />

      <Route component={Error} />
    
    </Switch>
  );
}

Answer 1

首先，当组件挂载时，我们使用 useEffect 方法来响应您想要运行的事情，不要在组件内部执行 joinRoom(); 等功能。所以你应该添加：

 useEffect(() => {
    joinRoom();
  }, []);

在您的组件顶部。

Error: An unexpected error occurred invoking 'JoinRoom' on the server

Error: An unexpected error occurred invoking 'JoinRoom' on the server

javascript

reactjs

api

asp.net-core

signalr