无法使Browsersync与Laravel和Laravel一起正常工作

Question

我设法使Browsersync部分工作，但是，每当我在页面加载后从我的应用程序发出请求时，请求就会被发送到错误的URL。

以下是我的Browsersync设置：

mix.browserSync({
    proxy: 'localhost',
    port: 8082,
    injectChanges: false,
    open: false,
    files: [
        './public/css/*.css',
        './public/js/*.js',
        './resources/views/**/*.blade.php',
        './resources/js/**/*.vue',
        './resources/css/**/*.css',
    ],
})

这是我的docker-compose.yml

version: '3'
services:
    laravel.test:
        build:
            context: ./docker/8.1
            dockerfile: Dockerfile
            args:
                WWWGROUP: '${WWWGROUP}'
        image: sail-8.0/app
        working_dir: /var/www/html
        extra_hosts:
            - 'host.docker.internal:host-gateway'
        ports:
            - '${APP_PORT:-80}:80'
            - "9865:22"
            - "8082:8082"
            - "8083:8083"
        # ...

我导航到http://localhost:8082/，页面加载得很好，Browsersync说它是连接的。然而，当我提交我的表格时，我得到以下信息：

​

​

据我所知，这是代理没有端口的问题，但是，我尝试将代理更改为localhost:8082，然后甚至无法连接。我还尝试了将其改为127.0.0.1的其他建议，这并没有什么不同。

Answer 1

我通过设置以下配置解决了问题：

mix.browserSync({
    proxy: 'localhost:8081',
    port: 8082,
    ui: {
        port: 8083,
    },
    injectChanges: false,
    open: false,
    files: [
        './public/css/*.css',
        './public/js/*.js',
        './resources/views/**/*.blade.php',
        './resources/js/**/*.vue',
        './resources/css/**/*.css',
    ],
    watchOptions: {
        usePolling: true,
        interval: 500,
    },
    ghostMode: false,
})

其中，8081是在APP_PORT文件中设置的.env。换句话说，Browsersync需要在应用程序运行时被代理到同一个端口。