flask 前端js调用后端数据

Flask是一个基于Python的Web框架，可以用于构建简单而灵活的Web应用程序。在Flask中，可以通过前端的JavaScript代码调用后端的数据。

要实现前端JavaScript调用后端数据，需要以下步骤：

1. 在后端的Flask应用程序中，定义路由（route）和处理函数（handler）来处理前端JavaScript的请求。
例如，在Flask应用程序的app.py文件中，可以定义一个路由为'/data'，并指定一个处理函数来处理该路由的请求。

@app.route('/data', methods=['GET'])
def get_data():
    data = {
        'name': 'John',
        'age': 25,
        'city': 'New York'
    }
    return jsonify(data)

2. 在前端的HTML文件中，使用JavaScript代码来发起对后端数据的请求。
例如，在HTML的script标签中，可以使用AJAX来发送GET请求获取后端数据。然后，通过回调函数处理后端返回的数据。

<script>
    function getData() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            if (xhr.readyState === 4 && xhr.status === 200) {
                var responseData = JSON.parse(xhr.responseText);
                // 处理后端返回的数据
                console.log(responseData);
            }
        };
        xhr.open('GET', '/data');
        xhr.send();
    }
    // 调用函数来获取后端数据
    getData();
</script>

在上述的JavaScript代码中，使用XMLHttpRequest对象来发送GET请求到后端定义的路由'/data'，通过回调函数处理后端返回的数据。
在回调函数中，可以将后端返回的数据进行处理，例如打印到控制台或更新前端页面等操作。

3. 运行Flask应用程序并访问前端页面。
在终端中，使用命令`flask run`运行Flask应用程序，并在浏览器中访问前端页面。当浏览器加载页面时，前端JavaScript代码会自动发起对后端数据的请求，并在控制台或页面上显示后端返回的数据。

通过以上步骤，可以实现前端JavaScript调用后端数据的功能。