时间戳

首页 > 解决方案 > 如何将 React 应用程序重定向到非 www HTTPS？

reactjs - 如何将 React 应用程序重定向到非 www HTTPS？

问题描述

我正在编写一个部署在我的网络服务器上的 React 应用程序。我有以下 .htaccess 文件，它通过索引文件处理所有请求，因为我使用的是客户端路由：

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

哪个有效。

但是，我想将所有流量重定向到 HTTPS 非 www。有人可以使用标准的 .htaccess 文件但通过 index.html 引导我朝着正确的方向前进：

RewriteEngine On
RewriteCond %{HTTPS} off [OR]
RewriteCond %{HTTP_HOST} !^www\. [NC]
RewriteCond %{HTTP_HOST} ^(?:www\.)?(.+)$ [NC]
RewriteRule ^ https://www.%1%{REQUEST_URI} [L,NE,R=301]

标签： reactjsapache.htaccess

解决方案

最容易分解你已经拥有的东西（相反）

RewriteEngine On
RewriteCond %{HTTPS} off [OR]

当请求未通过 https 完成时匹配...非常简单。末尾的 [OR] 表示此规则或其下方的规则必须返回 true。

RewriteCond %{HTTP_HOST} !^www\. [NC]

如果没有“www”，则匹配。在请求^的开始（表示开始，!表示“不”）。[NC]意思是“nocase”，所以基本上只是忽略了这种情况。在 linux 服务器上不需要，但仍然推荐。

RewriteCond %{HTTP_HOST} ^(?:www\.)?(.+)$ [NC]

因此，一旦 HTTPS 关闭或字符串不以 开头www.，HTTP_HOST 就会传递到此规则中。当正则表达式匹配可选的“www”时，此规则将始终返回 true。（因为?在括号之后），然后是一个或多个字符 ( .+) 直到字符串 ( $) 的结尾。

可选项之后的.+部分www.被包裹在括号中以捕获它（(?:在它表示非捕获组之前，因此主机名的其余部分被捕获为%1- 或第一个捕获的组）。

RewriteRule ^ https://www.%1%{REQUEST_URI} [L,NE,R=301]

然后重写请求，包括https://www.主机名的其余部分，$1然后是 REQUEST_URI，这是/URI 中第一个的所有内容。

规则末尾的位也很简单，L意味着这是最后一个重写规则，NE意味着noescape- 这在包含 request_uri 以防止它被转义时很有用。R=301表示以 301 状态重定向。

TLDR - 您的解决方案

因此，要创建需要删除 www. 的规则，您应该翻转以下几个选项：

RewriteEngine On
RewriteCond %{HTTPS} off [OR]
RewriteCond %{HTTP_HOST} ^www\. [NC]
RewriteCond %{HTTP_HOST} ^(?:www\.)?(.+)$ [NC]
RewriteRule ^ https://%1%{REQUEST_URI} [L,NE,R=301]

在第二个RewriteCond我们删除!以使其匹配以 开头的 url www.，然后在RewriteRule我们删除 www。正在添加。

推荐阅读