早睡早起,方能养生
Sleep early rise early, way to keep healthy

ThinkPHP6项目与vue项目在一个网站目录时,路由冲突

super
2022-11-27 21:49
views 2930

版本:ThinkPHP6.1.0 (单应用)

 

伪静态:

 

location / {
	if (!-e $request_filename){
		rewrite  ^(.*)$  /index.php?s=$1  last;   break;
	}
}

 

PHP路由示例:

 

<?php
use think\facade\Route;

// 指标
Route::rule('get-tree-category', 'Category/getTreeList', 'POST');
Route::rule('get-sub-category', 'Category/getSubList', 'POST');

 

vue路由示例:

 

http://rongsp.com/login

 

若前后端分别使用两个站点不会有问题,当前后端使用同一个站点目录时(此时vue打包文件放在public目录下),因为ThinkPHP没有定义login路由,网站就会报错

 

 

解决办法:

 

1)定义ThinkPHP miss路由

 

<?php
use think\facade\Route;

// 分类
Route::rule('get-tree-category', 'Category/getTreeList', 'POST');
Route::rule('get-sub-category', 'Category/getSubList', 'POST');

// miss路由 兼容vue路由
Route::miss('h5/index');

 

简介:

 

 

2)在public下新增h5文件夹

 

将vue打包的代码文件放在h5目录下

 

 

3)安装模板引擎驱动(已安装可跳过)

 

composer require topthink/think-view

 

 

4)新增app/controller/H5控制器:

 

<?php
namespace app\controller;

use app\BaseController;
use think\facade\View;

class H5 extends BaseController
{
    public function index()
    {
        return View::fetch('index');
    }
}

 

5)新增app/view/h5/index.html文件:

 

将public/h5/index.html(vue打包)内容复制保存即可

 

6)前端文件更新

 

① 将除去index.html静态文件夹全部放入public/h5/文件夹下

② 将index.html放到app/view/h5/文件夹下

 

7)访问

 

前端:

 

http://域名/h5/

 

login路由访问:

 

http://域名/h5/login

 

http://域名/login

 

以上均可访问

 

注意:vue路由与ThinkPHP路由不能定义相同的名称

 



分享
0 条讨论
top