Google chrome 编辑和重播XHR chrome/firefox等?

Google chrome 编辑和重播XHR chrome/firefox等?,google-chrome,firefox,browser,xmlhttprequest,Google Chrome,Firefox,Browser,Xmlhttprequest,我一直在寻找一种方法来改变在我的浏览器中发出的XHR请求,然后再次重播它。 假设我在浏览器中完成了一个完整的POST请求,我只想更改一个小值,然后再次播放。直接在浏览器中执行此操作将更容易、更快 我用谷歌搜索过一段时间,但在Chrome或Firefox中还没有找到这样做的方法。在这些浏览器中,或者在另一个浏览器中,有什么方法可以做到这一点吗?Chrome: 在devtools的“网络”面板中,单击鼠标右键并选择“复制为卷曲” 粘贴/编辑请求,然后从终端发送,假设您有curl命令 请参阅捕获:

我一直在寻找一种方法来改变在我的浏览器中发出的XHR请求,然后再次重播它。 假设我在浏览器中完成了一个完整的POST请求,我只想更改一个小值,然后再次播放。直接在浏览器中执行此操作将更容易、更快


我用谷歌搜索过一段时间,但在Chrome或Firefox中还没有找到这样做的方法。在这些浏览器中,或者在另一个浏览器中,有什么方法可以做到这一点吗?

Chrome:

  • 在devtools的“网络”面板中,单击鼠标右键并选择“复制为卷曲”
  • 粘贴/编辑请求,然后从终端发送,假设您有
    curl
    命令
请参阅捕获:

或者,如果您需要在网页上下文中发送请求,请选择“复制为获取”并从javascript控制台面板编辑发送内容


Firefox:

Firefox允许直接从网络面板编辑和重新发送XHR。以下是来自Firefox 36的捕获:

我的两个建议:

  • +。更多信息:

  • 如果你在Windows上,那么Telerik的小提琴手是一个选择。它有一个用于重播http请求的composer选项,而且是免费的


  • 对于Firefox来说,问题自行解决了。它实现了“编辑并重新发送”功能

    对于Chrome来说,这似乎起到了作用。

    Chrome现在在版本67中有了拷贝作为获取:

    复制为获取 右键单击网络请求,然后选择“复制>复制为获取”
    ,将该请求的
    Fetch()
    -等效代码复制到剪贴板

    样本输出:

    fetch("https://stackoverflow.com/posts/validate-body", {
      credentials: "include",
      headers: {},
      referrer: "https://stackoverflow.com/",
      referrerPolicy: "origin",
      body:
        "body=Chrome+now+has+_Copy+as+fetch_+in+version+67%3A%0A%0A%3E+Copy+as+fetch%0ARight-click+a+network+request+then+select+**Copy+%3E+Copy+As+Fetch**+to+copy+the+%60fetch()%60-equivalent+code+for+that+request+to+your+clipboard.%0A%0A&oldBody=&isQuestion=false",
      method: "POST",
      mode: "cors"
    });
    

    不同之处在于copyascurl还将包括所有请求头(比如Cookie和Accept),并且适合在Chrome之外重放请求。
    fetch()
    代码适合在同一个浏览器中重放。

    如上所述,有几种方法可以实现这一点,但根据我的经验,操纵XHR请求并重新发送的最佳方法是使用chrome开发工具将请求复制为cURL请求(右键单击网络选项卡中的请求)只需导入邮递员应用程序(左上角的巨大导入按钮)。

    更新/完成:

    将请求复制为cUrl(bash)后,只需将其导入:


    5年过去了,这一基本要求没有被Chrome开发者忽视。
    虽然它们没有像Firefox那样提供编辑数据的方法,但它们提供了完整的XHR重播。
    这允许调试ajax调用。

    “Replay XHR”将重复整个传输。

    无需安装第三方扩展! 存在,您可以将其添加为浏览器书签,然后在任何站点上激活以跟踪和修改请求。它看起来像:


    有关更多说明,请查看github页面。

    基于Microsoft Chromium的Edge支持“网络”选项卡中的“编辑和重播”请求,这是一项实验性功能:

    要启用该选项,您必须“启用实验功能”。
    Control+Shift+I(Windows、Linux)或Command+Option+I(macOS)
    并勾选“启用网络控制台”旁边的复选框



    有关如何使用和该功能的更多详细信息,请参见

    这可能正是我想要的。我知道我可以复制cURL调用,但是我不能直接从终端运行它,因为我将获得身份验证。但由于终端直接内置到Chorme,我假设调用是从浏览器的“内部”发出的。如果是这样的话,那么这应该会达成协议。我在answerSmall技巧中添加了关于Firefox的信息:如果您想在浏览器中看到cURL输出,请在CLI中像这样运行它
    cURL…>preview.html
    然后在浏览器中打开该文件。@afilina要使此过程更加自动化,您可以在macOS上添加
    &&open preview.html
    ,并在请求后直接打开该文件。在这种情况下,Firefox做得更好!自从我开始使用Postman+拦截器chrome扩展以来,我就不需要Fiddler。仅供参考,chrome版的Postman应用程序现在已被弃用,在独立版本中设置它有点困难谢谢。对于任何想知道的人-您可以直接在Chrome控制台中粘贴
    fetch
    命令并重播请求。在获取之后,您可以使用以下命令来解析fetch返回的承诺并查看响应体(假设它是JSON)
    。然后(r=>r.JSON())。然后(JSON=>console.log(JSON))
    @Josh Lee,我认为POSIX兼容的提示很好,可以添加到这个答案中。@POSIX兼容的好提示,有没有一个更小的命令可以留在我的脑海中?!对于那些想知道将获取代码粘贴到哪里的人:粘贴并在控制台上修改它如果你在意识到“Replay XHR”在Chrome中不起作用后登陆这里,请注意在使用飞行前(
    选项
    )的情况下请求您需要在飞行前请求上单击“重播”,而不是实际的最终请求。该请求不再更新,并且有相当糟糕的评论。最好的选择是使用Firefox来完成这类工作。重新发送的情况似乎变化很快。现在Chrome已经为XHR请求重新发送了,但它不允许编辑。请注意Firefox版本76,它在编辑和重新发送时似乎与Cookie中的CSRF令牌有问题。在37版上试过,效果很好,但在76版上存在CSRF令牌验证问题。谢谢分享。仅供参考,这仍然是一个实验性功能。您必须通过以下链接启用Experience: