1

我在publicRails 应用程序的文件夹中有一个小的静态 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'
4

2 回答 2

0

当我替换Net::HTTP为HTTPClient.

于 2014-04-07T09:00:26.943 回答
0

可能是 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);
于 2014-04-02T10:12:58.437 回答