2

我正在使用 Cockpit 和 React JS 开发一个网站。

在这个项目中,有一个非常简单的联系表格(姓名、电子邮件、消息)。

我通过 Forms 模块在 Cockpit 中创建了一个表单,并在 Cockpit (config/config.yaml) 中添加了一个配置文件:

mailer:
  from: no-reply@***.com
  transport: smtp
  host: smtp.ionos.fr
  user: bonjour@***.com
  password: ***
  port: 587
  auth: true
  encryption:

表单模块被配置为在 Cockpit 中记录数据,但也会在添加新记录后立即向我发送电子邮件(用简单的语言,只要用户单击表单上的提交按钮)。这就是我必须使用这些信息创建 config/config.yaml 文件的原因。

一切都很完美。数据很好地记录在 Cockpit 中,我收到了电子邮件。

但我有一个问题。

我想更改电子邮件的主题。目前,当我收到一封电子邮件时,主题是:“新表单数据:联系人”。

在 modules/Forms/bootstrap.php 文件的第 325 行...我发现了这个:

$response = $this->app->mailer->mail($frm['email_forward'], $options['subject'] ?? "New form data for: {$formname}", $body, $options);

因此,在此文件中管理电子邮件的主题。因此,理论上,可以传递一个选项来修改电子邮件的主题。

问题是,我不知道应该如何发送这些信息。

我尝试将信息添加到 config/config.yaml 文件中,但它不起作用。像这样 :

mailer:
  from: no-reply@***.com
  subject: test /* <= I added this information */
  transport: smtp
  host: smtp.ionos.fr
  user: bonjour@***.com
  password: ***
  port: 587
  auth: true
  encryption:

在此页面上,表明有必要创建一个名为“__mailsubject”的隐藏字段,并将所需主题作为值。问题是我使用的是 React JS(+ axios)而不是 PHP(无法访问:$_REQUEST,$_POST,...)。

这是我的 React 组件的代码

import React, { Component } from "react";
import axios from "axios";

class Form extends Component {
    
    constructor(props) {
        super(props);

        this.onChangeName = this.onChange.bind(this);
        this.onChangeEmail = this.onChange.bind(this);
        this.onChangeMessage = this.onChange.bind(this);
        this.onSubmitForm = this.onSubmitForm.bind(this);

        this.state = {
            name: '',
            email: '',
            message: ''
        }
    }
    
    onChange(e) {
        this.setState({ [e.target.name]: e.target.value })
    }

    onSubmitForm(e) {
        e.preventDefault()

        const dataForm = {
            "form": {
                name: this.state.name,
                email: this.state.email,
                message: this.state.message
            }
        };
        
        axios
            .post('http://dev.site.com/api/forms/submit/contact?token=XXX', dataForm)
            .then((res) => {console.log(res.data)} )
            .catch((error) => {console.log(error)} );

        this.setState({
            name: '', 
            email: '', 
            message: ''
        })
    }
    
    render() {
        return (
            <>
                <div className="form">
                    <div className="title">{this.props.title}</div> 
                    <div className="content">
                        <form onSubmit={this.onSubmitForm}>                         
                            <label htmlFor="name">Your name :</label>
                            <input name="name" value={this.state.name} onChange={this.onChangeName} type="text" />
                            
                            <label htmlFor="email">Your email :</label>
                            <input name="email" value={this.state.email} onChange={this.onChangeEmail} type="text" />
                            
                            <label htmlFor="message">Your message :</label>
                            <textarea name="message" value={this.state.message} onChange={this.onChangeMessage}></textarea>
                            
                            <input type="submit" value="Submit" />
                        </form>
                    </div>
                </div>
            </>
        );
    }
}

export default Form;

我试过这个。但它不起作用:

        const dataForm = {
            "form": {
                __mailsubject: "test",
                name: this.state.name,
                email: this.state.email,
                message: this.state.message
            }
        };

PS:稍后我将使用 Formik 和 Yup 来创建和验证表单。

除了直接更改 modules/Forms/bootstrap.php 文件之外,我看不到如何实现我想要的!但这不是一个好的解决方案,因为它会在更新期间给我带来问题!

唯一的解决方案是使用表单模板,比如这里

一个主意 ?

4

1 回答 1

0

为了更新邮件主题,您需要将值作为参数而不是表单数据传递。

根据您的要求,您应该有类似的东西:

axios
  .post('http://dev.site.com/api/forms/submit/contact?token=XXX&__mailsubject=My email subject', dataForm)
  .then((res) => {console.log(res.data)})
  .catch((error) => {console.log(error)})

可以在以下位置查看此代码modules/Forms/Controller/RestApi.php

if ($this->param('__mailsubject')) {
   $options['subject'] = $this->param('__mailsubject');
}

这意味着它只会检查__mailsubject作为参数值而不是作为表单数据值。

于 2021-07-12T19:14:39.940 回答