Vue路由器托管在apache2上

jgzswidk 于 2022-11-16 发布在 Apache

关注(0)|答案(5)|浏览(138)

我在apache服务器上托管我的vuejs项目。
1.初始化项目
1.设置路由器
1.构建并托管到Apache服务器

const router = new VueRouter({
  routes: Routes,
  // relative: true,
  mode: 'history'
});

这在本地运行良好，但vue路由器在服务器上中断。示例
如果我运行http://example.com并转到http://exmaple.com/sub，则运行正常
但是如果我刷新页面它会抛出404错误。
错误：

apache

来源：https://stackoverflow.com/questions/47879936/vue-router-hosting-on-apache2

5条答案

按热度按时间

mbjcgjjk1#

从vue.js documentation page：
当使用历史模式时，URL看起来会“正常”，例如http://oursite.com/user/id。漂亮！
不过，这里出现了一个问题：由于我们的应用是单页客户端应用，如果没有正确的服务器配置，用户在浏览器中直接访问http://oursite.com/user/id时会收到404错误。
不要担心：要解决这个问题，您需要做的就是在服务器上添加一个简单的全覆盖回退路由。如果URL与任何静态资产都不匹配，它应该服务于您的应用所在的index.html页面。
Apache

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

赞(0）回复(0）举报 2022-11-16

5lhxktic2#

这对我很有效，因为我的SPA在一个子文件夹中。把这个写在**.htaccess**文件中。

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

网站文件夹：C：\xampp\htdocs\距离

.htaccess文件发布：C：\xampp\htdocs\远端.htaccess

制作人员：https://gist.github.com/Prezens/f99fd28124b5557eb16816229391afee

赞(0）回复(0）举报 2022-11-16

cxfofazt3#

嗨，我的朋友，如果你正在使用Linux操作系统，走这条路线：/etc/apache2/sites-enabled/000-default.conf并添加以下代码：

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

赞(0）回复(0）举报 2022-11-16

b1zrtrql4#

这似乎不是你的问题，它的apache.htaccess问题，我猜，你的本地可能有该文件，你的服务器没有它。
请检查一下，你也上传了**.htaccess到你的服务器作为它的隐藏文件，你可能忘记上传它。
如果没有，您可以查看以下参考帮助：https://router.vuejs.org/en/essentials/history-mode.html
并添加您自己.htaccess**文件（如果没有）。

赞(0）回复(0）举报 2022-11-16

iezvtpos5#

从Apache 2.2.16开始，mod_rewrite不再是必需的，只需在<Directory>或<VirtualHost>配置下使用FallbackResource即可。