Rails Heroku Postgres JavaScript 按钮操作仅适用于多次点击答案

【问题标题】：Rails Heroku Postgres JavaScript Button action only works on multiple clicksRails Heroku Postgres JavaScript 按钮操作仅适用于多次点击
【发布时间】：2014-03-30 07:07:27
【问题描述】：

我有一个运行 4.0.2、Ruby 2.1.0 的单页 lorem ipsum 生成器 Rails 应用程序。该应用程序在开发中运行良好，但是在部署到 Heroku 后，按钮单击出现问题，在第一次单击时不起作用。在开发中，它可以处理 20 多个查询，但在生产中，它似乎卡在超过 5 段的任何内容上。

按钮操作会在每次失败的点击时呈现 submit.js.erb 的状态为 200，直到它最终与其他点击一起工作。由于它在开发中运行良好，我认为这可能是模型调用结构的 Postgres 查询问题。

任何想法或建议将不胜感激。该应用程序目前部署在：

http://blooming-refuge-1066.herokuapp.com/

index.html.erb 上的表单

    <%= form_tag "/submit", remote: true do %>
    <div class="form">
      <table>
        <tbody>
          <tr>
            <div class="field">
            <td><p class="question">HOW MANY PARAGRAPHS?</p></td>
            <td><%= text_field_tag :paragraph_count, 1, {style: "width: 40px;", maxvalue: "10" } %></td>
            </div>
    <div class="actions">
          <%= submit_tag "Serenity Now", class: "btn btn-custom btn-lg", id: "buttnow" %>
        </div>

routes.rb 文件

      resources :homes
      root to: 'homes#index'
      post '/submit', to: 'homes#submit'
      resources :paragraphs

controller.rb 文件

      def submit
        limit = params[:paragraph_count].to_i
        @paragraphs = Paragraph.pluck(:description).shuffle[0...limit]

        respond_to do |format|
          format.js
        end
      end

提交.js.erb 文件

    $('#koanz').html("<p><%= @paragraphs.join('</p><p>').html_safe %></p>").show();

