Django的Javascript变量问题

Question

I am trying to use some javascript with my django code but have a small issue calling functions from the second js file. 我正在尝试将一些javascript与我的Django代码一起使用，但是从第二个js文件调用函数时遇到了一个小问题。

I am using code from here https://github.com/mattdiamond/Recorderjs 我正在从这里使用代码https://github.com/mattdiamond/Recorderjs

I took the html file Matt made and removed the header and created a django template and then put the javascript files with my other static files. 我带了Matt制作的html文件，并删除了标题，并创建了django模板，然后将javascript文件与其他静态文件放在一起。 Those files (twitter bootstrap) all work fine. 这些文件（twitter引导程序）都可以正常工作。

If I open the sheet it loads fine with the record and stop buttons available. 如果我打开工作表，则可以使用记录和停止按钮进行加载。 If you press them they are recorded in the log but any function that should be called in the recorderWorker.js is ignored. 如果按它们，它们将被记录在日志中，但是将忽略recorderWorker.js中应调用的任何函数。 So I can not save the file or see it. 因此，我无法保存文件或查看文件。

As far as I can tell it never calls the second javascript file. 据我所知，它永远不会调用第二个javascript文件。 If I put alert boxes in the recorderWorker.js nothing happens but they work in the Recorder.js. 如果我将警报框放在recorderWorker.js中，则什么都不会发生，但是它们在Recorder.js中起作用。

var WORKER_PATH = 'recorderWorker.js';
var Recorder = function(source, cfg){

I know it is not a problem with the code since I tested it using another Python webserver (SimpleHTTPServer) and it works great. 我知道代码不是问题，因为我使用另一个Python网络服务器（SimpleHTTPServer）测试了它，并且效果很好。

I have made no changes to the js files and only create this template for the html. 我没有对js文件进行任何更改，仅为html创建了此模板。

{% load staticfiles %}
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Live input record and playback</title>
  <style type='text/css'>
    ul { list-style: none; }
    #recordingslist audio { display: block; margin-bottom: 10px; }
  </style>
</head>

And then the html file 然后是html文件

{% extends "base_record.html" %}

{% block content %}

  <h1>Recorder.js simple WAV export example</h1>

  <p>Make sure you are using a recent version of Google Chrome, at the moment this only works with Google Chrome Canary.</p>
  <p>Also before you enable microphone input either plug in headphones or turn the volume down if you want to avoid ear splitting feedback!</p>

  <button onclick="startRecording(this);">record</button>
  <button onclick="stopRecording(this);" disabled>stop</button>

  <h2>Recordings</h2>
  <ul id="recordingslist"></ul>

  <h2>Log</h2>
  <pre id="log"></pre>

  <script>
  function __log(e, data) {
    log.innerHTML += "\n" + e + " " + (data || '');
  }

  var audio_context;
  var recorder;

  function startUserMedia(stream) {
    var input = audio_context.createMediaStreamSource(stream);
    __log('Media stream created.');

    input.connect(audio_context.destination);
    __log('Input connected to audio context destination.');

    recorder = new Recorder(input);
    __log('Recorder initialised.');
  }

  function startRecording(button) {
    //  alert("start recording")
    recorder && recorder.record();
    button.disabled = true;
    button.nextElementSibling.disabled = false;
    __log('Recording...');
  }

  function stopRecording(button) {
    //  alert("Stopped recording")
    recorder && recorder.stop();
    button.disabled = true;
    button.previousElementSibling.disabled = false;
    __log('Stopped recording.');

    // create WAV download link using audio data blob
    createDownloadLink();

    recorder.clear();
  }

  function createDownloadLink() {
    recorder && recorder.exportWAV(function(blob) {
        alert("download link")
      var url = URL.createObjectURL(blob);
      var li = document.createElement('li');
      var au = document.createElement('audio');
      var hf = document.createElement('a');

      au.controls = true;
      au.src = url;
      hf.href = url;
      hf.download = new Date().toISOString() + '.wav';
      hf.innerHTML = hf.download;
      li.appendChild(au);
      li.appendChild(hf);
      recordingslist.appendChild(li);
    });
  }

  window.onload = function init() {
    try {
      // webkit shim
      window.AudioContext = window.AudioContext || window.webkitAudioContext;
      navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
      window.URL = window.URL || window.webkitURL;

      audio_context = new AudioContext;
      __log('Audio context set up.');
      __log('navigator.getUserMedia ' + (navigator.getUserMedia ? 'available.' : 'not present!'));
    } catch (e) {
      alert('No web audio support in this browser!');
    }

    navigator.getUserMedia({audio: true}, startUserMedia, function(e) {
      __log('No live audio input: ' + e);
    });
  };
  </script>

{% endblock %}

      <body>
        {% block content %}
        {% endblock %}

            <script type="text/javascript" src="{% static 'bootstrap/js/recorder.js' %}"></script>
    </body>
</html>

Here is my settings.py 这是我的settings.py

# Absolute path to the directory static files should be collected to.
# Don't put anything in this directory yourself; store your static files
# in apps' "static/" subdirectories and in STATICFILES_DIRS.
# Example: "/var/www/example.com/static/"
STATIC_ROOT = ''

# URL prefix for static files.
# Example: "http://example.com/static/", "http://static.example.com/"
STATIC_URL = '/static/'

# Additional locations of static files
STATICFILES_DIRS = (
    # Put strings here, like "/home/html/static" or "C:/www/django/static"
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
    '/home/kevin/Programming/accent/static/',
)

Answer 1

I also faced similar issue where recorderWorker.js was not being accessed. 我还遇到了类似的问题，即未访问recorderWorker.js 。 However, the problem was solved when I did the following: 但是，当我执行以下操作时，该问题已解决：

'static/filename/recorderWorker.js'

Note: Assuming that your JS file is located in the folder 'filename' which is in the static folder. 注意：假设您的JS文件位于静态文件夹中的文件夹“文件名”中。

As far as Django is concerned, it looks for static files like JS files into the static folder, since you did not specify the path it did not load the file. 就Django而言，它会在静态文件夹中查找JS文件之类的静态文件，因为您未指定未加载文件的路径。

Django的Javascript变量问题

问题描述

1 个解决方案

解决方案1
0 2014-08-06 13:44:55

Django的Javascript变量问题

问题描述

1 个解决方案

解决方案1 0 2014-08-06 13:44:55

解决方案1
0 2014-08-06 13:44:55