前后端项目部署和解决跨域

news/2024/9/23 22:26:06/

文章目录

  • 一.前端项目部署
    • 1.1 上传前端文件
    • 1.2 项目部署
    • 1.3 解决跨域
      • 1.3.1 什么是跨域
      • 1.3.2 配置文件
  • 二.后端项目部署
    • 2.1 上传后端文件
    • 2.2 项目部署
    • 2.3 解决跨域

一.前端项目部署

1.1 上传前端文件

站点创建好了,进入到站点的目录。

然后把它默认的文件删掉。

你会发现有个PHP项目删不掉,不用管它,那是它自己强制的一个设置。

然后直接把前端打包好的dist文件夹内的文件拖进去。

会弹出提示框,点击开始上传,全部上传成功就可以点击×,×掉它。

1.2 项目部署

添加站点,部署新项目。

  1. 域名。域名中删除之前的服务器公网IP地址,域名如果没有泛解析,输入域名www.###.com,如果进行了泛解析,输入泛解析域名。

泛解析

  1. 根目录。跟换为前端文件的根目录。

1.3 解决跨域

1.3.1 什么是跨域

什么是跨域?浏览器为了用户的安全,仅允许向同域名、同端口的服务器发送请求。

前端的域名和后端域名不一样,域名不一样就出现了跨域,跨域的话就报错了。

我们可以看一下网络请求。

为了防止跨域,或者说为了检测跨域,浏览器它会在发送正式请求之前,发送一个预检请求,预检的请求方法是OPTIONS。
预检请求经常用来检查是否跨域,或者换一句话说,当我们请求的域名是和当前网页域名不同的时候,它就会发送预检请求。

预检请求的作用:就是提前探路,比如说你要坐飞机,预检请求提前查一下你这个飞机航班有没有晚点,是不是正常运行的,如果不是正常运行的,那也不用发下一个请求了,或者说下一个请求直接拒绝掉。

1.3.2 配置文件

  1. 在nginx配置跨域,点击设置。
  2. 把之前配置的反向代理删除。
  3. 在nginx配置文件的http->server->location中添加以下代码
location / {
try_files $uri $uri/ /index.html;
}

前端的nginx中加入上面那个location配置。

二.后端项目部署

2.1 上传后端文件

在wwwroot目录下新建一个后端文件夹。

进入到这个目录中,把之前后端打包好的jar包,上传上去。

2.2 项目部署

添加JAVA项目,部署新项目。

  1. 项目jar路径。更改为jar的文件路径。
  2. 项目执行命令。
  3. 然后先把tomcat停掉,不然用不了8080端口(装tomcat只是为了装java)。
  4. 对上面的设置根据需要进行更改。
  5. 去防火墙把8080端口放行。

只有项目执行命令正确,java项目才会运行。

2.3 解决跨域

  1. 在nginx配置跨域,点击设置。
  2. 把之前配置的反向代理删除。
  3. 配置文件。


location ^~ /api/ {proxy_pass http://127.0.0.1:8080/api/;add_header 'Access-Control-Allow-Origin' $http_origin;add_header 'Access-Control-Allow-Credentials' 'true';add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';add_header Access-Control-Allow-Headers '*';if ($request_method = 'OPTIONS') {add_header 'Access-Control-Allow-Credentials' 'true';add_header 'Access-Control-Allow-Origin' $http_origin;add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';add_header 'Access-Control-Max-Age' 1728000;add_header 'Content-Type' 'text/plain; charset=utf-8';add_header 'Content-Length' 0;return 204;}
}

http://www.ppmy.cn/news/1463756.html

相关文章

大数据开发面试题【Spark篇】

115、Spark的任务执行流程 driver和executor,结构式一主多从模式, driver:spark的驱动节点,用于执行spark任务中的main方法,负责实际代码的执行工作;主要负责:将代码逻辑转换为任务、在executo…

OSPF原理(1)

一、OSPF介绍 OSPF(Open Shortest Path First,开放最短路径优先)协议作为一种基于链路状态的路由协议,它为网络中的路由器提供了一种高效、可靠的方式来共享路由信息,并计算出最短路径。 特点: 收敛速度快…

推荐系统学习笔记(四)--基于向量的召回

离散特征处理 离散特征:性别,国籍,英文单词,物品id,用户id 处理: 建立字典:eg:china 1 向量化:eg:one-hot /embedding(低维稠密向量&#xf…

【数据结构】数据结构中的隐藏玩法——栈与队列

前言: 哈喽大家好,我是野生的编程萌新,首先感谢大家的观看。数据结构的学习者大多有这样的想法:数据结构很重要,一定要学好,但数据结构比较抽象,有些算法理解起来很困难,学的很累。我…

在某云服务器上搭建公网kali linux2.0

前提: 可用的 CVM 实例 挂载一个系统盘之外的盘,安装完成后可卸载! 创建实例,安装centos7系统! 然后执行fdisk -l看磁盘的情况 在这里我将把镜像写入vdb这块数据盘 非 root 的情况下记得sudo执行以下命令 注意&…

质量评估门户:您AI内容的质量守护者

在当今这个内容饥渴和内容疯狂的世界里,AI驱动的内容创作既是一种流行趋势,有时也是一个改变游戏规则的存在。但强大的能力伴随着巨大的责任……即确保质量的责任。 想象一下:你拥有一个AI[和创意团队],他们以闪电般的速度输出博…

离线初始化k8s

导出和导入所有必要的 Kubernetes 镜像,使用阿里云作为源。 在能访问外网的机器上拉取镜像 首先,在有外网访问的机器上运行以下命令来拉取所有 Kubernetes v1.29.5 版本需要的镜像: kubeadm config images pull --image-repository regist…

Lambada表示式

Lambada Lambda表达式是Java中的一个重要特性,用于简化函数式编程。它提供了一种更简洁的方式来编写匿名函数,可以被赋值给一个变量,或者作为参数传递给其他方法。 Lambda表达式的基本语法如下: (parameter1, parameter2, .…