【问题标题】:How to get JS variables to be used in python file如何获取要在python文件中使用的JS变量
【发布时间】:2018-02-24 15:20:23
【问题描述】:

大家好。在尝试从 JS 获取要在我的 python 代码中使用的变量时,我需要帮助。我查看了整个谷歌,并尝试使用 AJAX 和 JQuery,但没有任何运气。我可能只是做得不对。

我的目标是能够使用 HTML5 地理位置来确保准确性,并在我的 python 代码中使用坐标。如果有人可以帮助我,那就太棒了。谢谢。

Python 代码

from flask import *
from flask_jsglue import JSGlue
app = Flask(__name__)
jsglue = JSGlue(app)
import json

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

@app.route('/receiver', methods=['GET', 'POST'])
def worker():
    lat = request.form['lat']
    long = request.form['long']
    print(lat)
    print(long)






if __name__ == '__main__':
    app.run(debug=True)

HTML 文件

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Geo</title>
    <script>
      window.onload = function()
      {

        init();
      }

      function init()
      {
        navigator.geolocation.getCurrentPosition(positionsuccess,
        positionerror);
      }

      function positionsuccess(position)
      {
        var lat = position.coords.latitude;
        var long = position.coords.longitude;
        document.getElementById('lat').innerHTML = lat;
        document.getElementById('long').innerHTML = long;
        event.preventDefault();
      }
      function positionerror(error)
      {
        alert(error.message);
      }


    </script>
    <script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script type="text/javascript">
     </script>
  </head>
  <body>
    <form>
      Lat: <span id='lat'></span>
      Long: <span id='long'></span>
      <button type="submit" name="button">Button</button>
    </form>
    <script>

    </script>

  </body>
</html>

【问题讨论】:

  • 输入您尝试进行 AJAX 调用的代码,我们可以帮助修复它。此外,你有一个打开的&lt;script&gt; 标记(在 jQuery 包含之前),这肯定会导致问题。
  • $.ajax({ url: '/receiver', data: cord, type: 'POST', 成功: function(response){ console.log(response); }, error: function(错误){ console.log(错误);}
  • 请在问题中发布,并阅读How to Ask

标签: javascript python ajax geolocation


【解决方案1】:
   <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>Geo</title>
        <script>
          window.onload = function()
          {

            init();
          }

          function init()
          {
            navigator.geolocation.getCurrentPosition(positionsuccess,
            positionerror);
          }

          function positionsuccess(position)
          {
            var lat = position.coords.latitude;
            var long = position.coords.longitude;
            document.getElementById('lat').innerHTML = lat;
            document.getElementById('long').innerHTML = long;
            event.preventDefault();
          }
          function positionerror(error)
          {
            alert(error.message);
          }

          function buttonClickHandler() {
            const lat = document.getElementById('lat').textContent;
            const long = document.getElementById('long').textContent;
            fetch('/receiver', , {
               method: 'post',
               headers: {
                  'Accept': 'application/json, text/plain, */*',
                  'Content-Type': 'application/json'
               },
              body: JSON.stringify({lat, long})
               }).then(res=>res.json())
              .then(res => console.log(res));
          }

        </script>
        <script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script type="text/javascript">
         </script>
      </head>
      <body>
        <form>
          Lat: <span id='lat'></span>
          Long: <span id='long'></span>
          <button type="button" name="button" onclick="buttonClickHandler">Button</button>
        </form>
        <script>

        </script>

      </body>
    </html>

在您的 Flask 服务器上,您可以在此处获取数据:

@app.route('/receiver', methods=['GET', 'POST'])
def worker():
    data= request.data
    print(data)

【讨论】:

  • 我想这就是我在这里尝试过的,但仍然一无所获。能不能随便举个例子?
  • 您的表单没有输入字段。确定您的帖子有任何数据?您可以在开发人员工具,网络中检查它。而且您的输入字段确实需要名称。
  • 检查基本原理。 developer.mozilla.org/en-US/docs/Learn/HTML/Forms/…您的表单没有操作,也没有字段。所以你的发送表单没有数据。
  • 这只是我实际烧瓶代码的草稿。在我的应用程序上,我有一个按钮,用于标记途中的人员并标记时间戳,但我想使用该按钮将他们的地理位置同时发送到服务器。
  • 我不知道该怎么做哈哈。这就是我想弄清楚的
猜你喜欢
  • 1970-01-01
  • 2013-05-08
  • 2014-08-17
  • 2017-03-24
  • 2018-09-21
  • 2016-09-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多