Как я могу увидеть данные тела сообщения в инструментах Chrome Dev?

Question

У меня есть этот API выборки в React, который отправляет данные на сервер.Сервер работает на PHP, и у меня возникают проблемы с доступом к данным с помощью $ _POST или file_get_contents ('php: // input');

Поэтому я хочу проверять каждый шаг процесса, пока не увижу, гдеошибка есть.Я также хочу проверить, как отправляются почтовые данные.т.е. я хочу видеть фактические данные и полный запрос из браузера.

Запрос на получение выглядит следующим образом:

export function sendEmail (data) {
  return fetch('http://example.com/email.php', {
    method: 'POST',
    credentials: 'same-origin',
    headers: {
      Accept: 'application/json',
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
  }).then(response => response.json())
}

Когда я захожу в инструменты разработчика Google Chrome, я вижу заголовки запроса, ответ и т. д., но нигде не видно фактических отправляемых данныхЯ смотрел в Интернете, и никто не может дать четкий ответ.

Answer 1

В ваших инструментах разработчика, нажмите вкладку Сеть, затем выполните запрос и щелкните по нему.Прокрутите до раздела тела запроса. вкладка "Сеть"

Answer 2

Я рекомендую вам axios, проще проверить, если успех или ошибка, и чище:

Публикация без какого-либо тела отправлено;

import axios from 'axios';

axios.post('http://example.com/email.php')
.then(response=>response.data)
.then(response=>console.log('Success:', response))
.catch(err=>console.log('Error: ',err))

С некоторыми аргументами:

axios.post('http://example.com/email.php', 
{
  firstName: 'Fred',
  lastName: 'Flintstone'
})
.then(response=>response.data)
.then(response=>console.log('Success:', response))
.catch(err=>console.log('Error: ',err)

Answer 3

Скрипач может быть полезным в этом сценарии.Он покажет вам тело сообщения, отправленное на вашу PHP конечную точку.