Невозможно отобразить данные в реальном времени, при этом Python Web App генерирует ошибку «Внутренняя ошибка сервера» - PullRequest
Новая
       16

Невозможно отобразить данные в реальном времени, при этом Python Web App генерирует ошибку «Внутренняя ошибка сервера»

0 голосов
/ 16 апреля 2019

Приложение получает данные в режиме реального времени (проверяется с помощью оповещения), а при отображении их на карте выдает ошибку Internal Server Error

Тот же код работает как независимая html-страница, но не в веб-приложении на флеш-питоне. 

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css"
          integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
          crossorigin="anonymous">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
          integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
          crossorigin="anonymous">
    <title>Cosmos DB Change Feed</title>
    <style>

        .fade-enter-active {
            transition: all 1.5s ease;
        }

        .fade-enter, .fade-leave-to {
            opacity: 0;
        }
    </style>
</head>
<body>
    Welcome new
    <div class="container" id="app">
        <div class="row">
            <div v-for="flight in flights" class="col-md-6 col-lg-4 col-xl-3" style="margin: 16px 0px;">
                <div class="card">
                    <div class="card-body">
                        <h4 class="card-title">{{ flight.from }} <i class="fas fa-plane"></i> {{ flight.to }}</h4>
                        <transition name="fade" mode="out-in">
                            <h4 class="card-subtitle mb-2" :key="flight.price">${{ flight.price }}</h4>
                        </transition>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
    <script src="https://unpkg.com/@aspnet/signalr@1.0.2/dist/browser/signalr.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

    <script>

        const apiBaseUrl = 'http://localhost:7071'
        const axiosConfig = {}
        const data = {
            flights: []
        }
        const app = new Vue({
            el: '#app',
            data: data
        })
        getFlights().then(function (flights) {
            flights.forEach(flightUpdated)
        }).then(getConnectionInfo).then(function (info) {
            let accessToken = info.accessToken
            const options = {
                accessTokenFactory: function () {
                    if (accessToken) {
                        const _accessToken = accessToken
                        accessToken = null
                        return _accessToken
                    } else {
                        return getConnectionInfo().then(function (info) {
                            return info.accessToken
                        })
                    }
                }
            }

            const connection = new signalR.HubConnectionBuilder()
                .withUrl(info.url, options)
                .build()

            connection.on('flightUpdated', flightUpdated)

            connection.onclose(function () {
                console.log('disconnected')
                setTimeout(function () { startConnection(connection) }, 2000)
            })
            startConnection(connection)

        }).catch(console.error)

        function startConnection(connection) {
            console.log('connecting...')
            connection.start()
                .then(function () { console.log('connected!') })
                .catch(function (err) {
                    console.error(err)
                    setTimeout(function () { startConnection(connection) }, 2000)
                })
        }

        function getFlights() {
            return axios.post(`${apiBaseUrl}/api/GetFlights`, null, axiosConfig)
                .then(function (resp) { return resp.data })
                .catch(function () { return {} })
        }

        function getConnectionInfo() {
            return axios.post(`${apiBaseUrl}/api/SignalRInfo`, null, axiosConfig)
                .then(function (resp) { return resp.data })
                .catch(function () { return {} })
        }

        function flightUpdated(updatedFlight) {
            const flight = data.flights.find(f => (f.to === updatedFlight.to && f.from === updatedFlight.from))
            //const flight = data.flights.find(f =>f.id === updatedFlight.id)
            if (flight) {
               // alert(updatedFlight.price);
                //Vue.set(flight, 'from', updatedFlight.from)
                //  Vue.set(flight, 'to', updatedFlight.to)
                Vue.set(flight, 'price', updatedFlight.price)
            } else {
               //  alert(updatedFlight.price);
                data.flights.push(updatedFlight)
            }
        }
    </script>
</body>
</html>

Ожидаемый результат - информация о рейсе (от, до, цена) в формате карты. Я полагаю, что это из-за синтаксиса {{flight.to}}, я не знаю, как его заменить.

1 Ответ

0 голосов
/ 16 апреля 2019

Если приложение выдает внутреннюю ошибку сервера, вы, вероятно, запускаете его в рабочем режиме. На вашей машине разработки, Если вы используете app.run для приложения, измените 

app.run()

до 

app.run(debug=True)

Однако, если вы используете 

flask run

Затем, в зависимости от вашей системы, вам нужно добавить переменную окружения, информация о которой очень хорошо объясняется в других конфигурациях.

Конфигурация среды колбы

Когда вы включаете режим отладки, встроенный отладчик скажет вам точно, где он столкнулся с проблемой.

...