从Python（瓶框架）传递数据到JavaScript [英] Pass data from Python (flask framework) to javascript

问题描述

我尝试将数据（确切地说是一个路径或URL）从烧瓶传递给一个JavaScript。但它不承认我的变量。
在服务器端：它上传一个文件，处理这个文件，然后创建并保存许多图像。当我尝试将路径传递给使用three.js库的JavaScript文件时，它不会。

  @ app.route（'/ upload'，methods = ['POST']）
 def upload_file（） ：
 print（'coucou'）
 if request.method =='POST'：
 file = request.files ['file'] 
 print（file）
＃if file and allowed_file（file.filename）：
 filename = secure_filename（file.filename）
 print（filename）
 file.save（os.path.join（app.config [ 'UPLOAD_FOLDER']，filename））
 path = UPLOAD_FOLDER + filename 
 fits_reader = FitsReader.FitsReader（）
 fits_reader.open_file（path）
 cube_faces = ['/ home / morban /essaiserver/cube3D/CubeX.PNG'，'/home/morban/essaiserver/cube3D/CubeY.PNG'，'/home/morban/essaiserver/cube3D/CubeZ.PNG'] 
 return render_template（'index。 （i = 0; i <3; i ++）{
}（b） {
 case 0：
 texture [i] = new THR EE.ImageUtils.loadTexture（'{{cube_faces [0]}}'）; 
 console.log（'{{cube_faces [0]}}'）
 break; 
 case 1：
 texture [i] = new THREE.ImageUtils.loadTexture（'{{cube_faces [1]}}'）; 
 break; 
 case 2：
 texture [i] = new THREE.ImageUtils.loadTexture（'{{cube_faces [2]}}'）; 
 break; 
 
  

解决方案

javascript必须在模板文件，而不包含脚本源。

如果包含，您可以使其具有一个函数或类，并像这样使用它：

 （function（$）{
 var texture = new LoadTexture（
'#filter_form'，
 { cube_faces | tojson | safe}} 
）; 
}）（jQuery）; 
  

您可以/应该通过cube_fase拥有json并将其过滤到Jinja2上的安全。 b $ b

I try to pass data (exactly a path or a url) from flask to a javascript. But it don't recognize my variable. On the server side: it upload a file, process this file and then create and save many images. When I try to pass the path to a javascript file which use three.js library it doesn't.

@app.route('/upload', methods=['POST'])
def upload_file():
    print('coucou')
    if request.method == 'POST':
        file = request.files['file']
        print(file)
        # if file and allowed_file(file.filename):
        filename = secure_filename(file.filename)
        print(filename)
        file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
        path = UPLOAD_FOLDER + filename
        fits_reader = FitsReader.FitsReader()
        fits_reader.open_file(path)
        cube_faces = ['/home/morban/essaiserver/cube3D/CubeX.PNG', '/home/morban/essaiserver/cube3D/CubeY.PNG', '/home/morban/essaiserver/cube3D/CubeZ.PNG']
    return render_template('index.html', cube_faces=cube_faces)




for (var i = 0; i < 3; i++) {
        switch (i) {
            case 0:
                texture[i] = new THREE.ImageUtils.loadTexture('{{ cube_faces[0] }}');
                console.log('{{ cube_faces[0] }}')
                break;
            case 1:
                texture[i] = new THREE.ImageUtils.loadTexture('{{ cube_faces[1] }}');
                break;
            case 2:
                texture[i] = new THREE.ImageUtils.loadTexture('{{ cube_faces[2] }}');
                break;
            }

解决方案

The javascript must be in the template file, and not included has script source.

If included, you can make it has a function or "class" and use it like this:

   (function($) {
    var texture = new LoadTexture(
                '#filter_form',
                {{ cube_faces | tojson | safe }}
            );
    })(jQuery); 

you could/should pass cube_fase has json and filter it to safe on Jinja2.

这篇关于从Python（瓶框架）传递数据到JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！