Can't send mail with php mail() angular

Question

After many search, my problem is still here. I'm new with angular and i try to send a mail in my personnal adresse after validate a contact form.

I have no mail after submit but if i copy and past the file mail.php in my server and i ping in i have a mail with default values.

When i use postman aplication a have the return of echo in my mail.php

I need your help

Here my contact.component.ts

  import { Component, OnInit } from '@angular/core';
import { FormGroup , FormControl, Validators } from '@angular/forms';
import { Http }    from '@angular/http';

@Component({
  selector: 'contact',
  templateUrl: './contact.component.html',
  styles:['input.ng-invalid {border-left: 5px solid red;}',
    'input.ng-valid {border-left:5px solid green;}',
    'input.ng-pristine {border-left: 1px solid grey;}',
    'textarea.ng-invalid {border-left: 5px solid red;}',
      'textarea.ng-valid {border-left:5px solid green;}',
      'textarea.ng-pristine {border-left: 1px solid grey;}']
  // styleUrls: ['../../app.component.css']
})
export class ContactComponent implements OnInit {

    name: string;
    email: string;
    message: string;
    endpoint : string;

    http : Http;

    constructor(http : Http) {
        this.http = http;
    }

    userForm = new FormGroup({
        nom: new FormControl(null),
        prenom: new FormControl(null),
        email: new FormControl(null),
        telephone: new FormControl(null),
        message: new FormControl(null)
    });

    onSubmit(){
        console.log(this.userForm.value);
        let postVars = {
          email : this.email,
          name : this.name,
          message : this.message
        };
            this.endpoint = "http://localhost:8000/src/app/page/contact/mail.php";
        this.http.post(this.endpoint, postVars)
        .subscribe(
            response => console.log(response),
            response => console.log(response)
        )
    }

    ngOnInit() {
    //This data could really come from some inputs on the interface - but let's keep it simple.
    this.email = "mypersonaladress@gmail.com";
    this.name = "Hayden Pierce";
    this.message = "Hello, this is Hayden.";

        //Start php via the built in server: $ php -S localhost:8000
            this.endpoint = "http://localhost:8000/src/app/page/contact/mail.php";
    }


}

here my contact.component.html


    
        
            Vous desirez discuter un moment?
            Vous etes sur au bon endroit ?
        
        
            
                Nom
                
                {{refNom.className}}
                
                    Merci de rentrer un nom
                
                
                    Il faut écrire un nom avec plus de deux characteres
                
                
                    Vous n'avez pas un diminutif?
                
            
            
                Prenom
                
                {{refPrenom.className}}
                
                    Merci de rentrer un prénom
                
                
                    Il faut écrire un prénom avec plus de deux characteres
                
                
                    Vous n'avez pas un diminutif?
                
            
            
                email
                
            
            
                Telephone
                
            
            
                Votre message

here my mail.php file

    message
';
mail('mypersonaladress@gmail.com', 'mon sujet', 'coucou');

switch($_SERVER['REQUEST_METHOD']){
    case("OPTIONS"): //Allow preflighting to take place.
        header("Access-Control-Allow-Origin: *");
        header("Access-Control-Allow-Methods: POST");
        header("Access-Control-Allow-Headers: content-type");
        exit;
    case("POST"): //Send the email;
        header("Access-Control-Allow-Origin: *");

        $json = file_get_contents('php://input');
        $params = json_decode($json);
        $email = $params->email;
        $name = $params->name;
        $message = '$params->message
';

        $recipient = 'mypersonaladress@gmail.com
';
        $subject = 'new message
';
        $headers = "From: toto@toto.com
";
        if(mail($recipient, $subject, $message, $headers)){
            echo'totooo';
        }
    //    mail($recipient, $subject, $message, $headers);
        break;
    default: //Reject any non POST or OPTIONS requests.
        header("Allow: POST", true, 405);
        exit;
}
?>

i have no error on the bash for ng serve and on the bash php -S localhost:8000 i can see [Thu Apr 13 14:41:37 2017] 127.0.0.1:34118 [200]: /src/app/page/contact/mail.php

i dont know how to fix this.

AVJT82 · Accepted Answer

Try and set the url parameter with URLSearchParams and use RequestOptions and set headers with x-www-form-urlencoded. I also noticed the weird use of Http, remove declaring http in component: http : Http;

and change your constructor to:

constructor(private http : Http) { }

But back to the POST request. Import the following:

import { RequestOptions, URLSearchParams, Headers } from '@angular/http';

Your onSubmit:

onSubmit(){
  let body = new URLSearchParams();
  body.set('email', this.email);
  body.set('name', this.name);
  body.set('message', this.message);

  let headers = new Headers();
  headers.append('Content-Type', 'application/x-www-form-urlencoded');
  let options = new RequestOptions({ headers: headers });

  this.endpoint = "http://localhost:8000/src/app/page/contact/mail.php";

    this.http.post(this.endpoint, body, options)
      .subscribe(
        response => console.log(response)
    )
}

Hopefully this helps! Furthermore, I suggest you move all your http request to an actual service, that is usually the way to do it ;)

Can't send mail with php mail() angular

Answers (1)

Related Questions

Can&#39;t send mail with php mail() angular

Answers (1)

Related Questions

Can't send mail with php mail() angular