You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

MERN栈作品集应用开发:端口占用及Gmail邮件发送问题求助

解决MERN栈应用端口占用及邮件发送问题

我正在开发基于MERN栈的作品集应用,采用OAuth2方式集成Gmail账户,同时创建了React.js表单用于发送邮件。但启动服务器时触发如下端口占用错误:

PS D:\Porfolio> node server.js
node:events:505
throw er; // Unhandled 'error' event
^

Error: listen EADDRINUSE: address already in use :::8080
at Server.setupListenHandle [as _listen2] (node:net:1372:16)
at listenInCluster (node:net:1420:12)
at Server.listen (node:net:1508:7)
at Function.listen (D:\Porfolio\node_modules\express\lib\application.js:635:24)
at Object. (D:\Porfolio\server.js:24:5)
at Module._compile (node:internal/modules/cjs/loader:1105:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/process/task_queues:83:21)
Emitted 'error' event on Server instance at:
at emitErrorNT (node:net:1399:8)
at processTicksAndRejections (node:internal/process/task_queues:83:21) {
code: 'EADDRINUSE',
errno: -4091,
syscall: 'listen',
address: '::',
port: 8080
}

相关代码文件

porfolioController.js

const nodemailer= require('nodemailer');


const transporter = nodemailer.createTransport({
    service: "gmail",
    auth: {
      type: "OAuth2",
      user: process.env.EMAIL,
      pass: process.env.WORD,
      clientId: process.env.OAUTH_CLIENTID,
      clientSecret: process.env.OAUTH_CLIENT_SECRET,
      refreshToken: process.env.OAUTH_REFRESH_TOKEN,
    },
});

const sendEmailController =(req,res)=>{
    try {
        const {name,email,msg}=req.body
        if(!name || !email || !msg){
            return res.status(500).send({
                success:false,
                message:'Please provide All Fields'
            })
        }
        
        transporter.sendMail({
            to:'abc@gmail.com',
            from:'abc@gmail.com',
            subject:'Regarding Portfolio',
            html:`
                <h5>Detail Information</h5>
                <ul>
                    <li><p>Name:${name}</p></li>
                    <li><p>Email:${email}</p></li>
                    <li><p>Message:${msg}</p></li>
                </ul>    
            `
        })
        return res.status(200).send({
            success:true,
            message:"Your Message Send Successfully",
        })
       
    } catch (error) {
        console.log(error);
        return res.status(500).send({
            success:false,
            message:'Send Email API Error',
            error
        });
    }
}
module.exports={sendEmailController};

Contact.js

import React ,{useState}from 'react'
import './Contact.css'
import {BsLinkedin,BsGithub} from 'react-icons/bs'
import Pulse from 'react-reveal/Pulse';
import {  toast } from 'react-toastify';
import axios from 'axios'


const Contact = () => {
  const [name, setname]=useState("");
  const [email, setemail]=useState("");
  const [msg, setmsg]=useState("");
  //handle submit button
  const handleSubmit=async (e)=>{
    e.preventDefault();
    try {
      if(!name || !email || !msg){
        toast.error('Please Provide all Fields');
      }
      const res=await axios.post('http://localhost:8080/api/v1/portfolio/sendEmail',{name,email,msg});
      if(res.data.success){
        toast.success(res.data.message)
        setname("");
        setemail("");
        setmsg("");
      }else{
        toast.error(res.data.message);
      }

    } catch (error) {
      console.log(error);
    }
  }
  return (
    <>
      <Pulse>
      <div className=' contact' id='contact'>
      <h2 className='col-12 mt-3 mb-1 text-center text-uppercase'>Contact me</h2><hr/>
        <div className='card card0 border-0'>
          <div className='row'>
            <div className='col-md-6 col-lg-6 col-xl-6 col-sm-12'>
              <div className='card1'>
                <div className='row border-line'>
                  <img src='https://img.freepik.com/free-photo/hot-line-contact-us-call-center-search-interface_53876-124009.jpg?w=2000' alt='ocontact' className='image'/>
                </div>
              </div>
            </div>
            <div className='col-md-6 col-lg-6'>
              <div className='card2 d-flex card border-0 px-4 py-4'>
                <div className='row'>
                  <div className='row'>
                    <h6 className='d-flex justify-content-center'>
                    
                      <a href='https://www.linkedin.com/in/'>
                        <BsLinkedin  color='blue'size={30} className='ms-2' />
                      </a>
                      &nbsp;&nbsp;&nbsp;
                      <a href='https://github.com/'>
                      <BsGithub  color='black'size={30} className='ms-2'/>
                      </a>
                    </h6>
                  </div>
                
                <div className='row px-3 mb-4'>
                  <div className='line'/>
                  <small className='or text-center'>OR</small>
                  <div className='line'/>
                </div>
                <div className='row px-3'>
                  <input type='text' name='name' placeholder='Enter Your Name' className='mb-3' value={name} onChange={(e)=>setname(e.target.value)}/>
                </div>
                <div className='row px-3'>
                  <input type='email' name='email' placeholder='Enter Your Email' className='mb-3' value={email} onChange={(e)=>setemail(e.target.value)}/>
                </div>
                <div className='row px-3'>
                  <textarea type='text' name='msg' placeholder='Enter Your Message' className='mb-3' value={msg} onChange={(e)=>setmsg(e.target.value)}/>
                </div>
                <div className='row px-3'>
                  <button className='btn btn-primary' onClick={handleSubmit}>SEND MESSAGE</button>
                </div>
              </div>
            </div>
            </div>
          </div>
        </div>
      </div>
      </Pulse>
    </>
  )
}

export default Contact

预期目标

表单提交后能成功向我发送邮件,请求帮助解决端口占用及邮件发送相关问题。

内容的提问来源于stack exchange,提问作者Mrunal Kashid

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.05 18:45:16