本地Azure Function与Web App的SignalR连接异常排查求助

环境与代码信息 #

Azure Function代码 #

[FunctionName("FxAdoHttpTrigger")]
public static async Task Run(
    [HttpTrigger(AuthorizationLevel.Function, "post", Route = null)] HttpRequest req,
    [SignalR(HubName = "AdoEvents")] IAsyncCollector<SignalRMessage> signalRMessages,
    ILogger log)
{
    log.LogInformation("C# HTTP trigger function processed a request.");

    string requestBody = await new StreamReader(req.Body).ReadToEndAsync();
    var data = JsonConvert.DeserializeObject(requestBody);
 
    await signalRMessages.AddAsync(
        new SignalRMessage
        {
            Target = "newMessage",
            Arguments = new[] { data }
        });
}

Web App前端JS代码 #

connection.on("newMessage", (data) => {
    const li = document.createElement("li");
    li.textContent = `${data}`;
    document.getElementById("messageList").appendChild(li);
});

async function start() {
    try {
        await connection.start();
        console.log("SignalR Connected.");
    } catch (err) {
        console.log(err);
        setTimeout(start, 5000);
    }
};

connection.onclose(async () => {
    alert('onclose fired');
    //await start();
});

// Start the connection.
start();

本地配置文件（local.settings.json） #

{
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft": "Warning",
      "Microsoft.Hosting.Lifetime": "Information"
    }
  },
  "Values": {
    "AzureSignalRConnectionString": "Endpoint=https://XXXsignalr-jjjjj.service.signalr.net;AccessKey=secret;Version=1.0;"
  },
  "AllowedHosts": "*"
}

问题现象 #

• 前端控制台始终输出“SignalR Connected”，但Azure SignalR Live Trace无客户端连接记录
• 修改AzureSignalRConnectionString后，前端仍显示连接成功
• Azure Function推送消息后，前端无法接收newMessage事件
• 疑惑是否需要在AdoHub中添加newMessage方法

排查建议 #

1. 确认前端连接的Hub名称与Function一致 #

Function中指定的HubName是AdoEvents，前端创建连接时必须明确指定该Hub。示例正确的连接初始化代码：

const connection = new signalR.HubConnectionBuilder()
    .withUrl("http://localhost:7071/api/AdoEvents") // 指向本地Function的SignalR协商端点+Hub名称
    .build();

若前端未指定正确Hub，会连接到默认Hub，导致与Function推送的消息目标不匹配，同时可能因本地模拟服务存在，出现“假连接成功”的情况。

2. 检查前端连接端点配置 #

本地运行时，前端必须通过Azure Function的协商端点建立连接，而非直接连接云端SignalR服务。正确的端点应为本地Function的地址（默认http://localhost:7071/api），Function的SignalR绑定会自动处理与云端服务的协商。

如果前端直接连接云端SignalR端点，会因缺少身份验证（本地环境下）导致看似连接成功，但实际未在云端Hub注册，因此Live Trace无记录。

3. 验证Function的SignalR连接配置 #

• 确保local.settings.json中的AzureSignalRConnectionString完全正确（Endpoint、AccessKey无拼写错误）
• 检查Function启动日志，若出现Using local SignalR emulator提示，说明未正确连接云端服务，需排查网络或连接字符串问题

4. 关于Hub方法的说明 #

不需要在AdoHub中添加newMessage方法。newMessage是前端订阅的客户端事件，Function通过SignalR输出绑定推送的是客户端目标事件，后端Hub无需定义对应方法，只要前端正确订阅即可接收。

5. 排查本地SignalR模拟服务干扰 #

Azure Functions Core Tools默认会启动本地SignalR模拟服务，若连接字符串配置错误或无法访问云端，会自动切换到模拟服务。此时前端连接的是本地服务，所以无论怎么修改连接字符串都显示成功，但云端Live Trace无记录。可通过Function启动日志确认是否使用了模拟服务。

内容的提问来源于stack exchange，提问作者Mike W