为什么HTTP请求在Chrome中停留在待处理状态? [英] Why are HTTP requests getting stuck on pending in Chrome?

问题描述

语言/工具版本:

1. @ angular/cli:1.2.0
2. PHP 7.0.8
3. Zend Expressive 2
4. Apache 2.4.23
5. Chrome 65.0.3325.181
6. Windows 7

问题:

我有一个Angular2应用程序，该应用程序将PHP应用程序用作所有XHR请求的API.该应用程序运行良好，但是在Chrome中启用了Use a prediction service to load pages more quickly选项时，以及重新加载该应用程序时，在该组件的ngOnInit()内部发送的HTTP请求被卡住了很长时间.请求会在10s-2-3分钟后自行解决，以此类推，或者如果我发送另一个请求(例如，在DOM上发生click事件的请求)，请求也会解决.

I have an Angular2 application which uses a PHP application as an API for all the XHR requests. The application works fine but when the Use a prediction service to load pages more quickly option is enabled in Chrome, and when the application is reloaded HTTP requests sent inside ngOnInit() of the component gets stuck for very long. Either the request will resolve itself after 10s-2-3mins, etc or the request(s) will also resolve if I send another request(for example, a request upon a click event on the DOM)

我尝试过的事情:

1. 我浏览了多个帖子(例如> ， 2 ，3 等)，但有类似的问题，但都没有 有用，我读到如果我有多个HTTP请求，则可能会发生这种情况.就我而言，我尝试隔离请求，现在在组件初始化时仅发送一个请求.甚至一个请求都被卡住了.我的控制台将显示失败的GET请求，然后一直等待，解决后，将成功执行OPTIONS请求，然后成功执行GET.
2. 我不确定前端Angular是否存在问题 应用程序或后端PHP应用程序，因此在初始化时 对于组件，我称其为随机API端点: http://api.randomuser.me/而不是请求我的API端点. 在这种情况下，请求成功完成，没有任何延迟(尽管它 显示CORS错误).所以我认为问题出在 后端API或Apache Web服务器.
3. 我试图查看是否是某种原因导致了API的延迟，但是直到浏览器的请求成功后，应用程序的入口点本身才被击中.

1. I went through multiple posts (such as 1, 2, 3, etc) with a similar problem but none were very useful, I read that this could happen if I have multiple numbers of HTTP requests. In my case, I tried isolating the requests and now I am sending only one request upon initialization of the component. Even one single request gets stuck. My console will show a failed GET request and then keeps waiting, upon resolution, there will be a successful OPTIONS request and then a successful GET.
2. I was not sure if this is a problem with my frontend Angular application or the backend PHP application, so upon initialization of the component, I called a random API endpoint: http://api.randomuser.me/ rather than requesting my API endpoint. In this case, the request succeeds without any delay(although it shows CORS errors). So I think the problem resides in either my backend API or the Apache web server.
3. I tried to see if something is causing the delay in the API, but the application's entry point itself is not hit until the request is successful from the browser.

我也想分享我的虚拟主机配置.如果您在那里发现任何问题:

I would also like to share my virtual host configuration. If you find any problems there:

<VirtualHost *:80>
ServerName someName.api
DocumentRoot path_to_public_dir
SetEnv APPLICATION_ENV development
<Directory path_to_public_dir>

    SetEnvIf Origin "http(s)?://(www\.)?(local\.)?(localhost:4200|someDomain.com)$" AccessControlAllowOrigin=$0
    Header always set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin

    RewriteEngine On 

    RewriteCond %{REQUEST_FILENAME} -s [OR]
    RewriteCond %{REQUEST_FILENAME} -l [OR]
    RewriteCond %{REQUEST_FILENAME} –d
    RewriteRule ^.*$ - [NC,L]
    RewriteRule ^.*$ index.php [NC,L]
    Options -Indexes +MultiViews +FollowSymLinks
    AllowOverride none
    Order Allow,Deny
    Allow from all
</Directory>

请注意:

• 我也尝试设置Access-Control-Allow-Origin 标头包含在应用程序本身中，但仍然没有运气.
• 当 预测服务未启用

• I have also tried with setting the Access-Control-Allow-Origin header inside the application itself, but still no luck.
• The application works just fine on Mozilla or on Chrome when the prediction service is not enabled

您对所有可能导致这种行为的原因的建议/答案将非常有帮助.

Your suggestions/answers on to what all could be the possible causes for such a behavior would be really helpful.

推荐答案

好吧，我认为，执行以下操作可以消除计算机延迟.

Well, I think, doing the following has removed the lag from my machine.

在解决方案之前，这是我的假设:

Before the solution, here are my assumptions:

1. 每当预测服务 快速加载页面已启用"
2. 我的Apache Web服务器未处理这些并行请求.

1. Chrome is doing parallel requests whenever "Prediction service to load pages quickly is enabled"
2. My Apache web server was not handling those parallel requests.

解决方案:

1. 我包括了 mpm 用于Apache的模块文件.你可以找到 httpd.conf文件中的以下行:

1. I included the mpm modules file for apache. You can find the below line in httpd.conf file:

#Include conf/extra/httpd-mpm.conf并取消注释.

Windows将 mpm_winnt_module 用作mpm.

Windows uses the mpm_winnt_module for mpm.

此多处理模块(MPM)是Windows NT操作系统的默认设置.它使用单个控制过程 启动一个子进程，该子进程进而创建线程以 处理请求

This Multi-Processing Module (MPM) is the default for the Windows NT operating systems. It uses a single control process which launches a single child process which in turn creates threads to handle requests

找到下面的行并取消注释:

Find the lines below and uncomment them:

EnableMMAP off        
EnableSendfile on

AcceptFilter http none
AcceptFilter https none

#Extra Notes
#mmap is memory map by apache, don't know I have uncommented this, had read about
this somewhere, but anyway its Off so should not be a Burden on OS
#EnableSendFile:Delivering static files? This link may help:
https://groups.drupal.org/node/68333
#AcceptFilter: windows mpm module, suggests to keep it as none. 
I went through this : https://httpd.apache.org/docs/2.4/mod/core.html
and have set AcceptFilter http/https as "connect", it works fine for me. 
Please note: I am using Apache 2.4.23

重新启动Apache

就是这样！

我不接受这个问题，因为:

I am leaving this question as unaccepted because:

1. 我不知道我做的是否正确.
2. 尽管我启用了winnt模块，但找不到该模块 文件在我的apache目录中的任何位置，尽管 反映了ThreadsPerChild，我想apache不需要 外部winnt模块.
3. 尽管我可以观察到页面加载速度有所提高， 请求不再卡住了，我仍然可以看到交错 failed and finshed我的Chrome浏览器中的每个请求的请求 控制台.

1. I don't know if what I did is right.
2. Although I enabled the winnt module, I couldn't find the module file anywhere in my apache directory, although changes in the ThreadsPerChild is reflected, I guess apache doesn't need an external winnt module.
3. Although I can observe that the page load speed has increased and requests are not getting stuck anymore, I can still see interleaved failed and finshed requests for every request in my chrome console.

您的答案将非常有价值，并使事情变得更清楚.

Your answers will be really valuable and make things more clear.

这篇关于为什么HTTP请求在Chrome中停留在待处理状态?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！