django和javascript如何組織

Question

我試圖弄清楚如何組織我的javascript / django代碼。

到目前為止，我曾經將我的javascript頁面特定代碼放在同一文件中。 即我將javascript嵌入模板內的<script>標記中。 當我的JS代碼變大時，這會造成很多混亂：
-我的JS代碼中的Django模板變量{{var}}看起來不太好，
-當我嘗試使用這樣的工具將其最小化時，我得到一個錯誤： http : //jscompress.com/ ，
-我只是盡量將它們分開。

今天，在我的<script>標記中，我的JS代碼如下所示：

var app = {
  func: function() {
    // can I use the {% url %} tag here ?
    $.post('/url/', {csrfmiddlewaretoken:'{{csrf_token}}', something:'value'} )

  },
  jsonFromServer: '{{pythonDict|safe}}', // I need this data structure,
};

如您所見，我需要將django形式的值傳遞給javascript，其中最常見的是ajax請求的csrftoken。 但有時我還會傳遞應用程序本身所需的json字典。 有時我也想打發服務器時間。

我正在考慮將JS代碼移動到一個單獨的文件中，我讀到這是更好的組織方式。 但是我看不到沒有django必須呈現.js文件的普通django應用程序中的可能性。 而且我相信django最好不要提供JS文件？ 那么，如何在其中沒有太多Django代碼的情況下組織我的JS？

Answer 1

我不知道它是否“漂亮”，但通常，在MVC中進行Web開發時，我會像這樣組織代碼：

• 我將<script>標記放在頁面的模板中。
• 我將js寫在一個外部文件中，通常是在/static/JS/my_template_name.js中
• 由於我的全局布局也可以包含一些JS代碼，因此我充分利用了JS模塊： https ://medium.freecodecamp.com/javascript-modules-a-beginner-s-guide-783f7d7a5fcc#.bjf4xwuq4

Answer 2

通常，我不必這樣做。 當我需要在js代碼中從服務器獲取var時，我會進行一些Ajax調用。

但是，如果您真的想要這樣處理，我建議您在模板中執行以下操作：

<script>
     var from_server = {{vars_from_server}};
</script>

通常，如果將名為vars_from_server的變量傳遞到模板，它將替換腳本標記之間的占位符。 只需考慮以正確的JS格式設置“ vars_from_server”的格式。

之后，您可以通過從任何地方訪問from_server變量來訪問腳本中的var。