发送消息时出现内部服务器错误(500)

时间:2020-08-12 02:25:56

标签: reactjs nodemailer flux

我是ReactJS和Flux的新手,我正在某个项目上使我的办公室网站上的发送消息功能正常,在我添加一些验证之前,所有代码均正常工作。添加一些验证后,它将发送一个内部服务器错误,当某些字段为空时,该消息将不会发送到我的电子邮件中,但是当所有字段都不为空时,该消息将发送到我的电子邮件中。

这是我的views.jsx

...
export default class Message extends React.Component {
  constructor(props){
    super(props);
      this.state = {
        isLoggedIn: SystemStore.isLoggedIn(),
        profile: ProfileStore.getProfile(),
        fullName: SystemStore.systemUser().fullName,
        site: '',
        email: '',
        phone: '',
        home: '',
        subject: '',
        description: '',
        type: '',
        submitting: false
    };

    this.clearForm = this.clearForm.bind(this);
    this.handleProfileChange = this.handleProfileChange.bind(this);
    this.handleSubjectChange = this.handleSubjectChange.bind(this);
    this.handleMessageChange = this.handleMessageChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleSubmitComplete = this.handleSubmitComplete.bind(this);
    this.handleSubmitError = this.handleSubmitError.bind(this);
  }

  componentDidMount(){
    ProfileStore.addProfileChangeListener(this.handleProfileChange);
      if(!this.state.profile){
        ProfileActions.reload()
      }
    MessageStore.addSubmitMessageChangeListener(this.handleSubmitComplete);
    MessageStore.addSubmitMessageFailChangeListener(this.handleSubmitError);//unresolved
  }    

  componentWillUnmount(){
    ProfileStore.removeProfileChangeListener(this.handleProfileChange);
    MessageStore.removeSubmitMessageChangeListener(this.handleSubmitComplete);
    MessageStore.removeSubmitMessageFailChangeListener(this.handleSubmitError);
  }

  render(){
    return(
      <Layout>
        <div className='hs-dashboard row'>
          <div className='col-md-12'>
            <div className='col-xs-12 col-sm-6 col-md-5'>
              <div className='col-xs-12 hs-message-form'>
                <div className='row hs-message-form-head'>
                  <div className='hs-message-form-logo-container'>
                    <img className='col hs-message-form-logo' src='../../images/gii-logo-white.png'/>
                      <text className='hs-message-form-logo-label'>{T.translate('gii')}</text>
                  </div>
                  <div className='hs-message-form-label'>
                    { T.translate('message.title') }
                  </div>
                  <div className='hs-message-form-label-1'>
                    { T.translate('message.subtitle') }
                  </div>
                </div>
                <div className='row hs-message-form-body'>
                  <form className='hs-message-form-body-content'>
                    <label>
                      { T.translate('message.type') }
                    </label>
                    <select
                      id="subject"
                      value={ this.state.subject }
                      onChange={ this.handleSubjectChange }
                      className="form-control"
                      required="true"
                    >
                      <option value="">{ T.translate('placeholder.selectSubject') }</option>
                      <option value="PRAYER">{ T.translate('message.pray') }</option>
                      <option value="ADDRESS">{ T.translate('message.address') }</option>
                      <option value="VISIT">{ T.translate('message.visit') }</option>
                    </select>
                    <label>
                      {T.translate('message.message')}
                    </label>
                    <textarea
                      type="text"
                      id="description"
                      className="form-control"
                      width=''
                      placeholder={ T.translate('placeholder.message') }
                      onChange={ this.handleMessageChange }
                      value={ this.state.description }
                      required
                    />
                    <LaddaButton
                      loading={ this.state.submitting }
                      onClick={ this.handleSubmit }
                      data-spinner-size={ 30 }
                      data-style={ SLIDE_RIGHT }
                    >
                      { T.translate('action.send') }
                    </LaddaButton> 
                  </form>
                </div>
              </div>
            </div>
          </div>
        </div>
      </Layout>
    )
  }

  clearForm(){
    this.setState({ subject: '', description: '' });
    alert(T.translate('msg.mailSent'));
  }

  handleProfileChange(){
    this.setState({
      site: ProfileStore.getProfile().primarySite.name,
      email: ProfileStore.getProfile().emailAddresses[0].email,
      phone: ProfileStore.getProfile().contactNumbers[0].countryCode + ProfileStore.getProfile().contactNumbers[0].number,
      home: ProfileStore.getProfile().contactNumbers[1].countryCode + ProfileStore.getProfile().contactNumbers[1].number,
    });
    if(this.state.home === ''){
      this.setState({
        home: '-'
      });
    }
  }
    
  handleSubjectChange(evt){
    this.setState({ subject: evt.target.value }, () => {
      if(this.state.subject === 'PRAYER') {
        this.setState({ type: 'REQUEST' });
      } else if(this.state.subject === 'ADDRESS') {
        this.setState({ type: 'INFORMATION' });
      } else if(this.state.subject === 'VISIT'){
        this.setState({ type: 'REQUEST' });
      }
    });
  }
    
  handleMessageChange(evt){
    this.setState({ description: evt.target.value });
  }

