react-native - React Native 应用程序不会完成与 SignalR Core 的协商

Question

我正在尝试在 React Native 上集成 SignalR Core JS 客户端，但似乎无法让它与带有 SignalR 的 ASP.NET Core 服务器一起使用。我听说尽管缺少指定的 React Native 客户端，其他人仍然能够使其工作。

我不断收到以下错误:“错误:无法完成与服务器的协商:错误”。有人可以帮助我吗？

这是 React Native 应用程序的外观:

应用程序.js

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, TouchableHighlight, TextInput, Alert } from 'react-native';

import * as signalR from '@aspnet/signalr';

export default class App extends Component {

  componentDidMount() {
    let connection = new signalR.HubConnectionBuilder()
      .withUrl("http://192.168.0.89:5000/app")
      .configureLogging(signalR.LogLevel.Information)
      .build();

    connection.on("ReceiveMessage", (user, message) => {
      const msg = message.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
      const encodedMsg = user + " says " + msg;
      log(encodedMsg);
    });

    connection.start().catch(err => this.logError(err));
  }

  render() {
    return (
      <View style={styles.container}>

      </View>
    );
  }

}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  }
});

包.json

{
  "name": "TakMobile",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "@aspnet/signalr": "^1.0.4",
    "react": "16.6.0-alpha.8af6728",
    "react-native": "0.57.4",
    "react-native-callkit": "^1.3.4",
    "react-native-voip-push-notification": "^1.1.2",
    "react-native-webrtc": "^1.67.1",
    "socket.io-client": "^2.1.1"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.49.0",
    "react-test-renderer": "16.6.0-alpha.8af6728"
  },
  "jest": {
    "preset": "react-native"
  }
}

这是服务器的样子:

启动.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.DependencyInjection;

namespace demo1
{
    public class Startup
    {
        // This method gets called by the runtime. Use this method to add services to the container.
        // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddSignalR();
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            app.UseFileServer();
            app.UseSignalR(routes =>
            {
                routes.MapHub<ApplicationHub>("/app");
            });
        }
    }
}

程序.cs

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.Logging;

namespace demo1
{
    public class Program
    {
        public static void Main(string[] args)
        {
            CreateWebHostBuilder(args).Build().Run();
        }

        public static IWebHostBuilder CreateWebHostBuilder(string[] args) =>
            WebHost.CreateDefaultBuilder(args)
                .UseStartup<Startup>();
    }
}

Demo1.cs 工程文件

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>netcoreapp2.1</TargetFramework>
  </PropertyGroup>

  <ItemGroup>
    <Folder Include="wwwroot\" />
  </ItemGroup>

  <ItemGroup>
    <PackageReference Include="Microsoft.AspNetCore.App" />
  </ItemGroup>

</Project>

启动设置.json

{
  "iisSettings": {
    "windowsAuthentication": false, 
    "anonymousAuthentication": true, 
    "iisExpress": {
      "applicationUrl": "http://192.168.0.89:5002",
      "sslPort": 44397
    }
  },
  "profiles": {
    "IIS Express": {
      "commandName": "IISExpress",
      "launchBrowser": true,
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    },
    "demo1": {
      "commandName": "Project",
      "launchBrowser": true,
      "applicationUrl": "http://192.168.0.89:5000",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
  }
}

应用程序集线器.cs

using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;

namespace demo1 {
    public class ApplicationHub : Hub {
        public Task Send(string message) {
            return Clients.All.SendAsync("Send", message);
        }
    }
}

Answer 1

据我了解，这个问题已经解决了，但是，我想我可能会分享我遇到的问题的解决方案(导致相同的错误消息=“错误:无法完成与服务器的协商:错误”)。
我的问题的原因是我在客户端代码中指定了错误的端口号。
(作为传递给 HubConnectionBuilder().withUrl() 方法的参数)
因此，我需要传递 iisExpress 的 applicationUrl (http://192.168.0.89:5000)，而不是“demo1”的 applicationUrl (http://192.168.0.89:5002)。