前端Docker部署 http / https服务&使用 iframe嵌套页面遇到的问题&页面403 Forbidden问题

中心思想:先部署 http服务,再部署 https服务转发到 http服务上
(如果 http和 https服务部署在同一台服务器上,可共用一个 docker容器同时部署,见 3)
前端Docker微服务快速部署参考:前端Docker微服务快速部署
⇧⇧⇧这个博主很厉害
2023.04.11遇到问题:页面报错 403 Forbidden,查看容器日志,一堆类似"/usr/share/nginx/html/dist/index.html" failed (13: Permission denied)的报错,原因是dist目录没有权限。
解决方法:在unzip之后,多执行一步chmod -R 777 /xxx/dist/

1. http服务部署

(1)nginx配置:default.conf文件

server {
	listen       80; # http内部端口
	server_name  localhost;
	client_max_body_size 1024M;

	location / {
		root   /usr/share/nginx/html/dist;
		index  index.html index.htm;
    	try_files $uri $uri/ /index.html; #	Vue history模式路由必配
    	add_header 'Access-Control-Allow-Origin' '*' always; # 允许跨域访问
    }
    
    # 接口转发(接口中包含前缀 /apiWebser)
    # 当接口前缀有重复时,[字符长的前缀转发配置]必须写在[字符短的前缀转发配置]之前,否则会被[字符短的前缀转发配置]匹配上,导致无法连接到正确的后端服务
    location /apiWebser{
    	proxy_pass http://xx.xx.xx.xx:xxxx/;
	}

	# 接口转发(接口中包含前缀 /api)
	location /api{
    	proxy_pass http://xx.xx.xx.xx:xxxx/;
	}
	
	# 接口转发(接口中不包含前缀 /webser)
	location ^~/webser/ {
    	proxy_pass http://xx.xx.xx.xx:xxxx/;
	}
}

(2)部署脚本:upgrade.sh文件

/xxx/ 是前端部署文件的存放地址,web-server是当前前端服务的 docker容器名,根据实际情况调整*

rm -rf /xxx/dist

unzip /xxx/dist.zip

docker cp /xxx/default.conf     web-server:/etc/nginx/conf.d/

docker cp /xxx/dist      		web-server:/usr/share/nginx/html/

docker restart web-server

(3)创建 docker容器并启动服务

web-server是当前前端服务的 docker容器名,9000是外部端口,根据实际情况调整

docker run --name web-server -p 9000:80 -d nginx

【容器创建好之后,再执行更新部署脚本,即完成 http服务部署】

sh upgrade.sh

2. https服务部署

(1)nginx 配置:default.conf文件

(配置中的 temp.crttemp.key是证书文件,http://xxx.xxx.xxx.xxx:9000是部署的 http服务地址,根据实际情况调整)

server {
	listen       6443 ssl; # https内部端口
	server_name  localhost;
	
	ssl_certificate      /etc/nginx/conf.d/temp.crt; # https证书 crt文件
	ssl_certificate_key  /etc/nginx/conf.d/temp.key; # https证书 key文件

	location / {
    	proxy_pass	http://xxx.xxx.xxx.xxx:9000; # 转发到 http服务地址
	}
}

(2)部署脚本:upgrade.sh文件

web-server-https是当前前端服务的 docker容器名,根据实际情况调整

docker cp /xxx/default.conf     web-server-https:/etc/nginx/conf.d/

# 拷贝 https证书文件到容器中
docker cp /xxx/temp.crt      	web-server-https:/etc/nginx/conf.d/
docker cp /xxx/temp.key      	web-server-https:/etc/nginx/conf.d/

docker restart web-server-https

(3)创建 docker容器并启动服务

web-server-https是当前前端服务的 docker容器名,9001是外部端口,根据实际情况调整

docker run --name web-server-https -p 9001:6443 -d nginx

【容器创建好之后,再执行更新部署脚本,即完成 https服务部署】

sh upgrade.sh

3. http和 https服务共用一个 docker容器,同时部署

(如果 http和 https服务部署在同一台服务器上)

(1)nginx配置:1 & 2的 nginx配置合并

(2)部署脚本:1 & 2的 部署脚本合并

(3)创建 docker容器:1 & 2的创建命令合并

docker run --name web-server -p 9001:6443 -p 9000:80 -d nginx

4. 使用 iframe嵌套页面

当前场景:外部集成环境使用 iframe方式集成了多个独立子应用的页面

1). 外部集成环境使用 https协议时,iframe方式集成的其他应用也必须使用 https协议
2). 如果使用的 https安全证书不是正式备案受信任的证书,在进入页面时,需要手动进行安全认证,类似这样:
在这里插入图片描述
3). 如果使用的是不受信任的临时证书:
外部集成环境 和 iframe方式集成的其他应用必须部署在同一台服务器上,且使用同样的 https安全证书

否则会出现问题: 打开集成环境后,进入 iframe方式集成的其他应用的页面,页面打不开,需要在浏览器中单独打开其他应用,手动安全认证后,才能在集成环境中打开

只有按照 3)的部署方式,在打开集成环境时,手动安全认证后,iframe方式集成的其他应用因为使用的是同样的证书,就能直接通过安全认证进入页面,而不需要另外的手动安全认证

当然,如果能申请正式受信任的 https安全证书,就不会有这些问题了

  • 3
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是在 Docker部署 Bitnami Magento 的步骤: 1. 首先,安装 DockerDocker Compose。 2. 创建一个新目录,用于存储 Docker Compose 文件和 Magento 应用程序数据。 3. 在该目录下创建一个 `docker-compose.yml` 文件,其内容如下: ``` version: '3' services: mariadb: image: 'bitnami/mariadb:latest' environment: - ALLOW_EMPTY_PASSWORD=yes - MARIADB_USER=magento - MARIADB_DATABASE=bitnami_magento volumes: - 'mariadb_data:/bitnami/mariadb' magento: image: 'bitnami/magento:latest' ports: - '80:80' - '443:443' environment: - MAGENTO_DATABASE_USER=magento - MAGENTO_DATABASE_NAME=bitnami_magento - ALLOW_EMPTY_PASSWORD=yes volumes: - 'magento_data:/bitnami/magento' volumes: mariadb_data: driver: local magento_data: driver: local ``` 这个文件定义了两个服务:`mariadb` 和 `magento`。`mariadb` 是一个 MariaDB 数据库容器,用于存储 Magento 应用程序的数据。`magento` 是一个包含 Magento 应用程序的容器,其将通过端口 80 和 443 对外提供服务。 4. 在终端中导航到该目录,然后运行以下命令: ``` docker-compose up -d ``` 这将启动 `mariadb` 和 `magento` 服务,并在后台运行它们。 5. 访问 Magento 应用程序的 Web 界面。在浏览器中输入 `http://localhost` 或 `https://localhost`,即可访问 Magento 应用程序的 Web 界面。 希望以上步骤能够帮助你成功在 Docker部署 Bitnami Magento。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值