2013-02-17 53 views
1

我已經瀏覽了stackoverflow,github,Google等很多主題......並且發現了很多不同的答案,儘管沒有簡單的答案。從Facebook上的JavaScript文件(melonJS)遊戲調用Python函數(Flask)

我正在寫JavaScript(使用melonJS引擎)的Facebook遊戲。該框架是Flask(Python)。

我想要做的是有能力發送Python和JS代碼之間的數據,而不需要刷新頁面(如數據庫操作,電子郵件發送等)。我希望用戶只是看到遊戲,選擇選項,玩遊戲,剩下的就是遊戲。

雖然我已成功地看到,像下面將工作:

app.py

def add(f,l,a): 
    g.db.execute('insert into persons (fname,lname,age) values (?, ?, ?)', 
      [f,l,a]) 
    g.db.commit() 

@app.route('/') 
def index(): 
    cur = g.db.execute('select fname, lname, age from persons order by id desc') 
    entries = [dict(fname=row[0], lname=row[1], age=row[2]) for row in cur.fetchall()] 
return render_template('app.html',entries=entries,addtodb=add) 

app.html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 

<head> 
    <title>THE GAME</title> 
    <meta http-equiv="content-type" content="text/html;charset=utf-8" /> 
    <meta name="generator" content="Geany 1.22" /> 

    <script type="text/javascript" src="jquery-1.7.1.min.js"></script> 
    <script type="text/javascript"> 
    var adddb = '{{addtodb('Anne','Monk','12')}}'; 
    </script> 

</head> 

<body> 
{{addtodb('Allie','Monk','78')}} 
<ul class=entries> 
     {% for entry in entries %} 
      <li><h2>{{ entry.fname }} {{ entry.lname|safe }} </h2> Age: {{ entry.age }}</li> 
     {% else %} 
      <li><em>Unbelievable. No entries here so far</em></li> 
     {% endfor %} 
</ul> 
</body> 

</html> 

而且兩者的{{addtodb}}會工作。 我只是想知道如何將函數發送到只會鏈接到HTML(如上面的jquery)的file.js,而不是直接放在裏面。 「{{...}}」將不起作用,因爲我已經檢查過。 我想我必須找到一些模塊到Python或使用AJAX也許,除了我不知道從哪裏開始。

回答

1

答案是「AJAX」,但希望一些簡單的闡述將有助於點你在正確的方向:

你需要做出某種JS事件(點擊一個鏈接,點擊一個按鈕,一個事件觸發在你的遊戲中)觸發異步(即不等待服務器的響應)或同步(即等待回聽)呼叫服務器上的Flask端點(即設置的路由)。如果你正在創建一個新條目,那可能是一個POST請求。在服務器上驗證並將其保存到數據庫。

如果您還希望頁面反映由於服務器對數據庫的行爲而發生的任何事情,則您的Flask端點需要返回JSON響應。由於您已經生成了頁面中的HTML和JS,所以JS中的函數需要綁定爲事件偵聽器,以便查找該JSON響應,然後解析JSON並執行您在該函數中放置的任何代碼。

JQuery的ajax功能爲您做到了這一切。 Here is an example of a jQuery AJAX POST。這個例子使用PHP並不重要,通常在您的Flask視圖中解析POST並返回jsonify(數據)。 See docs on Flask.jsonify

+0

非常感謝您的回答。在你的幫助和其他一些帖子的幫助下,我開始努力解決這個問題,但是我對Flask有問題。我應該在哪裏將功能代碼文件放在項目文件夾中?因爲當我把函數放在主文件夾中的test.py中,並放入'url:test.py'時,它總是在localhost:5000/test.py(我使用工頭進行測試)中搜索文件。我總是得到404 - 找不到。 我的.js文件在/靜態文件夾中。 – Archarachne 2013-02-19 17:07:25

+1

燒瓶建在Werkzeug之上,它是一個「門戶」。這不像寫一次性腳本。您正在創建一個Flask應用程序,該應用程序可以聽取瀏覽器的請求並決定要執行的操作。所以當你指向這樣的test.py時,沒有任何事情發生,因爲沒有文件在那裏被服務。 你需要創建一個[route](http://flask.pocoo.org/docs/quickstart/#routing)並指向它。你應該閱讀整個[quickstart](http://flask.pocoo.org/docs/quickstart/),最好是整個Flask文檔。它不像編寫腳本。 – 2013-02-25 21:11:30

+0

謝謝你的幫助。我終於找到了解決方案,並可以繼續我的工作。 :) – Archarachne 2013-02-27 16:19:34

0

您必須使用AJAX。在服務器端,您只需要一個以JSON形式返回數據的URL。在客戶端,我建議你使用jQuery進行AJAX請求。只需使用jQuery從服務器請求數據並將數據呈現到DOM中即可。