无法使SignalR、Web API和SystemJS协同工作

我试图在我的Web API上建立一个通知服务，通知JavaScript (Aurelia)客户端(WebApp)。我的Web API和WebApp在不同的域中。

我有一个简单的NotificationHub:

public class NotificationHub:Hub
{
    public void NotifyChange(string[] values)
    {
        Clients.All.broadcastChange(values);
    }
}

我在Web API的Startup中配置SignalR，如下所示:

public void Configuration(IAppBuilder app)
{
    HttpConfiguration httpConfig = new HttpConfiguration();
    var cors = new EnableCorsAttribute("http://localhost:9000", "*", "*");
    httpConfig.EnableCors(cors);
    app.MapSignalR();
    WebApiConfig.Register(httpConfig);
    ...
}

在我的WebApp中，我试图从我的Web API访问signalr/hubs，如下所示:

Promise.all([...
        System.import('jquery'),
        System.import('signalr'), ...
            ])
       .then((imports) => {
            return System.import("https://localhost:44304/signalr/hubs");
            });

我还在我的config.js中添加了meta部分:

System.config({
    ...
    meta: {
        "https://*/signalr/hubs": { //here I also tried with full url
            "format": "global",
            "defaultExtension": false,
            "defaultJSExtension": false,
            "deps": ["signalr"]
        }
    }
});

尽管这些配置，我仍然有以下问题:

1. WebApp对signalr/hubs的请求被作为https://localhost:44304/signalr/hubs.js发出，并返回HTTP 404。注意，浏览https://localhost:44304/signalr/hubs返回hubs脚本。
在$.connection("https://localhost:44304/signalr").start()，我收到以下错误:

XMLHttpRequest无法加载https://localhost:44304/signalr/negotiate?clientProtocol=1.5&_=1471505254387。请求的资源上没有'Access-Control-Allow-Origin'标头。因此，不允许访问源'http://localhost:9000'。

请让我知道我在这里错过了什么?

更新:使用适当的CORS配置和@kabaehr建议的要点，我现在能够连接到SignalR集线器。但是，广播(推送通知)仍然不起作用。

My SignalR配置:

public static class SignalRConfig
{
    public static void Register(IAppBuilder app, EnableCorsAttribute cors)
    {
        app.Map("/signalr", map =>
        {
            var corsOption = new CorsOptions
            {
                PolicyProvider = new CorsPolicyProvider
                {
                    PolicyResolver = context =>
                    {
                        var policy = new CorsPolicy { AllowAnyHeader = true, AllowAnyMethod = true, SupportsCredentials = true };
                        // Only allow CORS requests from the trusted domains.
                        cors.Origins.ForEach(o => policy.Origins.Add(o));
                        return Task.FromResult(policy);
                    }
                }
            };
            map.UseCors(corsOption).RunSignalR();
        });
    }
}

我在Startup中使用它如下:

var cors = new EnableCorsAttribute("http://localhost:9000", "*", "*");
httpConfig.EnableCors(cors);
SignalRConfig.Register(app, cors);
WebApiConfig.Register(httpConfig);

我正在尝试按如下方式推送通知:

GlobalHost.ConnectionManager.GetHubContext<NotificationHub>().Clients.All.broadcastChange(new[] { value });

然而，我的客户端没有在broadcastChange上得到通知。当我使用要点时，我假设我不必显式导入https://localhost:44304/signalr/hubs。

export class SignalRClient {
    public connection = undefined;
    private running: boolean = false;
    public getOrCreateHub(hubName: string) {
        hubName = hubName.toLowerCase();
        if (!this.connection) {
            this.connection = jQuery.hubConnection("https://myhost:myport");
        }
        if (!this.connection.proxies[hubName]) {
            this.connection.createHubProxy(hubName);
        }
        return this.connection.proxies[hubName];
    }
    public registerCallback(hubName: string, methodName: string, callback: (...msg: any[]) => void,
        startIfNotStarted: boolean = true) {
        var hubProxy = this.getOrCreateHub(hubName);
        hubProxy.on(methodName, callback);
        //Note: Unlike C# clients, for JavaScript clients, at least one callback 
        //      needs to be registered, prior to start the connection.
        if (!this.running && startIfNotStarted)
            this.start();
    }
    start() {
        const self = this;
        if (!self.running) {
            self.connection.start()
                .done(function () {
                    console.log('Now connected, connection Id=' + self.connection.id);
                    self.running = true;
                })
                .fail(function () {
                    console.log('Could not connect');
                });
        }
    }
}

import {autoinject, bindable} from "aurelia-framework";
import {SignalRClient} from "./SignalRClient";
@autoinject
export class SomeClass{
    //Instantiate SignalRClient.
    constructor(private signalRClient: SignalRClient) {
    }
    attached() {
        //To register callback you can use lambda expression...
        this.signalRClient.registerCallback("notificationHub", "somethingChanged", (data) => {
            console.log("Notified in VM via signalr.", data);
        });
        //... or function name.
        this.signalRClient.registerCallback("notificationHub", "somethingChanged", this.somethingChanged);
    }
    somethingChanged(data) {
        console.log("Notified in VM, somethingChanged, via signalr.", data);
    }
}