如何为 React 路由设置 apache 服务器?

2023-12-14

我的 React 应用程序在本地开发服务器上运行良好,但当我将生产就绪文件直接转储到 Apache 的 htdocs 目录时,它不起作用:

这是我所拥有的:

/var/www/index.html
/var/www/bundle.js

我有

DocumentRoot /var/www

在 /etc/apache2/sites-available/000-default.conf 中

事实是
1)。当我访问时http://...com/这将我带到了登录页面
2)。我点击链接后

<Link to="main"><button>Log In</button></Link>

浏览器位置字段中的内容变为:

http://...com/main

3)。现在如果我重新加载这个网址(http://...com/main), I got

The requested URL /main was not found on this server

我在 React 中的路由:

    <Router history={browserHistory }>
      <Route path="/" component={TopContainer}>
          <IndexRoute component={Login} />
          <Route path='main' component={MainContainer} />   
      </Route>
</Router>

apache 配置中还缺少什么?

thanks


改变虚拟主机配置(通常发现于/etc/httpd/conf.d\vhosts.conf)通过添加以下 Rewrite* 行:

<VirtualHost *:8080>
  ServerName example.com
  DocumentRoot /var/www/httpd/example.com

  <Directory "/var/www/httpd/example.com">
    ...

    RewriteEngine On
    # Don't rewrite files or directories
    RewriteCond %{REQUEST_FILENAME} -f [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^ - [L]
    # Rewrite everything else to index.html to allow html5 state links
    RewriteRule ^ index.html [L]
  </Directory>
</VirtualHost>

这告诉 Apache 提供任何存在的文件,但如果它们不存在,则只提供服务/index.html而不是一个404: not found.

  • 阿帕奇参考:配置 Apache 虚拟主机

  • react-router历史参考:配置您的服务器

感谢盗取的完整答案here

编辑:在当前 apache 版本中“On”需要大写

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何为 React 路由设置 apache 服务器? 的相关文章

随机推荐

  • 在 Either 中指定 Case 对象的类型

    如果我有一个对象如下 case object Foo 我尝试创造这样的价值 Either Foo B 我收到编译错误 指出找不到 Foo 但如果我这样做 Either Foo type B 它编译 我的问题是这样做是否正确 每当你想声明一个
  • 如何根据执行程序/子安装程序的过程结果重新启动 Inno Setup 安装程序

    我有一个安装过程 如果未安装子 exe 则执行该安装过程 如果是这样 我想要最终的 启动我的应用程序 末尾的复选框将替换为 重新启动计算机 复选框 我怎样才能做到这一点 我尝试使用NeedRestart 并使用全局布尔变量 但我似乎无法让它
  • 如何创建没有 setter 函数的 getter 函数?

    我的脚本中有多个导出的变量 每当更改一个变量时 我想调用一个通用的 getter 并让值自动设置 tool export float var sample1 setget smthn changed export float var sam
  • 为什么 padding: 0 隐藏我的无序列表项目符号?

    我正在更新一个旧网站 其中有很多无序列表 每当 padding 设置为 0 时 无序列表的显示 标记 就会消失 问题是 CSS 设置 padding 0 margin 0 我现在正在删除它 每个克里斯 科伊尔的笔记 是 不再酷 为什么pad
  • 放大/缩小鼠标点?

    As seen in the pictures 我在 QScrollArea 中有 QWidget QWidget 充 当细胞图像和一些基于矢量的轮廓数据的渲染小部件 用户可以执行放大 缩小操作 简单地发生的是 它改变了 QPainters
  • “{Binding Path=.}”和“{Binding}”真的相等吗

    在我的 WPF 项目中 我有一个列表框 用于显示来自List
  • 无法移出 Rust 中借用的内容

    pub struct Character name String hp i32 level i32 xp i32 xp needed i32 gold i32 impl Character pub fn new name String gt
  • 使用 Azure Powershell 或 Azure CLI 创建 Log Analytics 警报

    我正在尝试在 azure 门户的 LogAnlytics 中创建警报 需要为 5 个数据库创建 6 个警报 因此必须手动创建 30 个警报 并且非常耗时 因此需要一种自动化方法 尝试通过创建使用 Azure PowerShell 创建警报
  • 在批处理作业中创建文件名作为时间戳

    我们有一个每天运行的批处理作业 并将文件复制到拾取文件夹 我还想获取该文件的副本并将其放入具有文件名的存档文件夹中 yyyy MM dd log 在 Windows 批处理作业中执行此操作的最简单方法是什么 我基本上是在寻找与此 Unix
  • 检测 HTML5 Video 元素是否正在播放 [重复]

    这个问题在这里已经有答案了 我浏览了几个问题来了解 HTML5 元素是否正在播放 但找不到答案 我查看了 W3 文档 它有一个名为 playing 的事件 但我似乎无法让它工作 这是我当前的代码 var stream document ge
  • Mockito 通过,但代码覆盖率仍然较低

    package com fitaxis test import java sql SQLException import org junit Assert import org junit Test import org mockito M
  • 在 Vue 项目中创建和操作 SVG

    我是 Vue js 新手 需要创建一个 Vue 组件来创建和操作 SVG 根据我的理解 在 Vue 组件中使用 JQuery 并不是最好的选择 不过我愿意 因为选择元素非常简单 这是我的 Vue 组件 但我不确定如何使其发挥作用 注意 SV
  • 如何通过jquery将点击更改为鼠标悬停或悬停?

    我想在鼠标悬停或悬停时显示日期 现在是 onclick 我已经使用工具提示来显示数据 但我想在鼠标悬停时显示数据 我尝试了很多但没有成功 任何机构都可以提供帮助 我们将不胜感激 提前致谢 这是我的代码 它想在单击鼠标悬停 悬停时进行更改
  • 按修改日期排序该数组?

    我有一个 php 文件 它在我的用户目录中创建一个包含所有内容的数组 然后该数组被发送回 iPhone 我的 php 创建的数组按字母顺序排序 我希望它按文件创建日期排序 这是我的 php 文件的样子 我该怎么做 谢谢 Using usor
  • 将泛型集合 List<> 绑定到属性网格

    我尝试绑定通用集合列表联系方式 to propGrid但输出与我的预期不符 我想列表联系方式显示为ListBox in propGrid 我该怎么做 谢谢 class Contact public string Name get set p
  • 如何获取执行查询的表名? (蟒蛇/sqlite)

    我正在运行一个简单的查询并将结果转换为 json 我想动态地执行此操作 以便我可以使用一个函数来处理所有查询 query INSERT INTO Tests name start end VALUES params name start e
  • 如何使用项目的哈希值检查 HashSet 是否包含该项目?

    我想检查 HashSet 是否包含特定元素 我已经有了int元素的哈希码 但不是对元素本身的引用 是否可以在不迭代整个集合的情况下做到这一点 没有为什么 哈希码与对象之间没有一对一的映射 鸽子原理 Net HashSet Dictionar
  • 嵌套并行和折叠 for 循环之间有区别吗?

    我知道启用嵌套并行性将允许嵌套 omp 并行 for 循环也被并行化 但我在嵌套的 for 循环 for 内部 中使用塌陷 2 有区别吗 为什么或者为什么不 假设最好的情况 循环索引之间没有依赖性并且其他条件相同 是的 有很大的区别 使用c
  • Asp.net Core azure Web 应用程序日志记录

    我有一个 asp net core 部署到 azure 我正在尝试使用以下命令配置日志记录到我的应用程序Microsoft Extentions Logging接口 目前我的应用程序正在将日志写入网络应用程序存储中的日志文件文件夹 这似乎是
  • 如何为 React 路由设置 apache 服务器?

    我的 React 应用程序在本地开发服务器上运行良好 但当我将生产就绪文件直接转储到 Apache 的 htdocs 目录时 它不起作用 这是我所拥有的 var www index html var www bundle js 我有 Doc