我可以在 React JS 的联系表单中使用 action='POST' 到 PHP 吗？

Question

我试图从 React JS 呈现的表单发布表单数据，使用表单的操作部分调用 aq php 文件...我已将表单和附加的 PHP 文件上传到我的网站，但是当表单是填完提交，没有发邮件，url变回首页，php文件的名字打上标签（index.js/contact.php）。

我下面的代码不好吗？

或者这只是不可能使用 React JS 和 PHP 的组合来实现吗？

contactMe.js

import React, { Component } from 'react';

class ContactMe extends Component {
    render() {
        return (
            <div className='contact-body'>
                    <div className='contact-right'>
                        <div className='contact-side'>
                            <h2 style={{ fontSize: '25px', fontFamily: 'Anton', paddingTop: '10px'}}>
                                Contact Me
                        </h2>
                            <hr />
                            <div className='contact-list'>
                                <div className='form'>
                                    <form action="contact.php" method='post'>
                                        <input type="text" name="name" placeholder="Your name..." />
                                        <input type="email" name="email" placeholder="Your email..." />
                                        <textarea name="message" placeholder="Message me..."></textarea>
                                        <input type="submit" value="Submit" />
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
            </div>
        )
    }
}

export default ContactMe;

contact.php

<?php
if (isset($_POST['submit'])) {

  $userName = $_POST['name'];
  $userEmail = $_POST['email'];
  $userMessage = $_POST['message'];

  $emailSubject = 'New Message From My Website Visitor';
  $emailBody = 'Visitor Name: ' . $userName . '\n\n' .
    'Visitor Email: ' . $userEmail . '\n\n' .
    'Message: ' . $userMessage . '\n\n';

  $emailTo = 'james_ross@outlook.fr';

  $headers = 'From: ' . $emailFrom . '\n\n';

  mail($emailTo, $emailSubject, $emailBody, $headers);

  header('Location: index.js/mailsent');
}

如果我需要使用另一种技术/语言来代替 PHP，请告诉我一个不错的源来阅读它，谢谢，

Answer 1

action="contact.php" 是一个相对链接，看起来您的前端运行为xxx/index.js/，您必须将其设置为绝对网址，例如action="/contact.php" 或action="xxx/contact.php"，其中xxx 是您的php 脚本所在的文件夹。

如果您使用 react 进行开发而不是不想在服务器端和客户端页面之间切换，只需使用 ajax 发送表单并在您的 react 应用程序中显示输出。

您的 PHP 代码存在安全问题： $emailFrom 未定义，如果您有一些带有 register_globals 的旧 PHP 配置，则可以插入自己的标题内容和 f.e.向任何电子邮件地址发送垃圾邮件。