子路由上的Zf2布局css和javascript路径无法解析

lum*_*ked 3 javascript css php zend-framework2

目前我正在尝试设置所有使用相同模板的段路由.目前,基本路线/我的仪表板视图使用布局.这适用于基本路线.但在尝试添加子段路由后,布局css和js路径不正确.我想在/ my-dashboard/ideas/my-dashboard/whatever/my-dashboard/whatever/update/777下的任何片段使用相同的布局,但只是使用不同的视图.并且布局为每个视图提供正确的css和js路径.

route.config.php

'dashboard' => array(
        'type' => 'literal',
        'options' => array(
            'route'    => '/my-dashboard',
            'defaults' => array(
                'controller' => 'dashboard',
                'action'     => 'dashboard',
            ),
        ),
        'may_terminate' => true,
            'child_routes' => array(
                'wahtever' => array(
                    'type'    => 'Segment',
                    'options' => array(
                        'route'    => '/ideas',
                        'defaults' => array(
                            'controller' => 'ideas',
                            'action'     => 'ideas',
                        ),
                    ),
                ),
            ),
    ),
Run Code Online (Sandbox Code Playgroud)

如果我转到/ my-dashboard,它将显示正确的视图,其中包含我想要用于任何这些路径的布局.如果我转到/ my-dashboard/ideas,路由会解析但是当在控制台中查看时,所有的css和js都被404搞砸了,但是找不到这样的东西.如果我在布局中添加../它将在嵌套路线上工作,但随后会搞砸/ my-dashboard路线.

module.config.php

'view_manager' => array(
    'template_map' => array(
        'layout/my-dashboard-layout' => __DIR__ . '/../view/layout/my-dashboard-layout.twig',
        'wmi/dashboard/dashboard'    => __DIR__ . '/../view/dashboard/dashboard.twig',
        'wmi/ideas/ideas'            => __DIR__ . '/../view/ideas/ideas.twig',
    )
),
Run Code Online (Sandbox Code Playgroud)

编辑以添加布局和视图.布局/我的仪表板,layout.twig

<!DOCTYPE html>
<html>

<head>
    <!-- Theme CSS -->
    <link rel="stylesheet" type="text/css" href="skin/default_skin/css/theme.css">

    <!-- Admin Panels CSS -->
    <link rel="stylesheet" type="text/css" href="admin-tools/admin-plugins/admin-panels/adminpanels.css">

    <!-- Admin Forms CSS -->
    <link rel="stylesheet" type="text/css" href="admin-tools/admin-forms/css/admin-forms.css">
    <!-- Favicon -->
    <link rel="shortcut icon" href="img/favicon.ico">
</head>
<body class="dashboard-page sb-l-o sb-r-c">
    <!-- Start: Content-Wrapper -->
    <section id="content_wrapper">
        {% block content %}{{ content|raw }}{% endblock content %}
    </section>
<!-- jQuery -->
<script type="text/javascript" src="js/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery_ui/jquery-ui.min.js"></script>

<!-- Bootstrap -->
<script type="text/javascript" src="js/bootstrap/bootstrap.min.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

所有的css和javascript路径都是我指的.在基础文字路线/我的仪表板上,布局和视图正确显示.虽然当你转到段部分/我的仪表板/想法时,你得到的404在浏览器控制台内找不到任何东西.

GET http://watch.dev/my-dashboard/skin/default_skin/css/theme.css 
GET http://watch.dev/my-dashboard/admin-tools/admin-plugins/admin-panels/adminpanels.css 
GET http://watch.dev/my-dashboard/admin-tools/admin-forms/css/admin-forms.css 
GET http://watch.dev/my-dashboard/img/avatars/2.jpg 
404 (Not Found) 
GET http://watch.dev/my-dashboard/js/jquery/jquery-1.11.1.min.js 
GET http://watch.dev/my-dashboard/js/bootstrap/holder.min.js
GET http://watch.dev/my-dashboard/components/circles/circles.js
GET http://watch.dev/my-dashboard/components/raphael/raphael.js
GET http://watch.dev/my-dashboard/js/jquery/jquery_ui/jquery-ui.min.js  
GET http://watch.dev/my-dashboard/components/highcharts/highcharts.js 
GET http://watch.dev/my-dashboard/js/bootstrap/bootstrap.min.js
GET http://watch.dev/my-dashboard/admin-tools/admin-plugins/admin-panels/adminpanels.css 
GET http://watch.dev/my-dashboard/admin-tools/admin-forms/css/admin-forms.css  
GET http://watch.dev/my-dashboard/img/avatars/2.jpg 
404 (Not Found) 
GET http://watch.dev/my-dashboard/js/jquery/jquery-1.11.1.min.js 
GET http://watch.dev/my-dashboard/js/bootstrap/holder.min.js  
GET http://watch.dev/my-dashboard/components/circles/circles.js  
GET http://watch.dev/my-dashboard/components/raphael/raphael.js  
GET http://watch.dev/my-dashboard/js/jquery/jquery_ui/jquery-ui.min.js  
GET http://watch.dev/my-dashboard/components/highcharts/highcharts.js  
GET http://watch.dev/my-dashboard/js/bootstrap/bootstrap.min.js 
404 (Not Found)
Run Code Online (Sandbox Code Playgroud)

思想/我-ideas.twig

{% extends "layout/my-dashboard-layout" %}

{% block content %}
{% endblock content %}
Run Code Online (Sandbox Code Playgroud)

任何帮助表示赞赏.404(未找到)

思想/我-ideas.twig

{% extends "layout/my-dashboard-layout" %}

{% block content %}
{% endblock content %}
Run Code Online (Sandbox Code Playgroud)

任何帮助表示赞赏.

Tim*_*ain 7

这不是ZF问题,因为CSS/JS请求甚至不应该触及PHP.因为您在布局中使用相对路径,所以浏览器正在加载相对于当前URL的CSS和JS文件.例如,当您在/my-dashboard/ideas页面上时,它正在尝试加载/my-dashboard/skin/default_skin/css/theme.css(这不是正确的URL).

要解决此问题,请始终在布局中使用绝对路径,例如:

<link rel="stylesheet" type="text/css" href="/skin/default_skin/css/theme.css">
Run Code Online (Sandbox Code Playgroud)

(注意href路径开头的初始斜杠).这可确保您的资产始终从文档根目录加载.