Laravel+Vite+Sail配置HTTPS可行吗？配置后HTTPS无法访问求助

折腾了好几个小时还是搞不定，目前Laravel+Vite+Sail的HTTP访问http://mysite.test正常，但HTTPS访问时提示“无法访问此网站，mysite.test意外关闭连接”。以下是我的配置文件：

docker-compose.yml #

version: '3'
services:
    mysite.test:
        build:
            context: ./docker/8.1
            dockerfile: Dockerfile
            args:
                WWWGROUP: '${WWWGROUP}'
        image: sail-8.1/app
        extra_hosts:
            - 'host.docker.internal:host-gateway'
        ports:
            - '${APP_PORT:-80}:80'
            - '443:443' //added for test but not working...
            - '${HMR_PORT:-8080}:8080'
            - '5173:5173' //Vite port
        environment:
            WWWUSER: '${WWWUSER}'
            LARAVEL_SAIL: 1
            XDEBUG_MODE: '${SAIL_XDEBUG_MODE:-off}'
            XDEBUG_CONFIG: '${SAIL_XDEBUG_CONFIG:-client_host=host.docker.internal}'
        volumes:
            - '.:/var/www/html'
        networks:
            - sail
        depends_on:
            - mysql
            - minio
    mysql:
        image: 'mysql/mysql-server:8.0'
        ports:
            - '${FORWARD_DB_PORT:-3306}:3306'
        environment:
            MYSQL_ROOT_PASSWORD: '${DB_PASSWORD}'
            MYSQL_ROOT_HOST: "%"
            MYSQL_DATABASE: '${DB_DATABASE}'
            MYSQL_USER: '${DB_USERNAME}'
            MYSQL_PASSWORD: '${DB_PASSWORD}'
            MYSQL_ALLOW_EMPTY_PASSWORD: 1
        volumes:
            - 'sail-mysql:/var/lib/mysql'
            - './vendor/laravel/sail/database/mysql/create-testing-database.sh:/docker-entrypoint-initdb.d/10-create-testing-database.sh'
        networks:
            - sail
        healthcheck:
            test: ["CMD", "mysqladmin", "ping", "-p${DB_PASSWORD}"]
            retries: 3
            timeout: 5s
networks:
    sail:
        driver: bridge
volumes:
    sail-nginx:
        driver: local
    sail-mysql:
        driver: local

vite.config.js #

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    server: {
        https: true,
        host: '0.0.0.0'
    },
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
            ],
            refresh: true
        }),
    ],
});

.env #

(...)
APP_URL=https://mysite.test
APP_SERVICE=mysite.test
(...)

解决建议 #

• 修正docker-compose.yml语法错误：YAML注释必须用#，你当前ports里的//added for test but not working...和//Vite port是无效的，会导致配置解析异常，改成# added for test but not working...和# Vite port后重启Sail。
• 配置Web服务器HTTPS证书：Sail默认镜像未配置SSL证书，即使映射了443端口，服务端也不会监听HTTPS请求，自然会断开连接。可以按以下步骤处理：
  1. 在项目根目录创建docker/ssl目录，执行命令生成自签名证书：

     openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout ./docker/ssl/server.key -out ./docker/ssl/server.crt
     

  2. 修改docker-compose.yml，在mysite.test的volumes中添加证书挂载：

     volumes:
         - '.:/var/www/html'
         - './docker/ssl:/etc/ssl/certs/mysite'
     

  3. 配置容器内的Nginx/Apache，启用443端口并指定证书路径（比如Nginx的server块配置listen 443 ssl，并设置ssl_certificate和ssl_certificate_key指向挂载的证书文件）。
• 同步Vite的HTTPS证书配置：确保Vite使用的证书和Web服务器一致，修改vite.config.js：

  import { defineConfig } from 'vite';
  import laravel from 'laravel-vite-plugin';
  import fs from 'fs';
  
  export default defineConfig({
      server: {
          https: {
              key: fs.readFileSync('./docker/ssl/server.key'),
              cert: fs.readFileSync('./docker/ssl/server.crt')
          },
          host: '0.0.0.0'
      },
      plugins: [
          laravel({
              input: [
                  'resources/css/app.css',
                  'resources/js/app.js',
              ],
              refresh: true
          }),
      ],
  });
  

• 检查本地环境：确认hosts文件已将mysite.test映射到127.0.0.1，同时本地443端口未被其他服务（如本地Nginx、Apache）占用。
• 彻底重启容器：执行sail down -v && sail build --no-cache && sail up -d，清除旧容器和缓存后重新构建服务。

内容的提问来源于stack exchange，提问作者AnthoR