通过Javascript将数据从python flask转换为html

2024-04-25 21:17:47 发布

您现在位置：Python中文网/ 问答频道 /正文
3938 3

我正在学习数据科学，但我对flask、html和Js还是新手。 我已经开发了一个用于房价预测的ML模型，并希望将其部署到Heroku

问题是，我的前端中的下拉菜单没有根据我在python flask后端中传递的位置进行更新

以下是我的代码的重要部分

server.py：

from flask import Flask, request, jsonify, render_template
app = Flask(__name__)

@app.route('/locations')
def locations():
    response = jsonify({
        'locations': get_location_names()
    })
    response.headers.add('Access-Control-Allow-Origin', '*')

    return response

app.js

function onPageLoad() {
  console.log( "document loaded" );
  $.get("{{ url_for('locations') }}",
  function(data, status) {
  console.log("got response for locations request");
  if(data) {
      var locations = data.locations;
      var uiLocations = document.getElementById("uiLocations");
      $('#uiLocations').empty();
      for(var i in locations) {
          var opt = new Option(locations[i]);
          $('#uiLocations').append(opt);
      }
  }
  });

index.html：

<!DOCTYPE html>
<html>
<head>
<title>Banglore Home Price Prediction</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js" 
       type="text/javascript"></script>
<link rel="stylesheet" type= "text/css" href="{{url_for('static', filename = 'app.css')}}">
<script type="text/javascript" src ="{{url_for('static', filename = 'app.js')}}"></script>
</head>

浏览器控制台打印我放在app.js中的“document loaded”，但没有从server.py获取数据。 我相信问题在于声明的url_，但不知道如何处理


Tags： textappurlflaskfordataresponsevar
1条回答
网友
1楼 · 发布于 2024-04-25 21:17:47

不能在作为静态资源加载的js文件中使用jinja2表达式。-v25

您可以将Javascript添加到index.html文件中的<script>标记中。或者你可以硬编码

我通常不使用这两种方法。相反，在运行主应用程序之前，我使用自定义python脚本呈现所有文件。我使用一个.bat文件并键入所有需要的命令。您有时会使用Sass或任何其他需要渲染的东西。。。因此，组织和编写这样的脚本是很有帮助的。如果JavaScript数据没有动态更改，请使用这种方法

但是，如果脚本是动态的，则可以添加一个路由，以便在每次请求文件时呈现该文件

@app.route('/my_script.js')
def script():
    return render_template('my_script.js', name='mark')

在你的/locations路线中：

<script src="{{url_for('script')}}"></script>

Jinja2可以解析任何类型的文件

相关问题 更多 >

    编程相关推荐