多次点击后的 Heroku 日志

            2014-02-27T03:25:45.933357+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:45 +0000
    2014-02-27T03:25:45.935086+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:45.935086+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:45.935086+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:45.933357+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:45 +0000
    2014-02-27T03:25:45.935086+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:45.956141+00:00 app[web.1]: Completed 200 OK in 21ms (Views: 3.3ms | ActiveRecord: 13.4ms)
    2014-02-27T03:25:45.955920+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.9ms)
    2014-02-27T03:25:45.955920+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.9ms)
    2014-02-27T03:25:45.956141+00:00 app[web.1]: Completed 200 OK in 21ms (Views: 3.3ms | ActiveRecord: 13.4ms)
    2014-02-27T03:25:46.017862+00:00 heroku[router]: at=info method=POST path=/submit host=blooming-refuge-1066.herokuapp.com request_id=c235c25b-ebb6-432f-8c82-2eb10c435678 fwd="50.149.115.166" dyno=web.1 connect=3ms service=90ms status=200 bytes=3085
    2014-02-27T03:25:48.061798+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:48 +0000
    2014-02-27T03:25:48.061798+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:48 +0000
    2014-02-27T03:25:48.063252+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:48.063252+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:48.063252+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:48.069377+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:48.069588+00:00 app[web.1]: Completed 200 OK in 6ms (Views: 0.6ms | ActiveRecord: 3.9ms)
    2014-02-27T03:25:48.069377+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:48.063497+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:48.069588+00:00 app[web.1]: Completed 200 OK in 6ms (Views: 0.6ms | ActiveRecord: 3.9ms)
    2014-02-27T03:25:49.138997+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:49 +0000
    2014-02-27T03:25:49.143518+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:49.157302+00:00 heroku[router]: at=info method=POST path=/submit host=blooming-refuge-1066.herokuapp.com request_id=1b726361-d376-4924-ac27-6d368ebdf631 fwd="50.149.115.166" dyno=web.1 connect=4ms service=21ms status=200 bytes=2431
    2014-02-27T03:25:49.138997+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:49 +0000
    2014-02-27T03:25:49.143518+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:49.143518+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:49.143518+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:49.153074+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:49.153074+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:49.153222+00:00 app[web.1]: Completed 200 OK in 10ms (Views: 0.7ms | ActiveRecord: 7.5ms)
    2014-02-27T03:25:49.153222+00:00 app[web.1]: Completed 200 OK in 10ms (Views: 0.7ms | ActiveRecord: 7.5ms)
    2014-02-27T03:25:50.279112+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:50 +0000
    2014-02-27T03:25:50.302745+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:50 +0000
    2014-02-27T03:25:50.308782+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:50.365665+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:50.342596+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:50.342934+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:50.342811+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:50.435740+00:00 app[web.1]: Completed 200 OK in 91ms (Views: 69.1ms | ActiveRecord: 19.8ms)
    2014-02-27T03:25:50.434368+00:00 app[web.1]: Completed 200 OK in 91ms (Views: 69.1ms | ActiveRecord: 19.8ms)
    2014-02-27T03:25:50.433489+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:51.164082+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:51 +0000
    2014-02-27T03:25:51.164082+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:51 +0000
    2014-02-27T03:25:51.165062+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:51.165062+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:51.165062+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:51.185743+00:00 heroku[router]: at=info method=POST path=/submit host=blooming-refuge-1066.herokuapp.com request_id=840bd593-2bb9-4126-907c-f09443a10695 fwd="50.149.115.166" dyno=web.1 connect=0ms service=39ms status=200 bytes=3025
    2014-02-27T03:25:51.179108+00:00 app[web.1]: Completed 200 OK in 8ms (Views: 0.9ms | ActiveRecord: 5.6ms)
    2014-02-27T03:25:51.179067+00:00 app[web.1]: Completed 200 OK in 8ms (Views: 0.9ms | ActiveRecord: 5.6ms)
    2014-02-27T03:25:51.170996+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:51.178856+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:51.178678+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:51.533809+00:00 heroku[router]: at=info method=POST path=/submit host=blooming-refuge-1066.herokuapp.com request_id=57abc2d7-5e73-4bf2-a875-1347fa37ed32 fwd="50.149.115.166" dyno=web.1 connect=0ms service=25ms status=200 bytes=2167
    2014-02-27T03:25:51.519012+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:51 +0000
    2014-02-27T03:25:51.521359+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:51 +0000
    2014-02-27T03:25:51.522698+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:51.523888+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:51.523972+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:51.524046+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:51.531096+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:51.531385+00:00 app[web.1]: Completed 200 OK in 7ms (Views: 0.8ms | ActiveRecord: 4.9ms)
    2014-02-27T03:25:51.531385+00:00 app[web.1]: Completed 200 OK in 7ms (Views: 0.8ms | ActiveRecord: 4.9ms)
    2014-02-27T03:25:51.531096+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:51.867868+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:51 +0000
    2014-02-27T03:25:51.867868+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:51 +0000
    2014-02-27T03:25:51.879393+00:00 heroku[router]: at=info method=POST path=/submit host=blooming-refuge-1066.herokuapp.com request_id=76c566ff-400a-40fa-8b01-c1e988cfc132 fwd="50.149.115.166" dyno=web.1 connect=0ms service=20ms status=200 bytes=2788
    2014-02-27T03:25:51.869165+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:51.869165+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:51.869165+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:51.869165+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:51.879542+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.6ms)
    2014-02-27T03:25:51.879542+00:00 app[web.1]: Completed 200 OK in 9ms (Views: 1.8ms | ActiveRecord: 2.3ms)
    2014-02-27T03:25:51.879542+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.6ms)
    2014-02-27T03:25:51.879542+00:00 app[web.1]: Completed 200 OK in 9ms (Views: 1.8ms | ActiveRecord: 2.3ms)
    2014-02-27T03:25:52.012890+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:52 +0000
    2014-02-27T03:25:52.012890+00:00 app[web.1]: Started POST "/submit" for 50.149.115.166 at 2014-02-27 03:25:52 +0000
    2014-02-27T03:25:52.014468+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:52.014468+00:00 app[web.1]: Processing by HomesController#submit as JS
    2014-02-27T03:25:52.014468+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:52.014468+00:00 app[web.1]:   Parameters: {"utf8"=>"✓", "paragraph_count"=>"5"}
    2014-02-27T03:25:52.018213+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:52.018173+00:00 app[web.1]:   Rendered homes/submit.js.erb (0.1ms)
    2014-02-27T03:25:52.018492+00:00 app[web.1]: Completed 200 OK in 4ms (Views: 0.6ms | ActiveRecord: 1.8ms)
    2014-02-27T03:25:52.018415+00:00 app[web.1]: Completed 200 OK in 4ms (Views: 0.6ms | ActiveRecord: 1.8ms)
    2014-02-27T03:25:37.884064+00:00 heroku[router]: at=info method=GET path=/ host=blooming-refuge-1066.herokuapp.com request_id=9920cd7f-26f9-4805-9741-569786279471 fwd="50.149.115.166" dyno=web.1 connect=9ms service=101ms status=200 bytes=6213

【问题讨论】：

标签： javascript ruby-on-rails heroku database-performance heroku-postgres

【解决方案1】：

导致随机出现重复提交的原因是一些生产段落包含特殊字符引号和一些额外的返回空格。这些导致 javascript 在 submit.js.erb 中中断。为了解决这个 submit.js.erb 被改变了。

    $('#koanz').html("<p><%= @paragraphs.map{|x| html_escape(x.gsub(/\n/, ''))}.join('</p><p>').html_safe %></p>").show();

【讨论】：

【解决方案2】：

当您多次加载同一个 javascript 文件时，经常会发生这种错误。确保 jquery_ujs 和 jquery 只加载一次。

【讨论】：

JS文件的加载看起来没问题。此外，按钮点击的性能与输入的大小直接相关。开发中的 30 段需要 1 秒，而在生产中我什至无法得到响应。