  handleSubmit(evt) {
    evt.preventDefault();
        
    if(this.state.subject === ''){
      alert('Error:' + T.translate('msg.subjectRequired'));
    } else if(this.state.description === ''){
      alert('Error:' + T.translate('msg.mailDescriptionRequired'));
    } else {
      alert(T.translate('msg.mailSending'));
    }

    this.handleProfileChange();
    this.handleSubjectChange(evt);
    this.handleMessageChange(evt);
    var messageInfo = {
      fullName: this.state.fullName,
      site: this.state.site,
      email: this.state.email,
      phone: this.state.phone,
      home: this.state.home,
      subject: this.state.subject,
      description: this.state.description,
      type: this.state.type
    };
        
    console.log(messageInfo);

    this.setState({ submitting: true }, () => {
      MessageActions.sendMessage(messageInfo, (err) => {
        if(err){
          this.handleSubmitError();
        }
      });
    });
  }

  handleSubmitComplete(){
    this.setState({
      submitting: false
    });
    this.clearForm();
  }

  handleSubmitError(){
    this.setState({
      submitting: false
    });
  }
}

这是我针对助焊剂结构的action.js

...
function _sendMessage(messageInfo, callback) {
  jQuery.ajax({
    method: 'POST',
    url: '/api/v1/supportTickets',
    contentType: 'application/json',
    data: JSON.stringify({
      messageInfo: messageInfo
    })
  })
  .done(function(messageInfo) {
    callback(null, messageInfo);
  })
  .fail(function(err){
    console.error('Failed to send message' + JSON.stringify(err));
    callback(err);
  });
}

var MessageActions = {
  sendMessage: function(messageInfo, callback) {
    _sendMessage(messageInfo, function(err, messageInfo) {
      if(err) { return callback(err); }
      Dispatcher.dispatch({
        actionType: MessageConstants.PERFORM_SEND_MESSAGE,
        messageInfo
      });
      callback(null, messageInfo)
    });
  }
};

module.exports = MessageActions;

这是我的store.js

...
const SUBMIT_MESSAGE = 'SUBMIT_MESSAGE';
const SUBMIT_MESSAGE_FAILED = 'SUBMIT_MESSAGE_FAILED';

var MessageStore = assign({}, EventEmitter.prototype, {
   
  emitSubmitMessageChange: function(){
    this.emit(SUBMIT_MESSAGE);
  },

  addSubmitMessageChangeListener: function(callback){
    this.on(SUBMIT_MESSAGE,callback);
  },

  removeSubmitMessageChangeListener: function(callback){
    this.removeListener(SUBMIT_MESSAGE,callback);
  },

  emitSubmitMessageFailChange: function(){
    this.emit(SUBMIT_MESSAGE_FAILED);
  },

  addSubmitMessageFailChangeListener: function(callback){
    this.on(SUBMIT_MESSAGE_FAILED, callback);
  },

  removeSubmitMessageFailChangeListener: function(callback){
        this.removeListener(SUBMIT_MESSAGE_FAILED, callback);
  }
});

Dispatcher.register(function(action) {
  switch(action.actionType){
    case MessageConstants.PERFORM_SEND_MESSAGE:
      MessageStore.emitSubmitMessageChange();
      break;

    case MessageConstants.PERFORM_SEND_MESSAGE_FAIL:
      MessageStore.emitSubmitMessageFailChange();
      break;
    default:
      //noop
    }

})
export default MessageStore;

这是我通过gmail发送消息的后端

const _ = require('lodash');
const express = require('express');
const router = express.Router();

const mail = require('nodemailer');
const routing = requirerp('/lib/routing');
const api = routing.api;
const config = require('config');
const service = config.get('hits.supportTickets.service');
const host = config.get('hits.supportTickets.host');
const user = config.get('hits.supportTickets.auth.user');
const pass = config.get('hits.supportTickets.auth.pass');

const Err = requirerp('/utils/restErrors');
const validator = requirerp('/utils/restValidation');

const transporter = mail.createTransport({ //almost resolved => should move the code to another file, or just like this?
  service: 'Gmail,
  host: 'smtp.gmail.com,
  auth: {
    user: 'no.replyxxxxx@xxxx.com',
    pass: 'xxxxx'
  }
});

router.post('/', routing.requireAuth, (req, res, next) => {
  var fullName = req.body.fullName;
  var site = req.body.site;
  var email = req.body.email;
  var phone = req.body.phone;
  var home = req.body.home;
  var subject = req.body.subject;
  var message = req.body.description;
  var type = req.body.type;
  var content = 'Nama : ' + fullName + '\nLokasi : ' + site + '\nContact : ' + phone + '/' + home + '\nPesan : ' + message;

  validator.validateBody(req, { //using validator get error code 500 -> Internal Server Error
    'fullName': {
      notEmpty: true
    },
    'site': {
      notEmpty: true
    },
    'email': {
      motEmpty: true
    },
    'phone': {
      notEmpty: true
    },
    'home': {
      notEmpty: true
    },
    'subject': {
      notEmpty: true,
      in: {
        option: ['PRAYER', 'ADDRESS', 'VISIT']
      }
    },
    'descrption': {
      notEmpty: true
    },
    'type': {
      notEmpty: true
    }
  }, function(err) {
    if(Err.invalidInput(next,err)) { return; }

    const mailOptions = {
      from: fullName + '<' + email + '>',
      to: 'xxxx@xxxx.org',
      replyTo: email,
      subject: type + ':' + subject,
      text: content
    };
        
    transporter.sendMail(mailOptions, (err) => {
      if(Err.unexpected(next, err)) {
        return;
      }
      res.status(201)
      .header('Location', api('supportTickets/'))
      .json(req.body.messageInfo)
      .end();
    });
  })
});
    
module.exports = router;

有人可以给我一个建议,指出我的代码出了什么问题吗?非常感谢

0 个答案:

没有答案