Nginx上的历史记录模式的Vue路由器服务器配置不起作用 [英] Vue router server configuration for history mode on nginx does not work
问题描述
我从 vue路由器文档中阅读了以下说明
I read the following note from vue router documentation
注意:使用历史记录模式时,需要正确配置服务器,以便用户直接访问您网站上的深层链接 没有404.
Note: when using the history mode, the server needs to be properly configured so that a user directly visiting a deep link on your site doesn't get a 404.
所以,我尝试像下面这样配置nginx
So, I try to configure my nginx like the following
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /var/www/laravel/public/;
index index.php index.html index.htm;
server_name working.dev;
location /user {
rewrite ^(.+)$ /index.php last;
}
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location ~ \.php$ {
try_files $uri /index.php =404;
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass unix:/var/run/php5-fpm.sock;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
include fastcgi_params;
}
}
以下是我的Vue配置
var router = new VueRouter({
hashbang: false,
history: true,
linkActiveClass: "active",
root: '/user'
});
但是,当用户直接访问我网站中的深层链接时,我仍然得到404.
But, I still got 404 when user directly visiting a deep link in my site.
已编辑:我也使用Laravel路由.以下是我的Laravel路由.
Edited: I use Laravel routing too. The Following is my laravel routing.
Route::get('user', function() {
return View::make('user.index');
});
推荐答案
I just read mattstauffer blog post and finally found way to do in Laravel route. Like the following
Route::get('user/{vue_capture?}', function() {
return View::make('user.index');
})->where('vue_capture', '[\/\w\.-]*');
当用户直接访问网站的深层链接时,它不会返回404.
It does not return 404 when user directly visiting a deep link to site.
这篇关于Nginx上的历史记录模式的Vue路由器服务器配置不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!