前言
以下内容都是我通过查看视频和百度资料收集的,你要问我具体为什么这么做,抱歉我只能说我也不知道。但我知道这么做一定能够成功。 那为什么要发这篇文章呢?因为我看了掘金好多博主无私分享的内容,心中想着也要分享一点什么。
服务器
这里我选择的是腾讯云,安装的时候选择CentOS 7.6不要选择CentOS 8.0,CentOS 8.0安装会失败。至于我为什么会知道CentOS 8.0安装会失败,原因是当时年轻在自己的博客中记录了所有的从安装到部署的步骤,里面我连服务器ip地址、登录密码都没有改,被一个坏种将我数据库表中所有内容都修改为了颜色网站地址,后面我重装了系统选择的就是CentOS 8.0。
域名
拥有自己的服务器后前往域名注册这边腾讯云官网会有一系列引导,按照引导完成注册并备案就可以了
Java安装
下载jdk8(注意这里需要安装linux版本的jdk)这里我用的是jdk-8u301-linux-x64.tar这个版本。
通过Xftp在服务器对应目录下新建文件夹package并将jdk放到文件夹下
通过Xshell执行以下命令
前往Xftp建立的文件下:
cd /home/package/
解压Java安装包:
tar -zxvf jdk-8u301-linux-x64.tar.gz
修改Java安装包名称:
mv jdk1.8.0_301 jdk1.8
将Java安装包移动到/usr/local/:
mv jdk1.8 /usr/local/
前往/usr/local/:
cd /usr/local/
编辑配置文件:
vim /etc/profile
Java环境变量配置
按i可以进行内容输入,移动到文件最后新开一行添加以下内容(添加完成后按esc并输入
:wq保存退出)
export JAVA_HOME=/usr/local/jdk1.8
export CLASSPATH=$JAVA_HOME/lib/tools.jar:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib
export PATH=$JAVA_HOME/bin:$PATH
刷新Java环境变量配置:
source /etc/profile
安装docket
设置仓库
sudo yum install -y yum-utils \
device-mapper-persistent-data \
lvm2
设置阿里云仓库
sudo yum-config-manager \
--add-repo \
http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo
安装最新版本docker
sudo yum install docker-ce docker-ce-cli containerd.io
启动docker
systemctl start docker
判断docker是否安装成功
docker version
Docker 需要用户具有sudo权限,为了避免每次都输入sudo可以把用户加入docker用户组
sudo usermod -aG docker $USER
设置docker开机自启
systemctl enable docker
阿里云镜像加速
sudo mkdir -p /etc/docker
sudo tee /etc/docker/daemon.json <<-'EOF'
{
"registry-mirrors": ["https://3n4m4jry.mirror.aliyuncs.com"]
}
EOF
sudo systemctl daemon-reload
sudo systemctl restart docker
docket下安装MySQL
拉取mysql
docker pull mysql:5.7
安装mysql镜像
docker run -p 3306:3306 --name mysql \
-v /mydata/mysql/log:/var/log/mysql \
-v /mydata/mysql/data:/var/lib/mysql \
-v /mydata/mysql/conf:/etc/mysql \
-e MYSQL_ROOT_PASSWORD=设置你的mysql密码 \
-d mysql:5.7
安装nginx
安装依赖和相关库:
yum -y install gcc-c++ zlib-devel openssl-devel libtool
移动至/usr/local目录:
cd /usr/local
下载nginx安装包:
wget http://nginx.org/download/nginx-1.14.0.tar.gz
解压nginx安装包:
tar -zxvf nginx-1.14.0.tar.gz
移动至nginx-1.14.0目录:
cd nginx-1.14.0
添加配置:
./configure --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module
安装:
make && make install
移动至/usr/local/nginx/conf目录:
cd /usr/local/nginx/conf
前往腾讯云申请免费ssl证书申请完成后,下载ssl证书选择Nginx(适用大部分场景),然后通过Xshell打开Xftp默认会在/usr/local/nginx/conf 目录下将下载的证书:
fantongxue.top_bundle.crt、fantongxue.top.key放到该目录下
修改nginx配置:
vim nginx.conf添加一个443 server 和 修改 80 server (修改完成后按esc并输入:wq保存退出)
server {
listen 443 ssl;
server_name fantongxue.top;
ssl_certificate fantongxue.top_bundle.crt;
ssl_certificate_key fantongxue.top.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1.2 TLSv1.3;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
ssl_prefer_server_ciphers on;
location / {
root /home/hexo/dist;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
location /admin {
alias /home/admin/dist;
index index.html;
try_files $uri $uri/ /admin/index.html; #解决页面刷新404问题
}
location /api {
proxy_pass http://你的服务器ip:8080/;
}
}
server {
listen 80;
server_name fantongxue.top;
return 301 https://$host$request_uri;
location / {
root html;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
移动至目录:
cd /usr/local/nginx/sbin
启动nginx:
./nginx
跨域配置
Java配置
import com.learn.interceptor.JwtInterceptor;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class MyWebMvcConfig implements WebMvcConfigurer {
/**
* 添加拦截器
*/
@Override
public void addInterceptors(InterceptorRegistry registry) {
//拦截路径可自行配置多个 可用 ,分隔开
registry.addInterceptor(new JwtInterceptor())
.addPathPatterns("/**");
}
/**
* 跨域支持
*/
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins(
"https://www.fantongxue.top:8080",
"https://www.fantongxue.top:80",
"https://www.fantongxue.top",
"https://fantongxue.top:8080",
"https://fantongxue.top:80",
"https://fantongxue.top",
"http://www.fantongxue.top:8080",
"http://www.fantongxue.top:80",
"http://www.fantongxue.top",
"http://fantongxue.top:8080",
"http://fantongxue.top:80",
"http://fantongxue.top",
"http://你的服务器ip地址:8080",
"http://你的服务器ip地址:80",
"http://你的服务器ip地址",
"http://localhost:8080", // 本地测试api端口
"http://localhost:9527", // 本地测试前端项目端口
"http://localhost:9528", // 本地测试前端项目端口
"http://localhost:9529" // 本地测试前端项目端口
)
.allowCredentials(true)
.allowedMethods("GET", "POST", "DELETE", "PUT", "PATCH", "OPTIONS", "HEAD")
.maxAge(3600 * 24);
}
}
前端vue项目中需要在axios开启 withCredentials: true
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
withCredentials: true, // send cookies when cross-domain requests
timeout: 5000 // request timeout
})