所以我很好奇在中止异步 javascript 请求时发生的实际底层行为。 this question里面有一些相关的信息但我还没有找到任何全面的内容。

我的假设一直是中止请求会导致浏览器关闭连接并完全停止处理它，从而导致服务器执行相同的操作(如果已设置)。不过，我想这里可能存在我没有想到的特定于浏览器的怪癖或边缘情况。

我的理解是这样的，希望有需要的人指正，希望对以后的人有一个很好的引用。

• 客户端中止 XHR 请求会导致浏览器在内部关闭套接字并停止处理它。我希望这种行为而不是简单地忽略传入的数据并浪费内存。不过，我并没有在 IE 上打赌。
• 服务器上的中止请求取决于那里正在运行的内容:
  • 我知道 PHP 的默认行为是在客户端套接字关闭时停止处理，除非调用了 ignore_user_abort()。因此，关闭 XHR 连接也可以节省您的服务器电量。
  • 我真的很想知道如何在 node.js 中处理它，我认为那里需要一些手动工作。
  • 我真的不知道其他服务器语言/框架以及它们的行为方式，但如果有人想提供具体细节，我很乐意在这里添加它们。

最佳答案

对于客户来说，最好看的地方是源代码，所以让我们开始吧! :)

让我们看一下 Blink 对 XMLHttpRequest 的 abort 方法的实现(XMLHttpRequest.cpp 中的第 1083-1119 行):

void XMLHttpRequest::abort()
{
    WTF_LOG(Network, "XMLHttpRequest %p abort()", this);
    // internalAbort() clears |m_loader|. Compute |sendFlag| now.
    //
    // |sendFlag| corresponds to "the send() flag" defined in the XHR spec.
    //
    // |sendFlag| is only set when we have an active, asynchronous loader.
    // Don't use it as "the send() flag" when the XHR is in sync mode.
    bool sendFlag = m_loader;
    // internalAbort() clears the response. Save the data needed for
    // dispatching ProgressEvents.
    long long expectedLength = m_response.expectedContentLength();
    long long receivedLength = m_receivedLength;
    if (!internalAbort())
        return;
    // The script never gets any chance to call abort() on a sync XHR between
    // send() call and transition to the DONE state. It's because a sync XHR
    // doesn't dispatch any event between them. So, if |m_async| is false, we
    // can skip the "request error steps" (defined in the XHR spec) without any
    // state check.
    //
    // FIXME: It's possible open() is invoked in internalAbort() and |m_async|
    // becomes true by that. We should implement more reliable treatment for
    // nested method invocations at some point.
    if (m_async) {
        if ((m_state == OPENED && sendFlag) || m_state == HEADERS_RECEIVED || m_state == LOADING) {
            ASSERT(!m_loader);
            handleRequestError(0, EventTypeNames::abort, receivedLength, expectedLength);
        }
    }
    m_state = UNSENT;
} 

因此，看起来大部分繁重的工作都是在 internalAbort 中完成的，如下所示:

bool XMLHttpRequest::internalAbort()
{
    m_error = true;
    if (m_responseDocumentParser && !m_responseDocumentParser->isStopped())
        m_responseDocumentParser->stopParsing();
    clearVariablesForLoading();
    InspectorInstrumentation::didFailXHRLoading(executionContext(), this, this);
    if (m_responseLegacyStream && m_state != DONE)
        m_responseLegacyStream->abort();
    if (m_responseStream) {
        // When the stream is already closed (including canceled from the
        // user), |error| does nothing.
        // FIXME: Create a more specific error.
        m_responseStream->error(DOMException::create(!m_async && m_exceptionCode ? m_exceptionCode : AbortError, "XMLHttpRequest::abort"));
    }
    clearResponse();
    clearRequest();
    if (!m_loader)
        return true;
    // Cancelling the ThreadableLoader m_loader may result in calling
    // window.onload synchronously. If such an onload handler contains open()
    // call on the same XMLHttpRequest object, reentry happens.
    //
    // If, window.onload contains open() and send(), m_loader will be set to
    // non 0 value. So, we cannot continue the outer open(). In such case,
    // just abort the outer open() by returning false.
    RefPtr<ThreadableLoader> loader = m_loader.release();
    loader->cancel();
    // If abort() called internalAbort() and a nested open() ended up
    // clearing the error flag, but didn't send(), make sure the error
    // flag is still set.
    bool newLoadStarted = m_loader;
    if (!newLoadStarted)
        m_error = true;
    return !newLoadStarted;
}

我不是 C++ 专家，但从外观上看，internalAbort 做了一些事情:

• 停止它当前对给定传入响应所做的任何处理
• 清除与请求/响应关联的任何内部 XHR 状态
• 告诉检查员报告 XHR 失败(这真的很有趣!我敢打赌这是那些不错的控制台消息的来源)
• 关闭响应流的“旧”版本或响应流的现代版本(这可能是与您的问题相关的最有趣的部分)
• 处理一些线程问题以确保正确传播错误(感谢评论)。

经过大量挖掘后，我在 HttpResponseBodyDrainer 中发现了一个有趣的函数(第 110-124 行)调用了 Finish，在我看来，这看起来像是在取消请求时最终会调用的东西:

void HttpResponseBodyDrainer::Finish(int result) {
  DCHECK_NE(ERR_IO_PENDING, result);
  if (session_)
    session_->RemoveResponseDrainer(this);
  if (result < 0) {
    stream_->Close(true /* no keep-alive */);
  } else {
    DCHECK_EQ(OK, result);
    stream_->Close(false /* keep-alive */);
  }
  delete this;
}

事实证明，至少在 BasicHttpStream 中，stream_->Close 委托(delegate)给了 HttpStreamParser ::Close，当给定一个 non-reusable 标志时(这似乎在请求中止时发生，如 HttpResponseDrainer 所示), 关闭套接字:

void HttpStreamParser::Close(bool not_reusable) {
  if (not_reusable && connection_->socket())
    connection_->socket()->Disconnect();
  connection_->Reset();
}

那么，就客户端发生的情况而言，至少就 Chrome 而言，据我所知，您最初的直觉似乎是正确的:)怪癖和边缘情况与调度/事件通知/线程问题以及特定于浏览器的处理有关，例如向 devtools 控制台报告中止的 XHR。

就服务器而言，对于 NodeJS，您需要监听 'close' event在 http 响应对象上。这是一个简单的例子:

'use strict';

var http = require('http');

var server = http.createServer(function(req, res) {
  res.on('close', console.error.bind(console, 'Connection terminated before response could be sent!'));
  setTimeout(res.end.bind(res, 'yo'), 2000);
});

server.listen(8080);

尝试运行它并在它完成之前取消请求。您会在控制台看到一个错误。

希望您觉得这很有用。挖掘 Chromium/Blink 源代码非常有趣 :)

关于javascript - 中止 XMLHttpRequest 的内部结构(客户端和服务器)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24258279/