如何继续在 Flask 中从 Jinja2 调用函数答案

【问题标题】：How to go on about calling a fucntion from Jinja2 in Flask如何继续在 Flask 中从 Jinja2 调用函数
【发布时间】：2016-03-24 18:42:34
【问题描述】：

所以在你们说这是重复之前，请耐心等待我一分钟，当我说这句话时相信我，我尝试了其他类似问题中给出的所有答案。我想使用 javascript 从 html 页面调用 runForward 和 runBackward。

这是我的代码：

#motordriver.py

import time
import RPi.GPIO as gp
import os

class MotorDriver:
    en1 = 24
    c1a = 26
    c1b = 22
    en2 = 23
    c2a = 21
    c2b = 19

    def __init__(self):
        gp.setwarnings(False)
        gp.setmode(gp.BOARD)
        gp.setup(self.en1, gp.OUT)
        gp.setup(self.c1a, gp.OUT)
        gp.setup(self.c1b, gp.OUT)
        gp.setup(self.en2, gp.OUT)
        gp.setup(self.c2a, gp.OUT)
        gp.setup(self.c2b, gp.OUT)
        gp.output(self.en1, True)
        gp.output(self.en2, True)

    def runForward(self):
        gp.output(self.c1a, True)
        gp.output(self.c2a, True)
        time.sleep(1)
        gp.output(self.c1a, False)
        gp.output(self.c2a, False)
        return "sooo"

    def runBackward(self):
        gp.output(self.c1b, True)
        gp.output(self.c2b, True)
        time.sleep(1)
        gp.output(self.c1b, False)
        gp.output(self.c2b, False)
        return "booo"

if __name__ == '__main__':
    #app.run(host = '0.0.0.0')
    drive = raw_input('Enter forward or backward(a/b):')
    obj = MotorDriver()
    if drive == 'a':
        obj.runForward()
    elif drive == 'b':
        obj.runBackward()
    else:
        print("Wrong input")
    gp.output(obj.en1, False)
    gp.output(obj.en2, False)

我将此文件作为模块导入到我的__init__.py 文件中，这是该文件的内容。

from flask import Flask
from flask import abort, redirect, url_for, request
from flask import render_template
from jinja2 import Template
import motordriver as md

app = Flask(__name__)
app.debug = True
#'import yourmodule; instance = yourmodule.YourClass(); instance.method()'
inst = md.MotorDriver()

def clirunForward():
    inst.runForward()
def clirunBackward():
    inst.runBackward()

app.jinja_env.globals.update(clirunForward=clirunForward)
app.jinja_env.globals.update(clirunBackward=clirunBackward)

@app.route('/')
def showPageWithControls():
    return render_template('index.html')

if __name__ == '__main__':
    app.run(host= '0.0.0.0')

现在终于是我的模板index.html

<!doctype html>
<html>
<heead>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script>
  $(document).ready(function(){
      $(".back").mouseup(function(){
          $("div").after("<p style='color:green;'>{{ clirunBackward() }}</p>");
      });
      $(".up").mousedown(function(){
          $("div").after("<p style='color:purple;'>{{ clirunForward() }}</p>");
      });
  });
</script
  <title>
    Hello from PiBall
  </title>
</head>
<body>
  <h1>PiBall!</h1>
  <button type='button' class="up">&#8593;</button><br />
  <button type='button'>&#8592;</button><button type='button'>&#8594;</button><br />
  <button type='button' class="back">&#8595;</button><br />
  <div>Test it here!</div>
</body></html>

所以你们能告诉我为什么它不起作用。根据其他答案，这应该可以正常工作吗？

顺便说一句，我试过了

【问题讨论】：

如果您想从 Javascript 调用您的方法，请在 Flask 中创建一个 POST 路由并使用 AJAX。
在渲染index.html 时，您将调用clirunBackward 和clirunForward。 JavaScript 不能直接调用 Python 函数。

标签： python flask jinja2

【解决方案1】：

在 Ajax 中使用 post 有效。这是我的index.html：

$(document).ready(function(){
    $(".up").mousedown(function(){
      $("div").after("<p style='color:green;'>Forward it is</p>");
      $.ajax({
        type: "POST",
          data: {motion: "forward"},
          dataType: 'text'
      });
    }).mouseup(function(){
        $("div").after("<p style='color:green;'>Stopped!</p>");
      $.ajax({
        type: "POST",
        data: {motion: "stop"},
        dataType: 'text'
      });
    });
    $(".back").mousedown(function(){
      $("div").after("<p style='color:purple;'>Forward it is</p>");
      $.ajax({
        type: "POST",
        data: {motion: "backward"},
        dataType: 'text'
      });
    }).mouseup(function(){
      $("div").after("<p style='color:green;'>Stopped!</p>");
      $.ajax({
        type: "POST",
        data: {motion: "stop"},
        dataType: 'text'
      });
    });
  });

这是我处理帖子的__init__.py 部分：

@app.route('/', methods = ['POST'])
def motorFunctions():
    if request.form['motion'] == "forward":
        inst.runForward()
    elif request.form['motion'] == "backward":
        inst.runBackward()

【讨论】：