nginx解决springcloud前后端跨域问题,同时配置ssl

简介: nginx解决springcloud前后端跨域问题,同时配置ssl

为了好管理我们在Nginx的配置文件nginx.conf最后面添加一条语句,Nginx目录根据实际情况自行修改

include /usr/local/nginx/conf/conf.d/*.conf;

这里的意思是引入conf.d目录下面的所有后缀为.conf的配置,这里应该也可以使用相对路径,Windows系统是可以的,Linux我没有测试,大家可以试一下。

然后在conf目录下面创建conf.d目录,并且在conf.d目录下面创建一个ssl.conf文件,内容如下

#配置443端口
server {
  # ssl配置
  listen 443 ssl;
  # 域名
  server_name www.xxx.com;
  #public key路径
  ssl_certificate /usr/local/ssl/xxx.com.pem;
  #private key路径
  ssl_certificate_key /usr/local/ssl/xxx.com.key;
  ssl_session_timeout 10m;
  ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
  ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
  ssl_prefer_server_ciphers on;
  location / {
    #配置前端项目路径
    root /home/www/admin/;
    try_files $uri $uri/ @router;
    index  index.html index.htm;
  }
  location @router {
    rewrite ^.*$ /index.html last;
  }
  location /api/ {
    # 后端的真实接口
    proxy_pass http://localhost:8080/;
    proxy_redirect off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Scheme  $scheme;
    proxy_set_header   Cookie $http_cookie;
    # for Ajax
    #fastcgi_param HTTP_X_REQUESTED_WITH $http_x_requested_with;
    proxy_set_header HTTP-X-REQUESTED-WITH $http_x_requested_with;
    proxy_set_header HTTP_X_REQUESTED_WITH $http_x_requested_with;
    proxy_set_header x-requested-with $http_x_requested_with;
    client_max_body_size 100m;
    client_body_buffer_size 128k;
    proxy_connect_timeout 90;
    proxy_send_timeout 90;
    proxy_read_timeout 90;
    proxy_buffer_size 128k;
    proxy_buffers 32 32k;
    proxy_busy_buffers_size 128k;
    proxy_temp_file_write_size 128k;
  }
}
#当访问80端口时,转发至443
server {
  listen 80;
  server_name www.xxx.com;
  rewrite ^(.*) https://$server_name$1 permanent;
}

浏览器访问前端

https://www.xxx.com

前端访问后台接口的写法

https://www.xxx.com/api/接口名

这样同一个域名下就不会产生跨域了,同时也把https的域名配置好了

相关文章
|
21天前
|
应用服务中间件 BI nginx
Nginx的location配置详解
【10月更文挑战第16天】Nginx的location配置详解
|
1天前
|
存储 负载均衡 中间件
Nginx反向代理配置详解,图文全面总结,建议收藏
Nginx 是大型架构必备中间件,也是大厂喜欢考察的内容,必知必会。本篇全面详解 Nginx 反向代理及配置,建议收藏。
Nginx反向代理配置详解,图文全面总结,建议收藏
|
14天前
|
应用服务中间件 API nginx
nginx配置反向代理404问题
【10月更文挑战第18天】本文介绍了使用Nginx进行反向代理的配置方法,解决了404错误、跨域问题和302重定向问题。关键配置包括代理路径、请求头设置、跨域头添加以及端口转发设置。通过调整`proxy_set_header`和添加必要的HTTP头,实现了稳定的服务代理和跨域访问。
nginx配置反向代理404问题
|
7天前
|
安全 应用服务中间件 网络安全
49.3k star,本地 SSL 证书生成神器,轻松解决 HTTPS 配置痛点
mkcert是一款由Filippo Valsorda开发的免费开源工具,专为生成受信任的本地SSL/TLS证书而设计。它通过简单的命令自动生成并安装本地信任的证书,使本地环境中的HTTPS配置变得轻松无比。mkcert支持多个操作系统,已获得49.2K的GitHub Star,成为开发者首选的本地SSL工具。
|
8天前
|
应用服务中间件 网络安全 PHP
八个免费开源 Nginx 管理系统,轻松管理 Nginx 站点配置
Nginx 是一个高效的 HTTP 服务器和反向代理,擅长处理静态资源、负载均衡和网关代理等任务。其配置主要通过 `nginx.conf` 文件完成,但复杂设置可能导致错误。本文介绍了几个开源的 Nginx 可视化配置系统,如 Nginx UI、VeryNginx、OpenPanel、Ajenti、Schenkd nginx-ui、EasyEngine、CapRover 和 NGINX Agent,帮助简化和安全地管理 Nginx 实例。
|
18天前
|
缓存 负载均衡 应用服务中间件
Nginx配置
【10月更文挑战第22天】在实际配置 Nginx 时,需要根据具体的需求和环境进行调整和优化。同时,还需要注意配置文件的语法正确性和安全性。
35 7
|
27天前
|
前端开发 JavaScript 应用服务中间件
终极 Nginx 配置指南
本文介绍了Nginx的基本配置及其优化方法。首先,通过删除注释简化了Nginx的默认配置文件,使其更易于理解。接着,文章将Nginx配置文件分为全局块、events块和http块三部分进行详细解释。此外,还提供了如何快速上线网站、解决前端history模式404问题、配置反向代理、开启gzip压缩、设置维护页面、在同一IP上部署多个网站以及实现动静分离的具体配置示例。最后,附上了Nginx的基础命令,包括安装、启动、重启和关闭等操作。
|
28天前
|
JavaScript 前端开发 应用服务中间件
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
129 0
|
28天前
|
弹性计算 应用服务中间件 网络安全
ECS服务器使用:SSL证书安装、配置和问题定位指南
本文简要介绍了SSL证书的生成与部署方法,包括使用OpenSSL生成自签名证书和从CA获取证书的步骤,以及在Apache和Nginx服务器上的配置方法。此外,还提供了测试证书是否生效的方法和常见问题的解决策略,帮助确保证书正确安装并解决调试过程中可能遇到的问题。
129 0
|
Web App开发 JavaScript 应用服务中间件