一个关于React与Node.js前后端分离项目部署问题

这是一个前后端分离的项目:前端是React,后端是Node.js

本地测试没有任何问题,上传到云服务器之后,测试后端没有任何问题。但是React却无法把数据发给后端

网上查询用Nginx部署前端,我的nginx核心配置文件如下

复制代码
    server {
        
        listen 80;
        server_name www.xiaoyangst.top;
        root /home/xyst/XrtcDemo/myapp/build;
        index index.html;
        location / {
            try_files $uri %uri/ /index.html;
        }
        
        location /api{
            proxy_pass http://www.xiaoyangst.top:8888;
        }
    
    }    

外网访问http://www.xiaoyangst.top能够看到前端,说明nginx配置没有问题,但是代理配置应该存在问题,即跨域问题

本地测试环境跨域问题没有,因为可以添加文件setupProxy.js

复制代码
const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
    app.use(
        '/api',
        createProxyMiddleware({
            target: 'http://www.xiaoyangst.top:8888',
            changeOrigin: true,
            pathRewrite: {'^/api': ''}
        })
    );
};

本地前端能够正常与云服务器后端通信,但是云服务器上部署的前端却不行,希望各位能给个解决方案

技术前沿拓展

前端开发,你的认知不能仅局限于技术内,需要发散思维了解技术圈的前沿知识。细心的人会发现,开发内部工具的过程中,大量的页面、场景、组件等在不断重复,这种重复造轮子的工作,浪费工程师的大量时间。

介绍一款程序员都应该知道的软件JNPF快速开发平台,很多人都尝试用过它,它是功能的集大成者,任何信息化系统都可以基于它开发出来。

这是一个基于 Java Boot/.Net Core 构建的简单、跨平台快速开发框架。前后端封装了上千个常用类,方便扩展;集成了代码生成器,支持前后端业务代码生成,实现快速开发,提升工作效率;框架集成了表单、报表、图表、大屏等各种常用的 Demo 方便直接使用;后端框架支持 Vue2、Vue3。如果你有闲暇时间,可以做个知识拓展。

看完本文如果觉得有用,记得点个赞支持,收藏起来说不定哪天就用上啦~

相关推荐
千寻girling3 小时前
计算机组成原理-全通关源码-实验(通关版)---头歌平台
前端·面试·职场和发展·typescript·node.js
damo王11 小时前
how to install npm in ubuntu24.04?
前端·npm·node.js
weixin_5316518111 小时前
Node.js 流操作
node.js·node·stream
Lupino13 小时前
Node.js 与 Haskell 混合网络编程踩坑记:TCP 粘包与状态不一致引发的“死锁”
javascript·node.js
神秘的猪头14 小时前
LangChain Tool 实战:让大模型“长出双手”,通过 Tool 调用连接真实世界
langchain·node.js·aigc
流之云低代码平台14 小时前
低代码开发,企业数字化转型的加速器
低代码·gadmin·低代码开发优势·低代码开发平台选择·低代码开发未来趋势·低代码开发应用场景·企业应用搭建
摩尔元数14 小时前
装备制造困局突围:数字化如何重塑高效柔性生产
低代码·制造·mes
小北方城市网15 小时前
第 10 课:Node.js 后端企业级进阶 —— 任务管理系统后端优化与功能增强(续)
大数据·前端·vue.js·ai·性能优化·node.js
Cshaosun16 小时前
阿里云宝塔面板部署vue+nodejs项目并实现https访问操作流程
vue.js·阿里云·https·node.js·宝塔·文件下载
Mr_Wu201816 小时前
Corepack 实现 pnpm 版本自动管理
node.js