Question

修改

我发现，如果我直接导航到React之外的页面，则可以查看正确的页面。但是，一旦进入React应用程序，我将无法浏览。

我尝试过的事情

window.locastion我尝试了window.location的一些变体。

示例-

 <a class="btn btn-lg btn-primary btn-block" onClick={() => window.location.replace('https://www.example.com/help.html')}>
    Get Started Now!
    </a>

.htaccess

redirect newfile.php https://example.com/newfile.php

a href

<a href="https://example.com/newfile.php">Click</a>

背景

我正在将React应用程序集成到现有的PHP站点中。网站上有4个模块，我想用React应用程序替换公共模块。我创建了<a href>标签来链接到相同的域，但不在应用程序中其他3个模块的React网页之外。

问题

上传React应用程序后，当我单击<a>标签时，它们很少打开正确的页面。大多数时候，<a>标记链接到正确的URL路径，但是应用程序停留在React应用程序内部，不会离开到React外部，而是停留在同一域网页中。

示例

主要网站URL https://www.example.com/ // React应用 点击了href标签 https://www.example.com/other/webpage //应该是PHP网站

上面示例中的第二种情况几乎总是显示没有任何内容的React应用程序。只是页眉和页脚。

我在网站上有多个链接，它们的行为方式相同。

代码示例

这应该在React外部加载一个PHP网页，但相反，它会加载React应用程序，

    <li role="presentation" class="">
       <a href="https://www.example.com/some/page" role="button">
         Login / Register
      </a>
   </li>

问题

确保我的用户单击<a href>标签时看到正确的页面的正确方法是什么？

Answer 1

也许您可以尝试使用react-router-dom而不是href = / a尝试使用Link to = / Link

Answer 2

对于其他处理此问题的人，此问题是Rect应用程序加载后出现的缓存问题。直接的问题和解决方案是

registerServiceWorker();

为了解决这个问题并使链接重新工作，我只需要注释掉注册服务工作者。

// registerServiceWorker();

我还没有发现为什么这会导致这种现象，但是暂时解决了该问题。我不确定我对此是否满意，我想知道这是否是一个错误。令我惊讶的是，由于没有任何相关信息，过去从未出现这种情况。

从React导航到同一域上的非React网页

2 个答案: