为什么 HTTP 请求会卡在 Chrome 中的待处理状态？

Question

语言/工具版本：

1. @angular/cli: 1.2.0
2. PHP 7.0.8
3. Zend Expressive 2
4. Apache 2.4.23
5. 铬 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 上的点击事件的请求），请求也将解决

我尝试过的事情：

1. 我浏览了多个帖子（例如1、2、3 等）都遇到了类似的问题，但没有一个非常 有用，我读到如果我有多个 HTTP 请求，这可能会发生。就我而言，我尝试隔离请求，现在我在组件初始化时只发送一个请求。甚至一个请求都会卡住。我的控制台会显示一个失败的GET 请求，然后继续等待，解决后，将有一个成功的OPTIONS 请求，然后是一个成功的GET。
2. 我不确定这是否是我的前端 Angular 的问题 应用程序或后端 PHP 应用程序，所以在初始化时 在组件中，我调用了一个随机 API 端点： http://api.randomuser.me/ 而不是请求我的 API 端点。 在这种情况下，请求成功，没有任何延迟（尽管它 显示 CORS 错误）。所以我认为问题出在我的 后端 API 或 Apache 网络服务器。
3. 我尝试查看是否有某些原因导致 API 出现延迟，但在浏览器请求成功之前，应用程序的入口点本身不会被命中。

我还想分享我的虚拟主机配置。如果您在那里发现任何问题：

<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 应用程序本身内部的标头，但仍然没有运气。
• 应用程序在 Mozilla 或 Chrome 上运行良好，当 预测服务未启用

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

Answer 1

嗯，我认为，执行以下操作已经消除了我机器上的延迟。

在解决之前，这是我的假设：

1. Chrome 正在执行并行请求，只要“预测服务 快速加载页面已启用”
2. 我的 Apache Web 服务器没有处理这些并行请求。

解决方案：

1. 我包含了 apache 的 mpm 模块文件。你可以找到 httpd.conf 文件中的以下行：

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

   Windows 使用 mpm_winnt_module 表示 mpm。

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

2. 找到下面的行并取消注释：

   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
   

3. 重启你的apache

就是这样！

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

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

你的回答会很有价值，会让事情变得更清楚。

Answer 2

此问题是由于您的网速较慢造成的。 当 onInit() 调用时，它会加载所有 web 服务并等待第一个 web 服务的完成。当第一个服务的执行结束时，第二个服务将开始执行，但它仍然处于 Pending 状态，因此它在状态列中显示“Pending”网络