Как отображать данные в реальном времени на Highchart

Question

Я пытаюсь показать транзакции в реальном времени, используя Highchart. Я использую JavaScript-класс EventSource для извлечения данных после обновления URL-адреса. Я следую этому примеру из Highchart - https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/dynamic-update/

Я сделал несколько настроек, чтобы отразить, что я хочу, но когда я загружаю страницу, и данные отправляются с URL, я получаю эту ошибку на своей консоли -

(index):1 GET http://myurl/analytics-api/v1.0/payments-stream net::ERR_ABORTED 504 (Gateway Time-out)
(index):1 Access to resource at 'http://myurl/analytics-api/v1.0/payments-stream' from origin 'http://localhost:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Вот мой код:

Highcharts.chart('liveTrans', {
        chart: {
            type: 'spline',
            animation: Highcharts.svg, // don't animate in old IE
            marginRight: 10,
            events: {
                load: function () {

                    // set up the updating of the chart each second
                    var series = this.series[0];
                    var es = new EventSource('http://myurl/analytics-api/v1.0/payments-stream')
                    es.onmessage = function(e) {
                        var obj = JSON.parse(e.data);
                        var amount = obj.amount;
                        var jDate = Date.parse(obj.timestamp)
                        series.addPoint([jDate, amount], true, true)
                        console.log('added')
                    };

                }
            }
        },

        time: {
            useUTC: false
        },

        title: {
            text: 'Live random data'
        },
        xAxis: {
            type: 'datetime',
            tickPixelInterval: 150
        },
        yAxis: {
            title: {
                text: 'Value'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            headerFormat: '<b>{series.name}</b><br/>',
            pointFormat: '{point.x:%Y-%m-%d %H:%M:%S}<br/>{point.y:.2f}'
        },
        legend: {
            enabled: false
        },
        exporting: {
            enabled: false
        },
        series: []
    });