I would like to view HTTP POST data that was sent in Chrome.
The data is in memory now, and I have the ability to resubmit the form.
I know that if I resubmit the server will throw an error. Is there anyway I can view the data that is in Chrome’s memory?
shreyasm-dev
2,6835 gold badges16 silver badges34 bronze badges
asked Mar 24, 2013 at 20:23
makerofthings7makerofthings7
59.7k52 gold badges212 silver badges447 bronze badges
2
- Go to Chrome Developer Tools (Chrome Menu -> More Tools -> Developer Tools)
- Choose “Network” tab
- Refresh the page you’re on
- You’ll get list of http queries that happened, while the network console was on. Select one of them in the left
- Choose “Headers” tab
Voila!
Neuron
4,9945 gold badges38 silver badges57 bronze badges
answered Mar 24, 2013 at 20:55
12
You can filter for HTTP POST requests with the Chrome DevTools. Just do the following:
- Open Chrome DevTools (Cmd+Opt+I on Mac, Ctrl+Shift+I or F12 on
Windows) and click on the “Network” tab - Click on the “Filter” icon
- Enter your filter method:
method:POST
- Select the request you want to debug
- View the details of the request you want to debug
Screenshot
Tested with Chrome Version 53.
Neuron
4,9945 gold badges38 silver badges57 bronze badges
answered Sep 23, 2016 at 13:05
Benny CodeBenny Code
50.6k28 gold badges228 silver badges198 bronze badges
3
You can use Canary version of Chrome to see request payload of POST requests.
answered Aug 25, 2015 at 8:51
mihijsmihijs
6187 silver badges16 bronze badges
2
Another option that may be useful is a dedicated HTTP debugging tool. There’s a few available, I’d suggest HTTP Toolkit: an open-source project I’ve been working on (yeah, I might be biased) to solve this same problem for myself.
The main difference is usability & power. The Chrome dev tools are good for simple things, and I’d recommend starting there, but if you’re struggling to understand the information there, and you need either more explanation or more power then proper focused tools can be useful!
For this case, it’ll show you the full POST body you’re looking for, with a friendly editor and highlighting (all powered by VS Code) so you can dig around. It’ll give you the request & response headers of course, but with extra info like docs from MDN (the Mozilla Developer Network) for every standard header and status code you can see.
A picture is worth a thousand StackOverflow answers:
answered Sep 13, 2019 at 18:43
Tim PerryTim Perry
11.6k1 gold badge57 silver badges85 bronze badges
3
On Chrome 96 DevTools Network Tab;
After clicking the request, there is a “Payload” tab that shows the Form Data:
You can view the data as url encoded / decoded:
You can view the data as source / parsed:
Even if the method is GET you can see the Payload as Query String Parameters:
answered Nov 21, 2021 at 10:56
Adem TepeAdem Tepe
5545 silver badges10 bronze badges
1
It has a tricky situation: If you submit a post form, then Chrome will open a new tab to send the request. It’s right until now, but if it triggers an event to download file(s), this tab will close immediately so that you cannot capture this request in the Dev Tool.
Solution:
Before submitting the post form, you need to cut off your network, which makes the request cannot send successfully so that the tab will not be closed. And then you can capture the request message in the Chrome Devtool(Refreshing the new tab if necessary)
answered Mar 16, 2019 at 13:49
周左左周左左
3623 silver badges5 bronze badges
1
The Network tab is all you need…
answered Mar 27, 2021 at 1:47
dev mambadev mamba
6767 silver badges10 bronze badges
The other people made very nice answers, but I would like to complete their work with an extra development tool. It is called Live HTTP Headers and you can install it into your Firefox, and in Chrome we have the same plug in like this.
Working with it is queit easy.
-
Using your Firefox, navigate to the website which you want to get your post request to it.
-
In your Firefox menu Tools->Live Http Headers
-
A new window pop ups for you, and all the http method details would be saved in this window for you. You don’t need to do anything in this step.
-
In the website, do an activity(log in, submit a form, etc.)
-
Look at your plug in window. It is all recorded.
Just remember you need to check the Capture.
answered Nov 5, 2017 at 15:05
Sal-laSSal-laS
10.8k25 gold badges95 silver badges167 bronze badges
0
How can I intercept the post data a page is sending in FF or Chrome via configuration, extension or code? (Code part makes this programming related. 😉
I currently use Wireshark/Ethereal for this, but it’s a bit difficult to use.
asked Oct 25, 2009 at 23:23
1
You could just use the Chrome Developer Tools, if you only need to track requests.
Activate them with Ctrl+Shift+I and select the Network tab.
This works also when Chrome talks HTTPS with another server (and unless you have the HTTPS private key you cannot use Wireshark to sniff that traffic).
(I copied this answer from this related query.)
answered Apr 9, 2011 at 20:34
KajMagnusKajMagnus
11.2k15 gold badges78 silver badges125 bronze badges
2
With Firefox you can use the Network tab (Ctrl+Shift+E or Command+Option+E). The sub-tab “Params” shows the submitted form data.
Reference: https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor/request_details#Params
Alternatively, in the console (Ctrl+Shift+K or Command+Option+K) right click on the big pane and check “Log Request and Response Bodies”. Then when the form is submitted, a line with POST <url>
will appear. Click on it; it will open a new window with the form data.
As of the time of originally writing this reply, both methods messed up newlines in textarea fields. The former deleted them, the latter converted them to blanks. I haven’t checked with a newer version.
answered Aug 24, 2015 at 15:20
Pedro GimenoPedro Gimeno
2,7151 gold badge24 silver badges33 bronze badges
4
Do you have control of the browser POSTing the data?
If you do, then just use Firebug. It’s got a lot of usefull features, including this
answered Oct 25, 2009 at 23:27
Radu094Radu094
27.9k16 gold badges62 silver badges80 bronze badges
2
For Firefox there is also TamperData, and even more powerful and cross-browser is Fiddler.
answered Oct 26, 2009 at 0:07
Dirk VollmarDirk Vollmar
172k53 gold badges255 silver badges314 bronze badges
1
Programatically, you can do this with dBug – it’s a small code module you can integrate into any website.
I use it with CodeIgniter and it works perfectly.
answered Aug 31, 2019 at 13:49
In network tab of Web Developer tools in firefox right click on the PUT, POST or any type of request, you will find “Use as Fetch in Console” option. Here we can seed the data we are passing.
answered Aug 29, 2022 at 11:27
fgohilfgohil
431 silver badge7 bronze badges
Do the respective steps sequentially.
answered Dec 15, 2022 at 22:04
parmer_110parmer_110
3052 silver badges8 bronze badges
Запросы методом post являются одной из разновидностей диалога клиентского приложения и сервера. Они предназначены для передачи и добавления данных на удаленный ресурс. Поэтому запросы эти запросы имеют специальный контейнер для передаваемой информации, называемый телом запроса. Тело запроса post и его заголовки передаются незаметно для пользователя, работающего с сайтом с помощью браузера.
Вам понадобится
- Компьютер с доступом к интернету, браузер и расширения.
Инструкция
Современные браузеры содержат инструменты для веб-разработчиков, позволяющие получить некоторую информацию об отправляемых запросах post. Если вам требуется посмотреть заголовки всего пары запросов, их использование будет проще и быстрее других способов.
Если вы используете Firefox, вы можете воспользоваться его веб-консолью. Она отображает заголовки запросов и содержимое передаваемых файлов cookies. Для ее запуска раскройте меню браузера, щелкните по пункту «Веб-разработка» и выберите «Веб-консоль». В появившейся панели активируйте кнопку «Сеть». Введите в поле фильтра название метода – post. В зависимости от ваших целей, нажмите на кнопку формы отправляющей нужный запрос или обновите страницу. В консоли отобразится отправленный запрос. Кликните по нему мышкой, чтобы посмотреть подробнее.
Браузер Google Chrome имеет мощные инструменты отладки. Чтобы ими воспользоваться, кликните по иконке с изображением гаечного ключа, а затем раскройте пункт «Настройка и управление Google Chrome». Выберите пункт «Инструменты» и запустите «Инструменты разработчиков». В панели инструментов выберите вкладку Network и отправьте запрос. Найдите нужный запрос в списке и кликните по нему, чтобы изучить подробности.
В браузере Opera имеются встроенные инструменты для разработчиков Opera Dragonfly. Для их запуска кликните правой клавишей мышки по нужной странице и выберите пункт контекстного меню «Проинспектировать элемент». Перейдите на вкладку «Сеть» инструментов для разработчиков и отправьте нужный запрос. Найдите его в списке и раскройте, чтобы изучить заголовки и ответы сервера.
Internet Explorer 9 содержит комплект под названием «Средства разработчика F12», предоставляющие подробную информацию по выполненным запросам. Они запускаются нажатием кнопки F12 или с помощью меню «Сервис», содержащее одноименный пункт. Чтобы посмотреть запрос, перейдите на вкладку «Сеть». Найдите заданный запрос в сводке и с помощью двойного клика раскройте подробную информацию.
Браузеры Chrome и Internet Explorer 9 содержат встроенные инструменты, позволяющие изучить отправленный запрос post во всех деталях. Для получения полной информации используйте их или Firefox с установленным плагином Firebug. Он очень удобен для частого изучения запросов, например, при отладке сайтов.
Если вы хотите посмотреть запрос, отправленный не браузером, а какой либо другой программой, воспользуйтесь HTTP-отладчиком Fiddler. Он работает как прокси-сервер и перехватывает запросы любой программы, а также предоставляет очень подробную информацию по их заголовкам и содержимому.
Войти на сайт
или
Забыли пароль?
Еще не зарегистрированы?
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.
Данная относительно небольшая по объему текста инструкция расскажет вам о том, как можно выявить параметры GET / POST запросов к скрипту с помощью инструмента для разработчика, встроенного в любой браузер, построенный на базе движка webkit. Для примера я пожалуй возьму самого популярного из этого семейства – Google Chrome. Отлавливать буду форму авторизации CMS WordPress.
1. Кликаем по значку меню и раскрываем «Инструменты → Инструменты разработчика», либо просто нажимаем клавишу «F12» или сочетание клавиш «Ctrl+Shift+I».
2. Теперь, т.е. после того, как откроется небольшая «консоль», переходим на вкладку «Network». В адресной строке Хрома теперь набираем путь до веб-страницы, GET / POST данные запроса которой необходимо отловить. Лучше всего при этом узнать расположение самого скрипта на PHP.
3. На снимке окна приложения выше желтым подчеркиванием я выделил интересные для нас с вами моменты. В данном случае это обращения к скрипту под названием «wp-login.php».
Однако пока последний запечатлен немного не с тем состоянием, что нужно мне. Потому я ввожу заранее известные мне логин-пароль в форму авторизации и жму на кнопочку «Войти». Вот теперь уже можно приступать к анализу информации появившейся на вкладке Network:
4. Кликаем по «wp-login.php», что засветился в отладчике. Переходим на вкладку «Headers», — заголовки ответа веб-сервера. Сворачиваем все за исключением «From Data». А вот собственно и они, параметры запроса — в текущем примере отправленные методом POST.
log:admin pwd:1 wp-submit:Войти redirect_to:http://127.0.0.1/theme-unit-test/wp-admin/ testcookie:1
P.S. Практическое использование полученной информации для написания скрипта авторизации на сайте под управлением WordPress вы можете прочитать в моей предыдущей статье.
Опубликовано 28-03-2013 в 13:34
2 / 2 / 0 Регистрация: 27.01.2013 Сообщений: 17 |
|
1 |
|
13.08.2013, 15:04. Показов 56693. Ответов 8
Есть реальный пример: на сайте vk в браузере играет музыка, по нажатии на паузу она останавливается. Как мне отправить такой же POST запрос чтобы остановить музыку? Добавлено через 1 час 20 минут
2 |
19 / 19 / 3 Регистрация: 26.07.2013 Сообщений: 61 |
|
13.08.2013, 15:10 |
2 |
например в браузере Chrom есть возможность пользоваться девелоперскими тулзами, (при щелчке правой кнопкой, выбираете “проверить элемент”, там вкладку “Network”, а в ней уже смотрите заголовки и как подделать запрос).
0 |
2 / 2 / 0 Регистрация: 27.01.2013 Сообщений: 17 |
|
13.08.2013, 15:14 [ТС] |
3 |
Хорошо давай рассмотрим на примере этого сайте чуть ниже есть кнопочка “Отправить быстрый ответ”, через NetWork получить данные не получается, страница слишком быстро Добавлено через 1 минуту
0 |
19 / 19 / 3 Регистрация: 26.07.2013 Сообщений: 61 |
|
13.08.2013, 15:57 |
4 |
не уверен ,что правильно подделывать пост- запросы этого форума
0 |
2 / 2 / 0 Регистрация: 27.01.2013 Сообщений: 17 |
|
13.08.2013, 15:59 [ТС] |
5 |
Согласен, не будем рассматривать этот сайт. Просто поделитесь опытом как в chrome вы получаете запросы и как точно такие запросы выполнить позднее?
0 |
19 / 19 / 3 Регистрация: 26.07.2013 Сообщений: 61 |
|
13.08.2013, 16:29 |
6 |
немного позднее отвечу подробно, сейчас пока нет возможности
0 |
2 / 2 / 0 Регистрация: 27.01.2013 Сообщений: 17 |
|
13.08.2013, 16:31 [ТС] |
7 |
Я надеюсь ты не один, проблемы тривиальная, перехватить и воспроизвести программно на любом языке
0 |
rus_dao 19 / 19 / 3 Регистрация: 26.07.2013 Сообщений: 61 |
||||||||
13.08.2013, 16:59 |
8 |
|||||||
ну вот нашел сайт http://philarts.spbu.ru/contact-info
и вот этот кусок
берется из POST в “Network”
1 |
2 / 2 / 0 Регистрация: 27.01.2013 Сообщений: 17 |
|
13.08.2013, 17:53 [ТС] |
9 |
Спасибо!!! Действительно все стало понятно, вот только я не учел что данные во флеш кидать не получится. Есть какая-нибудь наводка как управлять флешем?
0 |