0

Estoy tratando de hacer un formulario de contacto básico en React con un arhivo simple de php. Estoy usando también Axios para conectar el front con el back, pero no sé porqué me devuelve el estado 400 y un "Cannot POST /home/api/contact.php" pero no sé porqué. ¿Me podrán ayudar? No entiendo qué estoy haciendo mal.

Este es mi componente

const SectionContact = ({sectionData, className}) => {
    
    const API_PATH = 'http://localhost:3000/yasmin-hiasche/api/contact.php';

    const sendMail = async e => {
        e.preventDefault();
        let infoMail = {
            name: e.target.[0].value,
            email: e.target.[2].value,
            text: e.target.[4].value,
        };
        await axios({
          method: 'post',
          url: `${API_PATH}`,
          headers: { 'content-type': 'application/json' },
          data: infoMail
        })
    };
    
    return(
        <form className={`${classes.root} ${className}`} autoComplete="on" onSubmit={(e)=>sendMail(e)}>
            (...*inputs*...)
            <Button variant="outlined" type='submit' >Enviar</Button>            
            
        </form>
    )
}

export default SectionContact;

y este mi script de php

<?php
  header("Access-Control-Allow-Origin: *");
  $rest_json = file_get_contents("php://input");
  $_POST = json_decode($rest_json, true);

if ($_POST)
    {
    // set response code - 200 OK
    http_response_code(200);
    $subject = $_POST['infoMail.name'];
    $to = "[email protected]";
    $from = $_POST['infoMail.email'];

    // data
    $msg = $_POST['infoMail.text'];

    // Headers
    $headers = "MIME-Version: 1.0\r\n";
    $headers.= "Content-type: text/html; charset=UTF-8\r\n";
    $headers.= "From: <" . $from . ">";
    mail($to, $subject, $msg, $headers);

    // echo json_encode( $_POST )
    echojson_encode(array(
        "sent" => true
    ));
    }
  else
    {
    // tell the user about error
    echojson_encode(["sent" => false, "message" => "Something went wrong"]);
    }

?>

y la imagen de mi routeo:

introducir la descripción de la imagen aquí

2

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.