Laravel + Vite + Sail 通过 HTTPS。可能的?

Ant*_*hoR 2 https laravel laravel-sail vite

经过几个小时的尝试后,我想我太困惑了,无法理解出了什么问题......标题完美地解释了我正在努力实现的目标。\n我的docker-compose.yml

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

我的vite.config.js

\n
import { defineConfig } from \'vite\';\nimport laravel from \'laravel-vite-plugin\';\n\nexport default defineConfig({\n    server: {\n        https: true,\n        host: \'0.0.0.0\'\n    },\n    plugins: [\n        laravel({\n            input: [\n                \'resources/css/app.css\',\n                \'resources/js/app.js\',\n            ],\n            refresh: true\n        }),\n    ],\n});\n
Run Code Online (Sandbox Code Playgroud)\n

我的.env

\n
(...)\nAPP_URL=https://mysite.test\nAPP_SERVICE=mysite.test\n(...)\n
Run Code Online (Sandbox Code Playgroud)\n

该配置的结果是它可以与http://mysite.test一起使用,但不能在 https 中使用。那个回报:

\n

无法访问此站点\xe2\x80\x99

\n

mysite.test 意外关闭了连接。

\n

有人可以给我一些建议吗?\n谢谢!

\n

小智 8

我设法使用以下要点与 Caddy 一起工作 https://gist.github.com/gilbitron/36d48eb751875bebdf43da0a91c9faec

完成上述所有操作后,我将 vite 端口添加到服务docker-compose.ymllaravel.test

ports:
    - '5173:5173'
Run Code Online (Sandbox Code Playgroud)

另外vite本身需要ssl证书

vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
import basicSsl from '@vitejs/plugin-basic-ssl'

export default defineConfig({
    server: {
        https: true,
        host: '0.0.0.0',
        hmr: {
            host: 'localhost'
        },
    },
    plugins: [
        basicSsl(),
        laravel({
            input: 'resources/js/app.js',
            refresh: true,
        }),
        vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false,
                },
            },
        }),
    ],
});
Run Code Online (Sandbox Code Playgroud)

由于某种原因,我的应用程序生成 http 链接,而不是 https。boot所以我在我的方法中添加了以下内容AppServiceProvider.php

\URL::forceScheme('https');
Run Code Online (Sandbox Code Playgroud)