Nginx Ajax Post

Nginx Ajax Post

本文关键字:Post Ajax Nginx      更新时间:2023-09-26

我计划从Apache2+Varnish迁移到Nginx,因为其中一个站点将运行SSL,而我不想只为SSL安装和运行另一个服务,当一切都可以通过Nginx实现时。

我遇到的问题是,一个简单的html网站有一个联系人表单,它向PHP文件发出AJAX请求,响应显示在表单上。

现在的情况是,我被重定向到PHP脚本,而不是表单,以从脚本中获得响应并显示它

这是联系表格:

          <div class="feedback" id="contact">
            <div class="wrap">
              <h2>Get in Touch</h2>
                  <div class="line blue"><span> </span></div>
           <h4>Contact Us! We would love to answer any of your questions & give you a Free quote!</h4>
                      <form id="contactForm" action="form.php" method="POST">
                      <div class="text-box">
                       <label>
           <input type="text" name="name" class="textbox" value="Your Name:" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Your Name:';}">
          </label>
          <label>
           <input type="text" name="email" class="textbox" value="Your Email:" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Your Email:';}">
          </label>
          <div class="clear"></div>
          </div>
          <textarea name="message" placeholder="Message:"></textarea>
          <script>$('input,textarea').focus(function(){
                     $(this).data('placeholder',$(this).attr('placeholder'))
                     $(this).attr('placeholder','');
                  });
                  $('input,textarea').blur(function(){
                     $(this).attr('placeholder',$(this).data('placeholder'));
                  });
          </script>
          <div class="contactResponse"></div>
          <button type="submit">Send</button>
          </form>
             </div>
          </div>
 </div>
 </div>
<script>
 $("#contactForm").submit(function(event)
{
    /* stop form from submitting normally */
    event.preventDefault();
    /* get some values from elements on the page: */
    var $form = $( this ),
        $submit = $form.find( 'button[type="submit"]' ),
        name_value = $form.find( 'input[name="name"]' ).val(),
        email_value = $form.find( 'input[name="email"]' ).val(),
        message_value = $form.find( 'textarea[name="message"]' ).val(),
        url = $form.attr('action');
    /* Send the data using post */
    var posting = $.post( url, {
                      name: name_value,
                      email: email_value,
                      message: message_value
                  });
    posting.done(function( data )
    {
        /* Put the results in a div */
        $( ".contactResponse" ).html(data);
        if ($('.contactResponse:contains("Thank you")').length > 0) {
          /* Disable the button. */
          $submit.attr("disabled", true);
          /* Change the button text. */
          $submit.text('Message Sent');
         }
         else{
           /* Change the button text. */
           $submit.text('Message NOT Sent');
         }
    });

这是我发布到的PHP文件:

$to      = "mail@gdomain.com";
$subject = "Contact Form";
$message = "$message";
$headers = "From: $email'r'n";
$headers .= "Bcc: someone.else@domain.com'r'n";
$headers .= "Reply-To: $email'r'n";
$headers .= "Date: " . date("r") ."'r'n";
$headers .= "MIME-Version: 1.0'r'n";
$headers .= "Content-type: text/plain; charset=iso-8859-1'r'n";
if (strpos($ref,'example') !== false) {
    $spam = 1;
}
else{
    $spam = 0;
}
if(empty($name) || empty($email) || empty($message) || $spam === 0) {
  echo "<h2>Please fill all the fields.</h2>";
}
else{ $sent = mail($to,$subject,$message,$headers);
    if($sent){
    echo "<h2>Thank you for contacting us!</h2>";
}
  }
?>

这是我的Nginx服务器块:

server {
listen 443;
#server_name example.com;
root /var/www/example.com/public_html;
index index.html index.htm;
ssl on;
ssl_certificate /etc/nginx/ssl/certificate.crt;
ssl_certificate_key /etc/nginx/ssl/ssl.key;
ssl_session_timeout 5m;
ssl_protocols SSLv3 TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers "HIGH:!aNULL:!MD5 or HIGH:!aNULL:!MD5:!3DES";
ssl_prefer_server_ciphers on;
location / {
    error_page 404  /404.html;
    #To allow POST on static pages
    error_page 405  =200 $uri;
    add_header 'Access-Control-Allow-Origin' 'http://example.com';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' 'POST';
}
 # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    location ~ '.php$ {
           fastcgi_split_path_info ^(.+'.php)(/.+)$;
           # NOTE: You should have "cgi.fix_pathinfo = 0;" in php.ini
           fastcgi_pass unix:/var/run/php5-fpm.sock;
           fastcgi_index index.php;
           include fastcgi_params;
    }
}

此外,我在jQuery的库中遇到了一些问题,我在浏览器控制台中收到了"Uncaught ReferenceError:$未定义"错误。

$(function () {
    var filterList = {
        init: function () {
            // MixItUp plugin
            // https://mixitup.io
            $('#portfoliolist').mixitup({
                targetSelector: '.portfolio',
                filterSelector: '.filter',
                effects: ['fade'],
                easing: 'snap'
            });
        },
    };
    // Run the show!
    filterList.init();
});

这在Apache2+Varnish上运行时没有问题。

谢谢!

最终通过更新jQuery版本解决了问题。

我真的不知道为什么这会是一个问题,因为JS/jQuery不是一种服务器端语言,它没有任何意义,但它现在可以正常工作了。