如果screen.width <= 480，只有一次，当移动设备首次遇到它时，我该如何编写javascript重定向到主页上

Question

我已经根据屏幕宽度创建了重定向。

该页面为https://galleryofjewels.businesscatalyst.com/home

我希望重定向仅在手机首次在此处遇到“家”时发生一次： https : //galleryofjewels.businesscatalyst.com/home

我正在使用此javascript将“首页”页面重定向到一个名为“ about-us-mobile”的页面，该页面设计用于480或更小的屏幕宽度：

if (screen.width <= 480) {
    document.location = "about-us-mobile ";
}

我只有2个页面针对480以下的页面进行了优化，并且在这两个页面上都有一个链接“ shop”，这些链接可以返回galleryofjewels.businesscatalyst。

我希望手机单击“购物”按钮以查看完整的“主页”页面，而无需再次重定向到“ about-us-mobile”。

因此，我创建了一个页面，该页面是“主页”页面的副本，并将其称为“ home_full_site_shop”。 它没有重定向。 移动页面上的“商店”按钮链接到该页面。

如果手机最终尝试通过galleryofjewels.businesscatalyst任何页面上的“购物”按钮再次链接回主页，我希望它不要再次重定向到“ about-us-mobile”。

简而言之，我希望重定向仅在手机首次遇到galleryofjewels.businesscatalyst主页时发生一次

Answer 1

如果您只想使用JavaScript，那么最好的选择就是使用一个GET变量，该变量在您的网站识别出尺寸后就可以设置。 设置此变量将向每个页面指示相关链接应转到针对移动设备优化的页面（您可以根据此GET变量的存在（或不存在）动态创建链接）。 您实际上可以避免这两种重定向。 只需在网站上的每次点击中传递GET变量即可（可以通过动态修改加载的所有页面链接来完成此操作）。

如果您还有服务器端选项（可能是PHP），那么您会拥有一个更漂亮的选项。 您可以使用会话/ cookie来存储当前用户是否移动，并在设置会话后向Web浏览器发送适当的链接。

Answer 2

通过设置（以法律术语：技术）cookie（不包含唯一信息）可以很简单。

cookie选项得到了跨浏览器的很好的支持，并且有据可查（除非用户拒绝了cookie，但由于诸如共谋之类的意识工具，目前相当流行）。 在这种情况下，如果您没有某种后备机制或正常降级功能，那么用户就会遇到“问题”。
如果您还依赖javascript，那么您的网站有2个要求：cookies和javascript。
因此，尽管javascript / cookie路由很容易实现，但从长远来看，放眼一点也不会有什么害处：

或者，您也可以根据当前的所有古怪潜入本地网络存储

您可以使用基于IP或类似数据库的数据库将其记录在服务器上。

另一个选择是（如果仍然渲染html服务器端）重写/更改文档和脚本中的所有链接（使用GET变量）。
或.htaccess mod-rewrite ..？

我滚了...
您还可以使用2个子域：在前门捕获用户，将他们重定向到您的分辨率/应用特定的子域，然后使用javascript函数history.replace（）进行操作。 这样，用户无法在历史记录中导航回“前门”，因此他最终被困在了子域的根目录下。

多田：P

因此，对此要求的正确长期解决方案始于做出选择。

Answer 3

if (window.innerWidth <= 480) {
    window.location = "https://galleryofjewels.businesscatalyst.com/home";
}