localhost:8080 总是重定向到 localhost:3000答案

【问题标题】：localhost:8080 always redirect to localhost:3000localhost:8080 总是重定向到 localhost:3000
【发布时间】：2018-08-07 00:27:28
【问题描述】：

我有一个 带有 Docker 的 WordPress 开发环境。就是这么简单，只需要一个docker compose with Wordpress 和MySQL。

这是我的 docker-compose 文件。一切都很完美，起初我可以在 localhost:8080

中看到我的 WordPress

version: '3.1'

services:

  wordpress:
    image: wordpress
    restart: always
    ports:
      - 8080:80
    volumes:
      - /Users/ivan/Developer/theme:/var/www/html/wp-content/themes/theme
    environment:
      WORDPRESS_DB_PASSWORD: password

  mysql:
    image: mysql:5.7
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: password

我还使用 Browser Sync 和 Gulp 来实时重新加载网站。我在浏览器同步设置中配置了一个 proxy，然后我可以在 localhost:3000 和 my_local_ip:3000 中看到我的 WordPress 并实时重新加载。

browsersync: {
    browser: 'google chrome',
    proxy: "localhost:8080",
},

问题是我在 WordPress 网址设置中做了一些更改（然后我恢复了它），但现在重定向效果不佳。

如果我尝试访问 localhost:8080 或 my_local_ip:3000，浏览器总是会重定向到 localhost:3000 并显示“重定向过多”错误。（即使 BrowserSync 和 Docker 关闭）。
运行 Docker 和 BrowserSync，my_local_ip:3000/wp-admin 和 localhost:3000/wp-admin 完美运行，但我看不到我的博客。 localhost:3000 总是显示错误。

我已经尝试清除浏览器缓存，但没有解决。我现在不知道 Docker、BrowserSync 或 MacOS（High Sierra 是我的操作系统）的错误或错误配置

【问题讨论】：

我认为问题出在您的 Wordpress 配置上。如果它正在工作并且在您更改某些配置后开始循环重定向，请确保它是 Wordpress。我不是 Wordpress 专家，但我知道 Wordpress 在数据库中保存了一些硬编码的 URL。看看是否每个 URL 都配置正确。祝你好运！
是的，但奇怪的是即使在 Docker 容器（WordPress 和 MySQL）关闭的情况下重定向也有效。
你试过“私人模式”吗？
可以，但没有解决
清除缓存通常不会清除重定向（是的，这很痛苦）。您可以在控制台fetch('http://localhost:{port}', {method: 'post'}).then(() => {}) 中运行，这应该会清除缓存。

标签： wordpress macos docker localhost browser-sync

【解决方案1】：

我刚才遇到了同样的问题，并解决了。所以这是我的发现。

WordPress 使用 Host 标头来确定流量的来源，并根据配置集对其进行重定向。

由于您使用 BrowserSync 作为代理，BrowserSync 会向localhost:8080 发送一个请求，其中Host 标头值为localhost:8080，而不是您发送请求的位置。

所以首先要做的是让 BrowserSync 使用正确的主机。我们可以像这样从原始请求中获取主机

proxy: {
    target: 'http://localhost:8080/',
    proxyReq: [
        function(proxyReq, req, res) {
                proxyReq.setHeader('Host', req.headers.host);
        }
    ]
},

接下来确保WordPress Address (URL) 和 Site Address (URL) url 在WP-Admin -> Settings -> General 中设置正确

[host:port]/wp-admin/options-general.php

应该这样做。至少对我有用。

【讨论】：

【解决方案2】：

使用此代码更改 Browsersync 选项：

const browserSync = require('browser-sync').create(); // npm install browser-sync --save-dev

const
// source and build folders
dir = {
  watch: 'source-theme/',
  build: 'build-theme/'
},

// Browsersync options:
const syncOpts = {
  port: 3000, 
  proxy: 'http://mywebsite.ss',
  files: dir.watch + '**/*',
  open: true,
  notify: false,
  ghostMode: false,
  ui: {
    port: 8001, //default port 8080
    weinre: {
        port: 8002 //default weinre port 9090
    }
  },
};

// browser-sync task
gulp.task('browserSync', () => {
  browserSync.init(syncOpts);
});

更多信息https://browsersync.io/docs/options

【讨论】：