Почему Django не загружает мой файл javascript правильно?

#javascript #django #django-templates #dropzone.js

#javascript #django #django-шаблоны #dropzone.js

Вопрос:

Я новичок в Django, и я пытаюсь реализовать перетаскивание загрузки файлов с помощью dropzone.js . Для начала я следовал этому руководству. Dropzone работает нормально, файл загружается и сохраняется правильно, мои проблемы связаны с настройкой экземпляра dropzone. Я создал второй файл javascript для создания своей пользовательской dropzone, как показано в руководстве, и включил его в шаблон django. Но по какой-то причине это ничего не меняет, с файлом javascript настройки или без него, dropzone выглядит точно так же.

Файл javascript:

 Dropzone.autoDiscovery = false;

const dropzone = new Dropzone("#drop", {
    dictDefaultMessage = "Upload your PDF here",
    clickable: false,
    url: "/upload",
    maxFiles: 1,
    acceptedFiles: ".pdf",
});
 

Файл шаблона django, в который я пытаюсь включить скрипт:

 {% load static %}

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>PDF2Notes</title>
  </head>
  <body>
    <form method="POST" action="/upload" class="dropzone dz" id="drop">
      {% csrf_token %}
      <div class="fallback">
        <input name="file" type="file">
      </div>
    </form>

    <!--default stylesheet-->
    <link rel="stylesheet" type="text/css" href="{% static 'converter/style.css' %}">
    <script type="text/javascript" src="{% static 'converter/main.js' %}"></script>

    <!--dropzone js amp; css-->
    <link rel="stylesheet" tpye="text/css" href="{% static 'converter/dropzone/dist/dropzone.css' %}">
    <script type="text/javascript" src="{% static 'converter/dropzone/dist/dropzone.js' %}"></script>
  
  </body>
</html>
 

Мой каталог статических файлов настроен правильно, все остальные мои статические файлы загружаются без проблем и из командной строки [15/Jan/2021 15:17:16] "GET /static/converter/main.js HTTP/1.1" 304 0
Я вижу, что файл был найден, поскольку 304 означает Not Modified .

Поскольку я не знаю никакого javascript, я не уверен, допустил ли я ошибку в файле javascript или это более глубокая проблема. Любая помощь приветствуется.

Ответ №1:

Вам нужно загрузить файл dropzone, прежде чем main.js с тех пор как main.js требуется, чтобы участник Dropzone существовал.

Ответ №2:

Хорошо, я нашел свою ошибку, это было быстрое исправление, вызванное, как всегда, человеческой ошибкой.

  1. как ответил @schillingt, мне пришлось разместить main.js включить после dropzone.js
  2. Я неправильно Dropzone.autoDiscover = false; написал как Dropzone.autoDiscovery = false;
  3. У меня было a = вместо a : после dictDefaultMessage in main.js

Финал main.js:

 
var myDropzone = new Dropzone("#drop", {
    dictDefaultMessage: "Upload your PDF here",
    clickable: false,
    url: "/upload",
    maxFiles: 1,
    acceptedFiles: ".pdf",
});
 

Окончательный шаблон Django:

 {% load static %}

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>PDF2Notes</title>
  </head>
  <body>
    <form method="POST" action="/upload" class="dropzone dz" id="drop">
      {% csrf_token %}
      <div class="fallback">
        <input name="file" type="file">
      </div>
    </form>

    <!--dropzone js amp; css-->
    <link rel="stylesheet" type="text/css" href="{% static 'converter/dropzone/dist/dropzone.css' %}">
    <script type="text/javascript" src="{% static 'converter/dropzone/dist/dropzone.js' %}"></script>

    <!--default stylesheet-->
    <link rel="stylesheet" type="text/css" href="{% static 'converter/style.css' %}">
    <script type="text/javascript" src="{% static 'converter/main.js' %}"></script>

  </body>
</html>