Spring控制器返回页面的路径——相对还是绝对？答案

【问题标题】：Path of Spring controller return page -- relative or absolute?Spring控制器返回页面的路径——相对还是绝对？
【发布时间】：2014-08-27 12:19:53
【问题描述】：

我正在使用 Spring 4.0.3 来设置我的 Web 应用程序，并且我的控制器在访问主页时返回“main”。但是，有时当我使用“主”页面并刷新它时，我会看到“主”在“主”之上，为什么会发生这种情况？更清楚地说，例如当前页面是“www.sitename.com/main”，我刷新浏览器，然后我得到“www.sitename.com/mainmain”。

@RequestMapping(value="/main*")
    public String getMainBoard(HttpServletRequest request, HttpServletResponse response, Model model) {

        Person myProfile = Actions.myProfile();
        if(!Actions.isLogin() || myProfile == null) {
            return "login";
        }

        model.addAttribute("profileImage", myProfile.getImage().getUrl());
        model.addAttribute("profileDisplayName", myProfile.getDisplayName());
        int internalUserID = retrieveInternalUserID(myProfile.getId());
        List<CategoryNoneItem> categoryItems = retrieveCategoryItemsWithUserID(internalUserID);
        model.addAttribute("categoryItems", categoryItems);
        storeDB(myProfile);

        return "main";
    }

主页代码如下

<jsp:directive.page contentType="text/html; charset=UTF-8"></jsp:directive.page>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html, charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="" />
    <meta name="author" content="BL" />

    <title>CategoryBags</title>

    <!--One solution for static resources solver at http://stackoverflow.com/questions/20789496/spring-access-to-static-resources
    to use jstl c:url to generate a base -->
    <link href="http://localhost:8080/backend/res/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="http://localhost:8080/backend/res/css/bootstrap-theme.min.css" rel="stylesheet" />
    <link href="http://localhost:8080/backend/res/css/bootstrap-responsive.min.css" rel="stylesheet" />
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://localhost:8080/backend/res/js/bootstrap.min.js"></script>
    <style type="text/css">
        .socials {
        padding: 10px;
        }

        body {
            padding-top: 60px;
            padding-botton:40px;
        }

        .sidebar-nav {
            padding:9px 0;
        }

        div.panel-heading {
            word-wrap: break-word;
        }

        div.panel-body {
            word-wrap: break-word;
        }
    </style>
    <script>
        $(document).on('hidden.bs.modal', '.modal', function() {
            console.log('closed');
            $('#title').val("");
            $('#content').val("");
            $(this).find("input").val("");
            $(this).find("textarea").val("");
        });
    </script>
</head>

<body>

<div>
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="navbar-inner">
            <div class="container-fluid">
                <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>
                <a class="navbar-brand pull-left" href="/">CategoryBags </a>
                <form class="navbar-form navbar-left">
                    <input type="text" class="search-query" placeholder="Search" />
                </form>
                <ul class="nav navbar-nav navbar-right">
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Help Info<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">About us</a></li>
                            <li class="divider"></li>
                            <li><a href="#">Contact us</a></li>
                        </ul>
                    </li>
                </ul>

                <!-- ul class="nav navbar-nav navbar-right">
                    <li><img th:src="${profileImage}"></img></li>
                </ul-->

                <ul class="nav navbar-nav navbar-right">
                    <li><img src="https://lh6.googleusercontent.com/-4TQofbWwlp8/AAAAAAAAAAI/AAAAAAAAAgQ/ohPwyL5zD2M/photo.jpg?sz=50" /></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Bing Lan</a>
                        <ul class="dropdown-menu">
                            <li><a href="javascript:void(0)" onclick="logOut()">Log Out</a></li>
                        </ul>
                    </li>
                </ul>

            </div>
        </div>
    </div>
</div>

