我想在我正在工作的web应用程序中测试一些url。为此,我想手动创建HTTP POST请求(这意味着我可以添加任何我喜欢的参数)。

Chrome和/或Firefox中是否有我遗漏的功能?


您还可以使用Watir或WatiN来自动化浏览器。Watir是为Ruby编写的,而Watin是为。net语言编写的。但我不确定这是否是你要找的。

http://watin.sourceforge.net/ http://watir.com/


这是Chrome的高级REST客户端扩展。

它对我来说工作得很好——请记住,您仍然可以使用它的调试器。Network窗格特别有用;它会给你呈现JSON对象和错误页面。


忘记浏览器,试试CLI吧。HTTPie是一个很棒的工具!

CLI HTTP客户端:

HTTPie Curlie HTTP的很快 卷发型 wget

如果你坚持使用浏览器扩展,那么:

铬:

邮差- REST客户端(已弃用,现在有一个桌面程序) 高级REST客户端 Talend API测试器-免费版

Firefox:

RESTClient


我一直在做一个叫邮递员的Chrome应用程序这类东西。所有其他的扩展似乎有点过时,所以我做了自己的。它还有很多其他特性,这些特性对我们在这里记录自己的API很有帮助。


邮差现在也有本地应用(即独立)的Windows, Mac和Linux!现在更可取的是使用本地应用程序,在这里阅读更多。



对于Firefox,也有一个叫RESTClient的扩展,非常不错:

RESTClient,用于rest式web服务的调试器


CURL非常棒,可以做任何您想做的事情!这是一个简单但有效的命令行工具。

REST实现测试命令:

curl -i -X GET http://rest-api.io/items
curl -i -X GET http://rest-api.io/items/5069b47aa892630aae059584
curl -i -X DELETE http://rest-api.io/items/5069b47aa892630aae059584
curl -i -X POST -H 'Content-Type: application/json' -d '{"name": "New item", "year": "2009"}' http://rest-api.io/items
curl -i -X PUT -H 'Content-Type: application/json' -d '{"name": "Updated item", "year": "2010"}' http://rest-api.io/items/5069b47aa892630aae059584

受到Chrome版邮差的极大启发,我决定为Firefox写一些类似的东西。

REST Easy*是一个不可重启的Firefox插件,旨在对请求提供尽可能多的控制。该附加组件仍处于实验状态(Mozilla甚至还没有对其进行审查),但开发进展顺利。

这个项目是开源的,所以如果有人觉得有必要帮助开发,那就太棒了:https://github.com/nathan-osman/Rest-Easy

*从http://addons.mozilla.org上提供的附加组件将始终略落后于GitHub上提供的代码


查看http-tool for Firefox…

针对需要调试HTTP请求和响应的web开发人员。 在开发基于REST的API时非常有用。

特点: 得到 头 帖子 把 删除 向请求添加报头。 为请求添加主体内容。 响应的视图头。 在响应中查看正文内容。 查看响应状态码。 查看响应的状态文本。


火狐

通过按Ctrl+Shift+E或通过菜单栏->工具-> Web Developer -> Network打开开发人员工具中的网络面板。选择请求对应的行。

新版本

在最右边找到一个重发按钮。然后,一个新的编辑表单将在左侧打开。编辑它。

旧版本

然后点击右上角的小门图标(在屏幕截图中的扩展形式,你会发现它就在突出显示的header的左边),第二行(如果你没有看到它,然后重新加载页面)->编辑并重新发送你想要的任何请求


你特别要求“在Chrome和/或Firefox中的扩展或功能”,你已经收到的答案提供了这些,但我确实喜欢oezi对封闭问题“我如何使用web浏览器发送POST请求?”的简单参数的回答的简单性。oezi说:

在表单中,将方法设置为post

<form action="blah.php" method="post">
  <input type="text" name="data" value="mydata" />
  <input type="submit" />
</form>

例如,构建一个非常简单的页面来测试POST操作。


Runscope试试。https://www.hurl.it/上提供了一个免费的工具来测试他们的服务。

可以设置方法、认证、报头、参数和正文。响应显示状态代码、报头和正文。响应体可以使用可折叠的层次结构从JSON格式化。

付费帐户可以自动测试API调用,并使用返回数据构建新的测试调用。

COI披露:我与Runscope没有关系。


它可能与浏览器没有直接关系,但Fiddler是另一个很好的软件。


