首页 > 解决方案 > 使用反应路由器 V6 和刷新页面时我得到空白页面

问题描述

我学习了 ReactJs,现在我无法理解这个问题。我找到了很多关于这个的讨论,但这都是针对低于 v6 的路由器。

在本地主机上它工作正常,但在实时服务器生产上它不像如果我输入这个或刷新:

https://greta.portplays.com/app/login

我得到一个空白的白页。

请建议我知道这与历史有关,但路由器 v6 不使用它与其他解释相同

这是我的路线没什么特别的:

import React from 'react';
import ContentLayout from './components/structure/ContentLayout';
import DashboardLayout from './components/DashboardLayout';
import AccountView from './components/DashboardLayout/views/account/AccountView';
import SearchListView from './components/DashboardLayout/views/search/SearchListView';
import DashboardView from './components/DashboardLayout/views/dashboard/DashboardView';
import NotFoundView from './components/DashboardLayout/views/errors/NotFoundView';
import CreateContentView from './components/DashboardLayout/views/creator/CreateContentView';
import SettingsView from './components/DashboardLayout/views/settings/SettingsView';
import LoginView from './components/DashboardLayout/views/auth/LoginView';
import RegisterView from './components/DashboardLayout/views/auth/RegisterView';
import SubmissionsView from './components/DashboardLayout/views/submissions/SubmissionsView';
import InboxView from './components/DashboardLayout/views/inbox/InboxView';

const routes = [
    {
        path: 'app',
        element: <DashboardLayout />,
        children: [
            { path: 'account', element: <AccountView /> },
            { path: 'search', element: <SearchListView /> },
            { path: 'dashboard', element: <DashboardView /> },
            { path: 'create', element: <CreateContentView /> },
            { path: 'submissions', element: <SubmissionsView /> },
            { path: 'inbox', element: <InboxView /> },
            { path: 'settings', element: <SettingsView /> },
            { path: 'login', element: <LoginView /> },
            { path: 'register', element: <RegisterView /> },
            { path: '*', element: <NotFoundView /> },
            { path: '/', element: <DashboardView /> },
        ],
    },
    {
        path: '/',
        element: <ContentLayout />,
        children: [
            { path: '404', element: <NotFoundView /> },
            { path: '*', element: <NotFoundView /> },
        ],
    },
];

export default routes;

在 package.json 我这样添加

"homepage": "https://greta.portplays.com/",

同样在我添加的应用程序的 Apache 服务器根目录中 .htaccess

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

我的应用程序位于这样的子域中:

在此处输入图像描述

标签: reactjsreact-router-domhistory

解决方案


isUserAnon当本地存储被清除或设置为 false时,似乎工作正常。


推荐阅读