来自React的SignalR：'HubConnectionBuilder‘未定义-undef
问题描述：来自React的SignalR：'HubConnectionBuilder'未定义-undef
回答： 在React中使用SignalR时，如果出现'HubConnectionBuilder'未定义的错误，可能是由于以下原因：
- 缺少必要的依赖：确保已经安装了SignalR的相关依赖。可以使用npm或yarn来安装相关依赖。例如，使用以下命令安装SignalR的React客户端库：
- 缺少必要的依赖：确保已经安装了SignalR的相关依赖。可以使用npm或yarn来安装相关依赖。例如，使用以下命令安装SignalR的React客户端库：
- 引入错误：确保在使用'HubConnectionBuilder'之前正确引入了相关的模块。在React中，可以使用import语句来引入模块。例如：
- 引入错误：确保在使用'HubConnectionBuilder'之前正确引入了相关的模块。在React中，可以使用import语句来引入模块。例如：
- 确保引入的模块路径正确，并且模块名称与使用的名称一致。
- 版本不兼容：如果你使用的是较旧的版本的SignalR，可能会导致'HubConnectionBuilder'未定义的错误。尝试升级到最新版本的SignalR，并查看相关文档以了解可能的更改。
总结： 当在React中使用SignalR时，如果出现'HubConnectionBuilder'未定义的错误，可以通过检查依赖、引入和版本兼容性来解决问题。确保正确安装了SignalR的相关依赖，正确引入了模块，并尝试升级到最新版本的SignalR。
相关·内容
我想通过signalr从服务器获取数据，并更新React组件的内容。一切都很好。从服务器接收数据，但组件状态无法更新(未定义)。
这是我的代码：
import React, { Component } from 'react';
import { ToastComponent } from '@syncfusion/ej2-react-notifications';
import * as signalR from '@aspnet/signalr';
class Notification extends React.Component {
浏览 0提问于2019-08-04得票数 6
回答已采纳
我正在使用Dot Net Core2.0设置一个新的SignalR react应用程序("@aspnet/signalr")。我想发送自定义头部到SignalR集线器“协商”请求(就像request.headers"MyHeader“= "Header")。
我能够连接到集线器并将数据返回到react应用程序。我曾尝试通过重写传递给"withUrl“的选项中的httpClient来设置自定义头。
使用此处提供的代码，我收到错误：“错误:无法完成与服务器的协商:错误:协商未定义返回的意外状态代码”
当从选项中删除httpClient时，它将连接。
浏览 0提问于2019-01-22得票数 0
当我的应用程序丢失并重新连接到互联网时，我无法再次重新连接到SignalR集线器。除非我关闭应用程序并重新打开。 import React, { Component } from 'react';
import { StyleSheet, TouchableWithoutFeedback, Keyboard, Text, View, TouchableOpacity, Image, Alert, TextInput, FlatList, Button, RefreshControl } from 'react-native';
import * as sig
浏览 18提问于2019-09-12得票数 0
回答已采纳
首先，我对JS和React非常陌生。我正在追问这个问题：我想这是一件非常简单的事情，但我不知道问题出在哪里。
错误：
Failed to compile.
./src/App.js
Line 49:28: 'HubConnectionBuilder' is not defined no-undef
Line 52:28: 'JsonHubProtocol' is not defined no-undef
Line 53:25: 'LogLevel' is not defined no-u
浏览 45提问于2020-05-25得票数 0
回答已采纳
我使用Syncfusion React Toast和singnalr向用户显示弹出通知。但在使用signalr从服务器获取数据并使用获取的值设置消息状态后，toast内容显示其在构造函数中分配的初始值。
import React, { Component } from 'react';
import { ToastComponent } from '@syncfusion/ej2-react-notifications';
import * as signalR from '@aspnet/signalr';
class Notificati
浏览 0提问于2019-08-05得票数 0
我想要setInterval连接检查，但它对我不起作用。有人能给我解释一下为什么和怎么做吗？谢谢!
import React, { Component } from 'react';
import { StyleSheet, TouchableWithoutFeedback, Keyboard, Text, View, TouchableOpacity, Image, Alert, TextInput, FlatList, Button, RefreshControl } from 'react-native';
import NetInfo from "
浏览 5提问于2019-09-14得票数 0
我在react原生应用中使用@microsoft/signalr来连接文档中的基本示例。 useEffect(() => {
let connection = new signalR.HubConnectionBuilder()
.withUrl('https://e-mobile-shop.azurewebsites.net/signalr')
.build();
connection.on('SendNofti', data => {
console.log('s');
});
connection.start()
浏览 14提问于2020-12-16得票数 0
1回答
我正在尝试使用react和SignalR构建一个聊天应用程序。我试着编辑下面的代码。
import * as React from 'react';
import { HubConnection, HubConnectionBuilder } from '@aspnet/signalr';
import * as signalR from '@aspnet/signalr';
class Chat extends React.Component {
constructor() {
super();
th
浏览 2提问于2018-10-10得票数 0
4回答
这是我的聊天javascript
"use strict";
var connection = new signalR.HubConnectionBuilder().withUrl("/chathub").build();
connection.on("ReceiveMessage", function (message) {
var msg = message.replace(/&/g, "&").replace(/</g, "<").replace(/&g
浏览 2提问于2019-01-24得票数 9
回答已采纳
1回答
你好，我正在尝试将一个项目从.net核心迁移到mvc，我有一些关于signalr的问题。
这是关于新mvc项目的工作。
Reference the auto-generated proxy for the hub.
var chat = $.connection.chatHub;
// Start the connection.
$.connection.hub.start().done(function () {
alert("done");
});
但是这个项目是从旧的(.net核心)项目不工作的。错误是：未定义ReferenceError: signalR未定
浏览 2提问于2021-02-06得票数 1
2回答
甚至可以在客户端使用带有香草js的跨域SignalR吗？对我来说，这似乎是不可能的，因为我想我已经尽了一切努力把它设置好。服务器端是.NET Core，客户端只是html、css和普通js。如果我像这样在我的SignalR文件中导入scripts.js：
import HubConnectionBuilder from "@microsoft/signalr"
我犯了个错误
Uncaught TypeError: Failed to resolve module specifier "@microsoft/signalr". Relative reference
浏览 9提问于2021-09-25得票数 1
回答已采纳
有什么区别？
this.hubConnection = new signalR.HubConnectionBuilder()
.withUrl(environment.API_URL + "invoicinghub", {
skipNegotiation: true,
transport: signalR.HttpTransportType.WebSockets
})
.withAutomaticReconnect([0, 2000, 10000, 30000, null])
.build();
和
this.hubConnection = ne
浏览 1提问于2021-10-19得票数 4
回答已采纳
这是我的东西：
Javascript：
var connection = new signalR.HubConnectionBuilder()
.configureLogging(signalR.LogLevel.Debug)
.withUrl("/client/?hub=myHub")
.withAutomaticReconnect().build();
或
var connection = new signalR.HubConnectionBuilder()
浏览 1提问于2021-09-16得票数 0
回答已采纳
我正试图用我的react应用程序获得一个signalR连接，我已经在asp .net内核中创建了集线器，但它似乎无法在我的前端工作。
当涉及到signalR时，我是新的，但是我以前用asp .net核心MVC应用程序创建了它，所以我知道逻辑可以工作。
但是我从来没有用signalR做过任何使用React的事情。所以我需要一些帮助。
让我给你看一些代码SignalR集线器
public class OnConnectionHub : Hub
{
public static int ConnectionCount { get; set; }
public
浏览 20提问于2022-07-14得票数 3
回答已采纳
我正在使用下面的链接在react中实现SignalR
但是，这段代码似乎不符合当前的标准，@aspnet/signalr-client现在已被标记为obselete，并显示必须使用@aspnet/signalr。
我设法找出了创建集线器连接的公认方法是
// create the connection instance
var hubConnection = new signalR.HubConnectionBuilder()
.withUrl("URL", options)
.withHubProtocol(protocol)
.build();
HOwever
浏览 3提问于2019-10-22得票数 1
回答已采纳
3回答
我在用
"@aspnet/signalr": "^1.1.4",
在角8计划中。
不幸的是，文档似乎过时了吗？
文档声称有一种方法
withAutomaticReconnect()
被用作
const connection = new signalR.HubConnectionBuilder()
.withUrl("/chatHub")
.withAutomaticReconnect()
.build();
然而，当我试图输入这个时，我会
属性'WithAutomaticReconnect‘在'H
浏览 3提问于2019-12-14得票数 10
2回答
我正在构建一个客户机，它将包装SignalR库：
export class RealTimeCommunicator {
/** SignalR hub connection */
private hubConnection: HubConnection | null = null;
private buildConnection(url: string): HubConnection {
return new HubConnectionBuilder()
.withUrl(url)
.build();
}
public subscribe(o
浏览 2提问于2018-09-27得票数 3
回答已采纳
我正在使用Redux中的中间件连接到我的signalR集线器，它工作得很完美，我可以接收消息没有问题。
现在，我已经到了想在服务器上调用一个方法来“加入一个组”的地步。
这样做最好的方法是什么？我有一个连接，所以在操作"JOIN_GROUP“上重新创建连接似乎是违反直觉的。
我想当我读xxx的时候，我可能发现了一些东西，所以我可以把它链起来
import {
JsonHubProtocol,
HttpTransportType,
HubConnectionBuilder,
LogLevel,
} from '@microsoft/signalr';
imp
浏览 9提问于2022-01-07得票数 1
回答已采纳
我正在开发一个需要实现聊天的react netive移动应用程序。后端应用编程接口是在Core3.0中开发的，因此我决定创建一个SignalR集线器(Microsoft.AspNetCore.SignalR)并将其用于实时消息。 在客户端，我通过npm '@aspnet/signalr‘v "^1.1.4“安装。(我也尝试过使用包'react-native-signalr‘，但我没有找到跳过协商的方法(如果你们中有谁知道怎么做，请让我知道)。 顺便说一下..。我设置了一个聊天中心，在那之后，我尝试将我的react原生客户端连接到该中心。这是我的组件： import
浏览 18提问于2020-01-15得票数 2
我看到自动重定向已经在signalR js客户机中实现了。我已经将signalR更新为1.1.4版本，之后我尝试创建如下所示的新hubConnectionbuilder：
this.connection = new signalR.HubConnectionBuilder()
.configureLogging(signalR.LogLevel.None)
.withUrl(REMOTE_SOCKET_ENDPOINT, options)
.withAutomaticReconnect()
.build();
我正在处理移动应用程序，当我运行它时
浏览 5提问于2019-10-31得票数 9
回答已采纳
当我尝试连接React客户端应用程序时，我收到403错误，https://<domain of Azure SignalR>/SignalRTestHub禁止，503服务暂时不可用
https://<IP of Azure SignalR>/SignalRTestHub.
但是，当后端应用程序连接时，一切工作正常。前端是怎么回事？代码示例：
Asp.net core
app.UseEndpoints(endpoints =>
{
endpoints.MapHub<SignalRTestHub>("/SignalRTestHub"
浏览 0提问于2021-10-06得票数 1
this.signalr = new signalR.HubConnectionBuilder()
.withUrl('/pipelinehub')
.build();
this.signalr.start();
this.signalr.on('somemethod', function () { ... });
那么，如果我想停止监听这个方法，我该怎么办呢？
浏览 0提问于2020-05-26得票数 0
1回答
我正在测试如何将从json端点获取数据的组件转换为从操作仪表板的signlar端点获得连续更新。我在博客上看到的是，在2021年，我们应该使用反应端的@microsoft/signalr与signalr端点进行通信。
下面是我的测试代码，它接收来自signalr端点的数据并更新组件的状态，但是ShimmeredDetailsList不会用数据重新绘制。建议/批评，什么需要改变这里更新数据一次，间隔(30秒)？也许我的结构不对。对阅读信号有什么建议吗？我们试图只使用office-ui-fabric-react组件。
import React, { Component } from 're
浏览 2提问于2021-02-02得票数 0
我正在尝试测试一个处理SignalR连接的Angular服务，它将SignalR的代码作为InjectionToken。
下面是提供程序文件：
// signalr-provider.ts
import { InjectionToken } from '@angular/core';
export const SIGNALR_TOKEN = new InjectionToken('signalR');
export function signalRFactory() {
return window['signalR'];
}
ex
浏览 1提问于2018-10-02得票数 9
回答已采纳
1回答
我在我的react本地应用程序中使用signalR在post上发表评论。当我第一次尝试连接并评论post时，获取错误:在传输连接到之前不能发送。但是在第一次之后，它运行得很顺利。--我尝试了库，比如@aspnet/signalr和@microsoft/signalr。这两个库都发生了同样的事情。在我看来，我的联系是有问题的。
因为我需要信号在我的应用程序的不同领域，如在评论，通知和消息，所以我创建连接的方式。
import {HubConnectionBuilder, LogLevel} from '@aspnet/signalr';
var connection_count
浏览 2提问于2020-09-23得票数 0
回答已采纳
我在3.1.2版(2019年9月19日)中使用创建了自己的React应用程序。我试图为Web套接字请求配置代理，但是当我使用代理时，似乎没有建立连接。我用了的例子来设置我的东西。例如，服务器是Asp.Net核心，只要将地址连接到initalization中，服务器就能工作。这段代码片段起作用：
const hubConnection = new HubConnectionBuilder()
.withUrl("https://localhost:44392/chatHub")
.build();
但这并不是：
const hubConnection = new HubC
浏览 4提问于2019-09-24得票数 6
回答已采纳
如何使用SignalR将内容从服务器发送到客户端？我创建了类似于bellow的send方法： public async void SendData(string data)
{
await Clients.All.SendAsync("ReceiveMessage", data);
} 我的javascript： "use strict";
var connection = new signalR.HubConnectionBuilder().withUrl("/somemsg").build();
浏览 77提问于2021-10-06得票数 0
我为android (kotlin)使用了实现'com.microsoft.signalr:signalr:6.0.8‘，后端是.Net 6，但是模拟器无法连接到服务器(本地主机)。我尝试编写一个函数来检查hubConnection.connectionState，它是断开连接的。没有发生错误。有人能引导我找到错误吗，这是代码：
import com.microsoft.signalr.Action1
import com.microsoft.signalr.HubConnection
import com.microsoft.signalr.HubConnectionBuilder
浏览 22提问于2022-09-07得票数 0
我有一个运行SignalR的第三方服务器。为了连接到该服务器并读取消息，我创建了一段javascript代码，它应该在ec2 (Linux)实例上的NodeJS上运行。问题是，当我尝试运行只连接到服务器的代码时，我得到了这个错误：.node_modules/signalr/jquery.signalR.js:1085 }(window.jQuery，window)；^
ReferenceError:未定义窗口
什么样的窗户？我有一个只支持ssh的linux服务器？我现有的JS代码是这样的：
const signalR = require("signalr"); //here i
浏览 54提问于2019-11-27得票数 1
回答已采纳
我正在尝试在离子/角度2应用程序中使用SignalR。
我正在构建一个简单的Hub，如下所示：
const accessToken = authManager.getRawAccessToken();
let hubUrl = environment.baseUrl + 'messages';
if (accessToken) {
hubUrl += '?authToken=' + accessToken;
}
this._hubConnection = new HubConnectionBuilder()
浏览 30提问于2018-06-18得票数 1
回答已采纳
我第一次尝试使用SignalR将长时间运行过程的进度反馈给用户。
我已经找到了一些.Net核心示例，但最近的例子似乎是使用了较早版本的SignalR。
我正在努力争取得到"ConnectionId“。我读过无数这样的问题和答案，但似乎仍然无法得到正确的价值。
这是我从我找到的演示项目中获得的代码：
// Helper functions added for test purposes
function openConnection() {
progressConnection = new signalR.HubConnectionBuilder().withUrl("/
浏览 1提问于2018-11-28得票数 1
回答已采纳
继续得到下面的这个错误：
localhost:3000/negotiate?negotiateVersion=1 404 (未找到)错误:无法完成与服务器的协商:错误:未找到错误:无法启动连接:错误:未找到
这是软件版本
<PropertyGroup>
<TargetFramework>netcoreapp3.1</TargetFramework>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="Microsoft.AspNet
浏览 147提问于2020-05-14得票数 0
我在signalr集线器断开连接时调用函数时遇到问题。
下面是我的js参考。
<script src="~/js/jquery.min.js"></script>
<script src="~/SignalR/dist/browser/signalr.min.js"></script>
cshtml文件中的脚本
var connection = new signalR.HubConnectionBuilder()
.withUrl("/chatt", {
accessTokenFacto
浏览 7提问于2021-01-26得票数 0
1回答
我无法在我的asp.net核心后端调用集线器方法，
这是我的CommentHub in flutter：
import 'package:signalr_client/signalr_client.dart';
import 'package:logging/logging.dart';
import 'package:xperience/models/global.dart';
final serverUrl = "http://" + base + ":8070/CommentHub/";
final
浏览 11提问于2020-04-15得票数 2
我从未使用过Signalr，也找不到如何显示服务器时间并在客户端上使用signalr更新服务器时间的示例。
这是枢纽
public class ClockHub : Hub
{
public async Task DisplayTime()
{
await Clients.All.SendAsync("DisplayTime", DateTime.Now.TimeOfDay);
}
}
在客户端我有这个
var connection = new signalR.HubConnectionBuilder().withUrl("/cl
浏览 3提问于2019-12-05得票数 1
我正在尝试使用从构建的模板构建hello扩展。
通过添加清单，我能够创建铬扩展：
manifest.json
{
"manifest_version": 2,
"name": "Demo React-Chrome extension",
"description": "This extension shows how to run a React app as a Chrome extension",
"version": "1.0",
"permis
浏览 3提问于2016-12-27得票数 14
回答已采纳
我试图从一个新的React Native Expo应用程序连接到我的SignalR集线器，但我一直收到一个错误，尽管错误的性质尚不清楚，因为错误中没有提供任何数据。
正如我所说的，这是一个全新的世博会应用程序，所以代码非常简单：
import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { HubConnectionBuilder, Log
浏览 6提问于2021-09-12得票数 3
1回答
我将React与react挂钩和SignalR一起使用。我有一些链接到输入字段的常量属性 const [name, setEmployeeName] = useState<string>('');
const [id, setEmployeeId] = useState<string>('');
const [project, setProjectName] = useState<string>(''); 然后按照聊天教程在useEffect中设置连接和订阅，如下所示 useEffect(() => {
浏览 16提问于2020-03-31得票数 0
正在尝试使用功能键(AuthorizationLevel.Function)保护我的azure功能 我的azure函数使用signalR。如果我在协商和其他函数入口点上使用AuthorizationLevel.Function，当javascript代码连接到signalR: function时，我如何传递function键： public static SignalRConnectionInfo Negotiate(
[HttpTrigger( AuthorizationLevel.Function, "post" )] HttpRequest
浏览 33提问于2020-10-30得票数 1
我在搞乱Blazor + SignalR的连接。我希望使用JWT授权对SignalR的调用。 基本上，我想附加到SignalR调用JWT 这是我的Blazor WASM SignalR代码 @page "/"
@using Microsoft.AspNetCore.SignalR.Client
@inject NavigationManager NavigationManager
@implements IDisposable
<div class="form-group">
<label>
User:
浏览 32提问于2020-06-14得票数 0
回答已采纳
我正在使用signalr_core连接到signalr。我创建的代码如下所示，这个连接没有问题。 SignalRNotification() {
if (this._hubConnection == null) {
var options =
IOClient(HttpClient()..badCertificateCallback = (x, y, z) => true);
this._hubConnection = HubConnectionBuilder()
.withUrl(serverUrl, opt
浏览 22提问于2021-04-15得票数 0
回答已采纳
早上好，我希望有人能给我指个方向。
我正在从angularJs迁移到Angular6，并希望使用@aspnet/signalr npm package。
我正在尝试设置signalR连接，但遇到问题。我以前使用jquery signalR的连接如下所示。
$.connection.hub.url = 'https://test.localhost.com/api/signalr';
$.connection.hub.qs = "Access-Control-Allow-Origin=*";
var hub = $.connection.servicelog;
h
浏览 16提问于2018-09-08得票数 0
1回答
在我的环境下：
与Mvc .NetCore 2.2
WebAPI in WebAPI .Net Core2.2
基于openid的AzureAd认证
我们在SignalR连接方面有一些问题。
使用尝试1，我们能够在我们的开发环境(localhost)中正确地使用signalR，但是当我们在生产中部署它时，我们收到了错误：
“'wss://xxxxxxxxx:60000/PushNotificationHub?access_token=‘的 WebSocket连接失败:WebSocket握手时出错:意外响应代码: 400”
尝试1
connessioneServizi
浏览 3提问于2019-04-30得票数 0
回答已采纳
1回答
我无法使用Nodejs使用Angular + Azure函数建立连接。我知道后端是可以工作的，因为我使用以下documentation创建了它，并使用文档中提供的客户端URL对其进行了测试。消息传递跨多个客户端工作。 所以现在我正试着让Angular工作。我已经在Angular中为signalr创建了一个服务来建立连接，但是我得到了错误 ? ? 并在网络选项卡上 ? 我还尝试在service中替换此代码。 private buildConnection = () => {
this.hubConnection = new signalR.HubConnectio
浏览 23提问于2020-06-13得票数 0
回答已采纳
您好，我使用orleans和signalR启动并运行了一个应用程序，我使用HubConnectionBuilder来初始化我的SignalRClient，如下所示 public async Task<HubConnection> InitSignalRCLient()
{
Program.WriteConsole("Starting SignalR Client...");
var connection = new HubConnectionBuilder()
.ConfigureLogging(lo
浏览 34提问于2019-03-01得票数 4
回答已采纳
我在从js文件夹引用signalr的相关wwwroot文件时遇到了困难。
我需要参考的途径是：
wwwroot/lib/@aspnet/signalr/dist/browser/signalr.js
Www.root/js/chat.js
以下是我的看法：
@page
<div class="container">
<div class="row"> </div>
<div class="row">
<div class=
浏览 5提问于2019-09-18得票数 1
回答已采纳
实际上，我是新手，我正在尝试做一个非常简单的PoC，以基于SignalR (WebSocket)事件实时更新一个情节。
我在钢笔里有以下几个功能很好的笔：
var data = [
{
x: ['giraffes', 'orangutans', 'monkeys'],
y: [20, 14, 23],
type: 'bar'
}
];
Plotly.newPlot('myDiv', data);
setTimeout(() => {
const newData = &
浏览 3提问于2021-09-28得票数 1
回答已采纳
我在Jquery中有这个Signalr的实现
"use strict";
var SessionId = document.getElementById("Id").value;
var connection = new signalR.HubConnectionBuilder().withUrl("/chathub?SessionId=" + SessionId)
.build();
当我在本地主机上启动应用程序时，我会在Network选项卡中看到这个url
它能够很好地加载，而且我的聊天也能工作。
然而，当我将我的应用程序部
浏览 0提问于2019-01-29得票数 1
1回答
为什么不工作允许所有的 cors？
.net核心5 web api:
services.AddCors();
services.AddSignalR();
app.UseCors(c => c.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod());
js文件：
import * as signalR from '@microsoft/signalr'
let connection = new signalR.HubConnectionBuilder()
.withUrl("https
浏览 0提问于2021-01-22得票数 0
回答已采纳
2回答
在Javascript客户端中使用signalR。(后端为asp.net内核)。
我想禁用signalr的控制台日志记录。基本上，要阻止这一点：
我已经这样做了(但没有什么不同)：
var connection = new signalR.HubConnectionBuilder().withUrl("./NotificationUserHub").build();
connection.serverTimeoutInMilliseconds = 100000;
connection.logging = false;
有没有人能纠正我？
谢谢
浏览 0提问于2019-11-25得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
