使用AngularJs,尝试通过Google App Engine上的PHP使用HTML Contact-Us表单发送电子邮件

时间:2016-04-25 19:19:13

标签: javascript php angularjs google-app-engine

以下是联系表单

的html代码
<div class="col">
        <h3>Say hello</h3>
        <div ng-show="error" class="error">
            <p>Something wrong happened!, please try again.</p>
        </div>
        <form method="post" role="form" ng-submit="sendMessage(input)" class="contactForm" name="form" id="contact_form" >
            <input type="text" name="firstname" id="firstname" placeholder="Name" required="required" ng-model="input.name">
            <input type="text" name="telephone" id="telephone" placeholder="Telephone" required="required" ng-model="input.telephone">
            <input type="text" name="email" id="email" placeholder="Email" required="required" ng-model="input.email">
            <textarea name="comments" maxlength="1000" cols="20" rows="3" placeholder="Comment" required="required" ng-model="input.message"></textarea>
            <button type="submit" name="submit" value="submit" ng-disabled="!form.$valid">Submit</button>
        </form>
        <!-- <div ng-show="process" style="text-align:center">
            <img class="loader" src="" />
                Sending ...
        </div> -->
        <div ng-show="success" class="success">
            <p>Thank you for taking the time to contact us</p>
            <p>Have A Great Day!</p>
        </div>
        <div class="clearboth"></div>
    </div>

来自app.js的代码

var app = angular.module('example', []).
    run(['$rootScope', '$http', '$browser', '$timeout', "$route", function ($scope, $http, $browser, $timeout, $route) {
    $scope.sendMessage = function( input ) {
    input.submit = true;
    $scope.success = false;
    $scope.error = false;
    $scope.loaded = true;
        $scope.process = true;
    $http({
    method: 'POST',
    url: 'js/sendemail.php',
    data: input,
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
  })
  .success( function(data) {
    if ( data.success ) {
      $scope.success = true;
      $scope.process = false;
      $("form").trigger("reset");
    } else {
      alert("error :" +data);
      $scope.error = true;
    }
 });
};

以下是我的sendemail.php代码

<?php
  $response = array( 'success' => false );
  $formData = file_get_contents( 'php://input' );
  $data = json_decode( $formData );
  if ( $data->submit ) {
    $name = $data->name;
    $email = $data->email;
    $telephone = $data->telephone;
    $message = $data->message;

    if ( $name != '' && $email != '' && $message != '' && $telephone != '') {
      $mailTo = 'xxx@gmail.com';
      $subject = 'New Contact Form Submission';
      $body  = 'From: ' . $name . "\n";
      $body .= 'Email: ' . $email . "\n";
      $body .= 'Telephone: ' . $telephone . "\n";
      $body .= "Message:\n" . $message . "\n\n";

      $success = mail( $mailTo, $subject, $body );

      if ( $success ) {
        $response[ 'success' ] = true;
      } else {
        $response[ 'success' ] = false;
}
    }
  }
   echo json_encode( $response );
?>

我已将日志保存在JavaScript sendMessage函数中,以检查数据是否来自html。是的它来了。我可以在警报信息中看到数据。

我已经浏览了许多链接并更新了Google App Engine - &gt;设置 - &gt;电子邮件地址。

当我点击表格中的提交按钮时。我可以看到我用JS警告写的警告信息(“错误”+数据); 警报框由整个php代码组成。

下面的

也是我的app.yaml文件

 runtime: python27
 api_version: 1
 threadsafe: true

 handlers:
 - url: /
   static_files: static/index.html
   upload: static/

   - url: /images
     static_dir: static/images

   - url: /css
     static_dir: static/css

   - url: /js
     static_dir: static/js

   - url: /pages
     static_dir: static/pages

     - url: /static
       static_dir: static

     - url: /(.+\.php) 
       script: \1

     - url: /.*
       script: start.application

有人可以帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

而不是PHP,请尝试使用适用于python应用程序的Google App Engine邮件API:sending-mail-with-mail-api,您仍然可以使用Angular进行数据绑定。