当从partial移动到.js文件时，Heroku示例直接上传到s3代码失败

Question

我已按照Heroku instructions直接上传到s3。以下宝石是相关的：

aws-sdk，jquery-rails，jquery-ui-rails和jquery.fileupload-rails

如果我将javascript放在上传副本中（使用<script></script），则一切正常。但是，如果我将javascript移动到.js文件，则会失败，并显示以下错误： Uncaught SyntaxError：Unexpected token＆lt; ，因此我知道正在查找和解析该文件。但文件漏掉了。

这是调试器指向的行：formData: <%= @s3_direct_post.fields.to_json.html_safe %>,。

这是控制器代码：

def index
        s3 = AWS::S3.new
        @bucket = s3.buckets['mybucket']
        @s3_direct_post = @bucket.presigned_post(key: "uploads/#{SecureRandom.uuid}/${filename}", success_action_status: 201, acl: :public-read)
end

这是部分代码：

<%= form_for(@user, html: { class: "directUpload" }) do |f| %>
  <div class="field">
    <%= f.label :avatar_url %><br>
    <%= f.file_field :avatar_url%>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

以下是完整的JavaScript代码：

    $(function() {
    $('.directUpload').find("input:file").each(function(i, elem) {
    var fileInput    = $(elem);
    var form         = $(fileInput.parents('form:first'));
    var submitButton = form.find('input[type="submit"]');
    var progressBar  = $("<div class='bar'></div>");
    var barContainer = $("<div class='progress'></div>").append(progressBar);
    fileInput.after(barContainer);
    fileInput.fileupload({
      fileInput:       fileInput,
      url:             '<%= @s3_direct_post.url %>',
      type:            'POST',
      autoUpload:       true,
      formData:         <%= @s3_direct_post.fields.to_json.html_safe %>,
      paramName:        'file', // S3 does not like nested name fields i.e name="user[avatar_url]"
      dataType:         'XML',  // S3 returns XML if success_action_status is set to 201
      replaceFileInput: false,
      progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        progressBar.css('width', progress + '%')
      },
      start: function (e) {
        submitButton.prop('disabled', true);

        progressBar.
          css('background', 'green').
          css('display', 'block').
          css('width', '0%').
          text("Loading...");
      },
      done: function(e, data) {
        submitButton.prop('disabled', false);
        progressBar.text("Uploading done");

        // extract key and generate URL from response
        var key   = $(data.jqXHR.responseXML).find("Key").text();
        var url   = '//<%= @s3_direct_post.url.host %>/' + key;

        // create hidden field
        var input = $("<input />", { type:'hidden', name: fileInput.attr('name'), value: url })
        form.append(input);
      },
      fail: function(e, data) {
        submitButton.prop('disabled', false);

        progressBar.
          css("background", "red").
          text("Failed");
      }
    });
  });
});