根目录中的 Wordpress 和子目录中的 vue。使用 wordpress URL 屏蔽 vue。 URL 指向 root 和页面加载是 vue

Question

在根目录下有 WordPress 网站。在名为“vue”的子目录中，存在 vue build。在 wordpress URL 中，如果“podcaster”或“crowd”不是 URL 的一部分，那么我想在不更改浏览器 URL 的情况下加载 vue 页面。

下面是我的文件夹结构

Target is:

www.example.com/podcaster //display in the address bar, points to WP (var/www/html/)
www.example.com/crowd //display in the address bar, points to WP (var/www/html/)
www.example.com/username  //display in the address bar, points to VUE (var/www/html/vue)
www.example.com           //display in the address bar, points to WP (var/www/html/)

下面是WordPress根目录.htaccess：

    # BEGIN WordPress
    # The directives (lines) between "BEGIN WordPress" and "END WordPress" are
    # dynamically generated, and should only be modified via WordPress filters.
    # Any changes to the directives between these markers will be overwritten.
        <IfModule mod_rewrite.c>
            Options +FollowSymLinks -MultiViews
            RewriteEngine On
            # Rewrite rule for vue
                RewriteCond %{REQUEST_URI} !^/crowd/
                RewriteCond %{REQUEST_URI} !^/podcaster/
                RewriteRule (.+) /vue/$1 [L]
        
            RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
            RewriteBase /
        
            RewriteRule ^index\.php$ - [L]
            RewriteCond %{REQUEST_FILENAME} !-f
            RewriteCond %{REQUEST_FILENAME} !-d
            RewriteRule . /index.php [L]
        
        </IfModule>
        
        # END WordPress

下面是vue子目录.htaccess：

# /vue/.htaccess
RewriteEngine On
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . index.html [L]

Answer 1

但是，您还没有确切说明问题是什么......

RewriteCond %{REQUEST_URI} !/podcaster/
RewriteRule ^(.*)$ /vue/$1 [L,NC]

这将导致对根目录的请求在内部被重写到 /vue 子目录（我假设您已将其放在根目录中 WordPress .htaccess 文件的 top目录）。您已经说过应该从根目录提供 WordPress。在这种情况下，您应该将 RewriteRule pattern 从 .*（0 或更多）更改为 .+（1 或更多）以避免触发对根（基本 URL / 主页）的请求)。

您还需要确保重写的请求（由 WordPress 前端控制器 - 到 index.php - 在下面的代码中）也不会被重写（否则 一切 最终将被重写为/vue 子目录）。我们可以通过添加另一个 condition 来检查 REDIRECT_STATUS 环境变量，它在初始请求中为 empty 并设置为 200（如 200 OK status) 后重写。

更新：而且我怀疑您还需要排除一些静态资源（CSS、JS、图像等），因此我们可能需要为这些资源添加文件系统检查，因此如果请求已经映射到文件（或目录），则不会重写请求。

例如，将以上几点放在一起，就变成了：

RewriteCond %{ENV:REDIRECT_STATUS} ^$
RewriteCond %{REQUEST_URI} !/podcaster/
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule (.+) /vue/$1 [L]

我已经删除了 NC 标志，因为这在这里是多余的。另请注意，当字符串“/podcaster/”（注意斜线）未出现在 URL 路径中的 anywhere 时，条件 是成功的。这不应该限制在 URL 路径的 start 吗？例如。 !^/podcaster/.

另外，WordPress .htaccess 文件的其余部分在哪里？ WordPress 前端控制器（通常出现在# BEGIN WordPress 注释标记之后的部分）应该出现在您的自定义指令之后。如果您将自定义重写放在 WordPress .htaccess 文件的末尾，在 WP 前端控制器部分之后，那么您的指令将不会做任何事情，因为所有请求都将被路由到 WordPress。

请注意，您应该将自定义指令放在 # BEGIN WordPress 注释标记之前。您永远不应编辑 # BEGIN WordPress 和 # END WordPress cmets 之间的代码，因为此代码块由 WordPress 维护，并且您的代码可能会在 WP 更新时被覆盖（除非您采取额外的措施来防止这种情况发生）。无需重复 RewriteEngine 或 <IfModule> 指令。

下面是“vue”子目录下的vue .htaccess

<ifModule mod_rewrite.c>
    RewriteEngine On
  RewriteBase /vue/
  RewriteRule ^vue/index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /vue/index.html [L]
</ifModule>

Vue .htaccess 文件不太正确（尽管应该可以正常工作）。第一个RewriteRule 指令（这只是一个优化）不应在正则表达式中包含vue 子目录。换句话说，应该写成：

RewriteRule ^index\.html$ - [L]

由于匹配的 URL 路径是相对于包含 .htaccess 文件的文件系统路径。

事实上，您可以从该文件中删除所有vue 实例（这使得它更简单、更便携），前提是您还完全删除了RewriteBase 指令。例如：

# /vue/.htaccess

RewriteEngine On

RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . index.html [L]

相对替换字符串（即上面第二个RewriteRule 指令中的index.html）与包含.htaccess 文件的目录相关（前提是您没有另外声明的RewriteBase 指令）。所以，上面自然将请求重写为/vue/index.html，而不必显式声明目录。