<div class="container-fluid">
    <div class="row">
        <div class="span4">
            <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#addNew" role="button">
                <span class="glyphicon glyphicon-plus">Add</span>
            </button>
            <div class="modal fade" id="addNew" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title" id="myModalLabel">Record something useful for you</h4>
                        </div>
                        <div class="modal-body">
                            <form class="form-horizontal" id="newItem" method="POST" acceptcharset="UTF-8">
                                <div class="form-group">
                                    <label class="control-label col-md-2">Title</label>
                                    <div class="col-md-8">
                                        <input type="text" class="form-control" id="title" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-2">Content</label>
                                    <div class="col-md-8">
                                        <textarea rows="10" class="form-control" id="content"></textarea>
                                    </div>
                                </div>
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox">Study</input>
                                    </label>
                                </div>
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox">Life</input>
                                    </label>
                                </div>
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox">Sports</input>
                                    </label>
                                </div>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            <button type="button" class="btn btn-primary" id="NewItemModalSubmit">Save changes</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript"> 
  function logOut() {
        var currentLocation = window.location;
        console.log('current location ', currentLocation);
        $.ajax({
            type: 'POST',
            url: 'http://localhost:8080/backend/logout',
            contentType: 'application/octet-stream; charset=utf-8',
            success: function(result) {
                window.location = 'http://localhost:8080/backend/';
            }
        });
    };

    function deleteCategoryNoneItem(itemID) {
        $.ajax({
            type : 'POST',
            url : 'http://localhost:8080/backend/deletecategorynoneitem',
            contentType : 'application/octet-stream; charset=utf-8',
            data : {
                ID : itemID
            },
            success: function(result) {
                window.location.href = "http://localhost:8080/backend/main";
            }
        });
    };

    function modifyCategoryNoneItem(itemID) {
        console.log('enter modifyCategoryNoneItem()');
        console.log("title is ", $("#title" + itemID).val());
        $.ajax({
            type : 'POST',
            url : 'http://localhost:8080/backend/modifycategorynoneitem',
            contentType : 'application/octet-stream; charset=utf-8',
            data : {
                ID : itemID,
                title: $("#title" + itemID).val(),
                content: $("#content" + itemID).val()
            },
            success: function(result) {
                window.location.href = "http://localhost:8080/backend/main";
            }
        });
    };

    $(document).ready(function() {
        $('#NewItemModalSubmit').click(function() {
            if($("#title").val() || $("#content").val())
            {
                $.ajax({
                    type : "POST",
                    url : "http://localhost:8080/backend/addnew",
                    contentType: 'application/octet-stream; charset=utf-8',
                    data : {
                        title: $("#title").val(),
                        content: $("#content").val()
                    },
                    success: function(result) {
                        $("#addNew").modal('toggle');
                        window.location.href = "http://localhost:8080/backend/main";
                    }
                });
            }
            else
                $("#addNew").modal('toggle');

        });

        $('#NewItemModalClose').click(function() {
            console.log('NewItemModalClose button clicked.');
            console.log('title field is ', document.getElementById("title").value);
            document.getElementById("title").innerHTML = "";
            console.log('title field is ', document.getElementById("title").value);
            document.getElementById("content").innerHTML = "";
            $("#addNew").modal('toggle');           
        });
    });

</script>
</body>

</html>

【问题讨论】：

return "main"; 在现有 URL 的末尾添加 main。改用return "redirect:main";

标签： html spring jakarta-ee spring-mvc servlets

【解决方案1】：

您的控制器映射@RequestMapping(value="/main*") 将监听所有以/main 结尾的GET 调用，后跟任何文本，例如/main、/mainmain、/mainSometext

最后，您有一个 return "main"，它只会在现有 URL 的末尾添加一个 main，并尝试获取映射到该 URL 的网页。

以您描述的示例为例，如果当前页面为www.sitename.com/main，则刷新将导致调用此控制器映射，并且正如预期的那样，将在 URL 末尾添加一个main，为您提供 www.sitename.com/ mainmain，我猜这会导致 404 错误（假设您没有mainmain 的页面或控制器映射）。

在这种情况下，您应该尝试使用return "redirect:main";。

当使用/ 指定时，Spring 映射是绝对从上下文路径开始的。例如，@RequestMapping(value="/user/login") 将映射到上下文路径中以 /user/login 开头的页面，即 htpp://localhost:8080/user/login 或 http://www.example.com/user/login。

【讨论】：