我捆绑了我的一个项目,它工作得很好。但是,当在路由/about上单击刷新时,它会显示请求的/about未在此服务器上找到。然而,当我在本地主机上的web服务器上运行时,它在刷新和前进/后退按钮上运行良好。我正在使用react-router进行客户端路由。
这里是客户端路由,但我怀疑这是问题所在
Router.run(routes, Router.HistoryLocation, function (Handler) {
React.render(<Handler/>, app);
});
我的路线就在那里:
let routes = (
<Route>
<Route name = "App" path="/" handler = {App}>
<Route name="About" path="/about" handler = {About}/>
<DefaultRoute name="Projects" handler = {Projects}/>
</Route>
</Route>
);
这就是我认为我打破了的:
<Directory /var/www/>
# This directive allows us to have apache2's default start page
# in /apache2-default/, but still have / go to the right place
Require all granted
#RedirectMatch ^/$ /apache2-default/
</Directory>
kkotwal.me.conf:
<VirtualHost *:80>
# The ServerName directive sets the request scheme, hostname and port that
# the server uses to identify itself. This is used when creating
# redirection URLs. In the context of virtual hosts, the ServerName
# specifies what hostname must appear in the request's Host: header to
# match this virtual host. For the default virtual host (this file) this
# value is not decisive as it is used as a last resort host regardless.
# However, you must set it for any further virtual host explicitly.
#
ServerName kkotwal.me
ServerAlias www.kkotwal.me
ServerAdmin webmaster@localhost
DocumentRoot /var/www/kkotwal.me/public_html
# Available loglevels: trace8, ..., trace1, debug, info, notice, warn,
# error, crit, alert, emerg.
# It is also possible to configure the loglevel for particular
# modules, e.g.
#LogLevel info ssl:warn
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>
发布于 2015-08-22 07:51:50
嘿,这实际上是一件很常见的事情。
实际情况是,您需要让您的apache服务器忽略任何嵌套路径,而只是将所有请求/*
发送到根目录。这样,您的前端javascript就可以在客户端拾取路由并显示正确的视图。
在不同的This服务器中,这有时被称为"HTML5模式“。
在apache中,执行此操作的方法是添加如下规则:
RewriteEngine On
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
RewriteRule ^ /index.html [L]
这样做的目的是告诉Apache为任何存在的文件提供服务,但如果它们不存在,则只提供/index.html
,而不是404not found。
发布于 2018-02-21 18:24:20
在laravel的情况下,您需要呈现为react文件写入所有路由的相同视图。Laravel路由写成:
=>::get(‘{url}’,function () { return view(‘欢迎’);})->where('url‘.*');
欢迎刀片文件是:
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel</title>
<link href="{{asset('css/app.css')}}" rel="stylesheet" type="text/css">
</head>
<body>
<div id="root"></div>
<script src="{{asset('js/app.js')}}" ></script>
</body>
</html>
路由的app.js文件
<Route>
<Route name = "App" path="/" handler = {App}>
<Route name="About" path="/about" handler = {About}/>
<DefaultRoute name="Projects" handler = {Projects}/>
</Route>
因此,每次刷新about路由时,它都会在app.js文件中显示欢迎刀片及其各自的路由
https://stackoverflow.com/questions/32150653
复制相似问题