【问题标题】:Strange timeout when reloading static HTML page in Rails app在 Rails 应用程序中重新加载静态 HTML 页面时出现奇怪的超时
【发布时间】:2014-05-13 12:48:55
【问题描述】:

我在 Rails 应用程序的 public 文件夹中有一个小的静态 HTML 页面。此页面对输入键执行 AJAX 请求。一切都很好,除非我重新加载页面导轨卡住了几秒钟并且浏览器必须等待。最后 Rails 记录请求超时和浏览器加载页面。页面上没有 onload 处理程序,因此任何 Rails 控制器中的延迟都不会使浏览器等待。延迟的原因可能是什么?

这是该页面的代码:

<!DOCTYPE html>
<html>
<head>
    <title>Prompt test</title>
    <script src="/assets/jquery.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#searchbox").keyup(function(){
                if ($("#searchbox").val().length<2) {
                    $('#autocomplete').hide();
                    return;
                }
                $.ajax(
                        {
                            type: "POST",
                            url: "/prompts",
                            data: {
                                request_str: $("#searchbox").val()
                            },
                            success: function(data) {
                                $('#autocomplete').find('option').remove();
                                $('#autocomplete').attr('size', data.length);
                                console.log(data);
                                if (data.length==0) $('#autocomplete').hide(); else $('#autocomplete').show();
                                for (var i=0; i<data.length; i++) {
                                    $('#autocomplete').append($("<option></option>")
                                            .attr("value", data[i])
                                            .text(data[i]));
                                }
                            },
                            error: function(){
                                $('#autocomplete').find('option').remove();
                                $('#autocomplete').hide();
                            }
                        }
                );
            });
        });
    </script>
    <style type="text/css">
        #autocomplete{
            position: absolute;
            background: transparent;
            z-index: 10;
            width: 200px;
            display: none;
        }
    </style>
</head>
<body>
<input type="text" id="searchbox" /><br>
<select id="autocomplete" size="10" multiple="multiple">
</select>
</body>
</html>

这是路线:

match '/prompts', to: 'prompts#get_data', :via => :post

这是控制器:

require 'uri'
require 'net/http'
require 'json'

class PromptsController < ApplicationController
  skip_before_action :verify_authenticity_token

  def get_data
    uri = URI.parse("http://192.168.0.200:12345/prompts")

    data = {
        count: 10,
        text: params[:request_str],
    }

    http = Net::HTTP.new(uri.host, uri.port)
    request = Net::HTTP::Post.new(uri.request_uri, { 'Content-Type' => 'text/json' })
    request.body = data.to_json

    response = http.request(request)
    if response.code=='200'
      results = JSON.parse(response.body)['results']
      render :json => results.map { |res| res['text'] }
    else
      render :json => { error: response.code }
    end
  end
end

延迟的存在在某种程度上取决于 AJAX 请求是否被执行。如果是,则有 70% 的概率会延迟。

Rails 日志包含:

Started POST "/prompts" for 127.0.0.1 at 2014-04-02 14:19:58 +0400
Processing by PromptsController#get_data as */*
      Parameters: {"request_str"=>"gh"}
Completed 500 Internal Server Error in 60009ms

Net::ReadTimeout (Net::ReadTimeout):
  app/controllers/prompts_controller.rb:23:in `get_data'

【问题讨论】:

  • 它是否多次调用同一个 Ajax 请求?只需在浏览器日志中查看即可。

标签: ruby-on-rails timeout delay static-html


【解决方案1】:

当我将 Net::HTTP 替换为 HTTPClient 时,所有的延迟都以神奇的方式消失了。

【讨论】:

    【解决方案2】:

    可能是 Turbolinks 的问题 - 如果您执行“硬刷新”(按刷新按钮),它是否有效?

    要查看是否是 turbolinks 问题,为什么不试试这个:

          test_turbolinks = function() {
                $(documnt).on("keyup", "#searchbox", function(){
                    if ($("#searchbox").val().length<2) {
                        $('#autocomplete').hide();
                        return;
                    }
                    $.ajax(
                            {
                                type: "POST",
                                url: "/prompts",
                                data: {
                                    request_str: $("#searchbox").val()
                                },
                                success: function(data) {
                                    $('#autocomplete').find('option').remove();
                                    $('#autocomplete').attr('size', data.length);
                                    console.log(data);
                                    if (data.length==0) $('#autocomplete').hide(); else $('#autocomplete').show();
                                    for (var i=0; i<data.length; i++) {
                                        $('#autocomplete').append($("<option></option>")
                                                .attr("value", data[i])
                                                .text(data[i]));
                                    }
                                },
                                error: function(){
                                    $('#autocomplete').find('option').remove();
                                    $('#autocomplete').hide();
                                }
                            }
                    );
                });
            });
    
            $(document).on("page:load ready", test_turbolinks);
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2016-05-07
      • 2013-06-18
      • 2013-07-26
      • 2020-12-16
      • 2018-05-09
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多