使用 Chrome 开发者工具发出 HTTP 请求
有没有办法使用 Chrome 开发者工具发出 HTTP 请求而不使用像 POSTER 这样的插件？
由于 Chrome（以及大多数其他浏览器）支持 Fetch API，因此现在可以很容易地从 devtools 控制台发出 HTTP 请求。
例如获取一个 JSON 文件：
fetch('https://jsonplaceholder.typicode.com/posts/1') .then(res => res.json()) .then(console.log)
或发布新资源：
fetch('https://jsonplaceholder.typicode.com/posts', { method: 'POST', body: JSON.stringify({ title: 'foo', body: 'bar', userId: 1 }), headers: { '内容类型': 'application/json; charset=UTF-8' } }) .then(res => res.json()) .then(console.log)
Chrome Devtools 实际上也支持新的 async/await 语法（尽管 await 通常只能在 async 函数中使用）：
const response = await fetch('https://jsonplaceholder.typicode.com/posts/1')
console.log(await response.json())
请注意，您的请求将受到 same-origin policy 的约束，就像浏览器中的任何其他 HTTP 请求一样，因此要么避免跨域请求，要么确保服务器设置允许您的请求的 CORS 标头。< /em>
使用插件（旧答案）
作为对先前发布的建议的补充，我发现 Chrome 的 Postman 插件运行良好。它允许您设置标头和 URL 参数、使用 HTTP 身份验证、保存您经常执行的请求等。
如果您想编辑并重新发出您在 Chrome 开发人员工具的网络选项卡中捕获的请求：
右键单击请求的名称
选择复制 > 复制为 cURL
粘贴到命令行（命令包括 cookie 和标头）
根据需要编辑请求并运行
https://i.stack.imgur.com/eMA1a.png
我知道，旧帖子...但是将其留在这里可能会有所帮助。
Modern browsers 现在支持 Fetch API。
你可以像这样使用它：
fetch("<url>")
.then(data => data.json()) // could be .text() or .blob() depending on the data you are expecting
.then(console.log); // print your data
ps：它将进行所有 CORS 检查，因为它是改进的 XmlHttpRequest。
扩展 @dhfsk answer
这是我的工作流程
在 Chrome DevTools 中，右键单击要操作的请求 > 复制为 cURL 打开 Postman 单击左上角的导入，然后粘贴原始文本
如果您的网页在您的页面中有 jquery，那么您可以在 chrome 开发人员控制台上编写它：
$.get(
"somepage.php",
{paramOne : 1, paramX : 'abc'},
function(data) {
alert('page content: ' + data);
}
);
它的jquery方式！
GET 请求，如果您想做其他类型的请求，您可能需要使用 $.ajax
var script = document.createElement("script"); script.src = "http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.js"; document.body.appendChild(script);
如果您想从同一个域进行 POST，您始终可以使用开发人员工具将表单插入 DOM 并提交：
https://i.stack.imgur.com/YCUCJ.png
结合上面的两个答案，我很幸运。在 Chrome 中导航到该站点，然后在 DevTools 的 Network 选项卡上找到该请求。右键单击请求并复制，但复制为 fetch 而不是 cURL。您可以将获取代码直接粘贴到 DevTools 控制台并进行编辑，而不是使用命令行。
要获取带有标头的请求，请使用此格式。
fetch('http://example.com', {
method: 'GET',
headers: new Headers({
'Content-Type': 'application/json',
'someheader': 'headervalue'
})
})
.then(res => res.json())
.then(console.log)
如果你在你的网站上使用 jquery，你可以在你的控制台上使用这样的东西
$.post('dom/data-home.php', { type : "home", id : "0" },function(data){ console.log(data) })
保持简单，如果您希望请求使用与您已经查看的页面相同的浏览上下文，那么在 Chrome 控制台中只需执行以下操作：
window.location="https://www.example.com";
$.post('dom/data-home.php', { type : "home", id : "0" },function(data){ console.log(data) })
是的，有一种方法无需任何 3rd 方扩展。
我已经构建了 javascript-snippet（您可以将其添加为 作为浏览器书签），然后在任何网站上激活以进行监控 &修改请求。 ：
https://i.stack.imgur.com/eQM9P.png
如需进一步说明，请查看 github 页面。
您可以在 Firefox 的 Inspector 中编辑/重新发送请求，而无需使用任何第三方，如下所示：
按 F12 在 Firefox 中打开检查器 ▶ 转到“网络”选项卡 找到您的 API 请求并单击它，这样“标题”部分将出现在右侧（您可以在顶部的栏中进行过滤）“标题”选项卡附带重新发送按钮，您可以在此处重新发送或编辑并重新发送
最短的方法是：
await (await fetch('<URL>')).json()
fetch("/echo/json/", { method: "POST", body: data })mode请求选项：fetch("/echo/json/", { method: 'POST', mode: 'no-cors' }。请注意， mode: "no-cors" 仅允许请求中包含一组有限的标头。 More info about using fetch and no-cors