我想在我正在工作的web应用程序中测试一些url。为此,我想手动创建HTTP POST请求(这意味着我可以添加任何我喜欢的参数)。
Chrome和/或Firefox中是否有我遗漏的功能?
我想在我正在工作的web应用程序中测试一些url。为此,我想手动创建HTTP POST请求(这意味着我可以添加任何我喜欢的参数)。
Chrome和/或Firefox中是否有我遗漏的功能?
当前回答
它可能与浏览器没有直接关系,但Fiddler是另一个很好的软件。
其他回答
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
我认为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的环境中进行测试非常有用。
因此,我突然想到,您可以使用控制台,创建一个函数,并轻松地从控制台发送请求,其中将有正确的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数据。如果不是,则需要更改它以满足您的需要
我一直在做一个叫邮递员的Chrome应用程序这类东西。所有其他的扩展似乎有点过时,所以我做了自己的。它还有很多其他特性,这些特性对我们在这里记录自己的API很有帮助。
邮差现在也有本地应用(即独立)的Windows, Mac和Linux!现在更可取的是使用本地应用程序,在这里阅读更多。
查看http-tool for Firefox…
针对需要调试HTTP请求和响应的web开发人员。 在开发基于REST的API时非常有用。
特点: 得到 头 帖子 把 删除 向请求添加报头。 为请求添加主体内容。 响应的视图头。 在响应中查看正文内容。 查看响应状态码。 查看响应的状态文本。