您可以使用ReqBin直接从浏览器发出请求。 不需要插件或桌面应用程序。


在这里值得一提的是,在Postman崛起之后诞生了其他一些客户:

失眠:与桌面应用程序和Chrome插件 跳房子:以前被称为Postwoman,并与Chrome插件可用。你也可以让它在docker本地工作,如果你想变得有趣 Paw:如果你在Mac上 高级Rest客户端:作为Chrome插件已经提到过,但值得指出的是它也有一个桌面应用程序 soapUI:用Java写的,有很多测试功能 回旋镖:另一种测试api的方法。它带有SOAP集成,也有一个可用的Chrome插件 雷霆客户端:如果你使用VS Code作为你的文本编辑器,那么你应该去看看这个很棒的扩展


我认为Benny Neugebauer对OP问题的评论关于Fetch API应该在这里作为一个答案,因为OP正在Chrome中寻找手动创建HTTP POST请求的功能,这正是Fetch命令所做的。

这里有一个Fetch API的简单例子:

// Make sure you run it from the domain 'https://jsonplaceholder.typicode.com/'. (cross-origin-policy)
fetch('https://jsonplaceholder.typicode.com/posts',{method: 'POST', headers: {'test': 'TestPost'} })
  .then(response => response.json())
  .then(json => console.log(json))

fetch命令的一些优点是非常宝贵的: 它简单,简短,快速,可用,甚至作为一个控制台命令,它存储在你的chrome控制台,可以稍后使用。

简单的按F12,在控制台选项卡中写入命令(或者按上键,如果你之前使用过),然后按Enter,看到它挂起并返回响应,这使得它对于简单的POST请求测试非常有用。

当然,这里的主要缺点是,与Postman不同,它不会通过跨源策略,但我仍然发现它对于在本地环境或其他可以手动启用CORS的环境中进行测试非常有用。


我试着用邮差软件,有一些认证问题。 如果你必须专门使用浏览器,去网络选项卡,右键单击呼叫,说编辑和发送响应。这里有一个类似的关于Firefox的ans,这个右键点击为我工作在边缘,非常确定它也适用于chrome


因此,我突然想到,您可以使用控制台,创建一个函数,并轻松地从控制台发送请求,其中将有正确的cookie等。

所以我在这里找到了这个:https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#supplying_request_options

// Example POST method implementation:
async function postData(url = '', data = {}, options = {}) {
  // Default options are marked with *
let defaultOptions = {
    method: 'POST', // *GET, POST, PUT, DELETE, etc.
    mode: 'cors', // no-cors, *cors, same-origin
    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
    credentials: 'same-origin', // include, *same-origin, omit
    headers: {
      'Content-Type': 'application/json'
      // 'Content-Type': 'application/x-www-form-urlencoded',
    },
    redirect: 'follow', // manual, *follow, error
    referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
    body: JSON.stringify(data) // body data type must match "Content-Type" header
  }

// update the default options with specific options (e.g. { "method": "GET" } )
const requestParams = Object.assign(defaultOptions, options);

const response = await fetch(url, requestParams);
  return response.text(); // displays the simplest form of the output in the console. Maybe changed to response.json() if you wish
}

如果你想GET请求,你可以把他们放在你的浏览器地址栏!

如果你把它粘贴到你的控制台,那么你可以通过重复调用你的函数来发出POST请求,就像这样:

postData('https://example.com/answer', { answer: 42 })
  .then(data => {
    console.log(data); // you might want to use JSON.parse on this
  });

服务器输出将打印在控制台中(以及网络选项卡中可用的所有数据)

这个函数假设您正在发送JSON数据。如果不是,则需要更改它以满足您的需要


Windows命令行解决方案

在PowerShell中,您可以使用Invoke-WebRequest。示例语法:

Invoke-WebRequest -Uri http://localhost:3000 -Method POST -Body @{ username='clever_name', password='hunter2' } -UseBasicParsing

在没有Internet Explorer的系统上,您需要-UseBasicParsing标志。


这个问题现在已经12年了,很容易理解为什么作者在当时要求Firefox或Chrome的解决方案。12年后,也出现了其他浏览器,其中最好的不涉及任何附加组件或额外工具的浏览器是Microsoft Edge。

只需打开devtools (F12),然后是网络控制台选项卡(不是网络或控制台选项卡)。如果它不可见,请单击+号并打开它)。

下面是官方指南: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/network-console/network-console-tool

玩得开心!