Question

最近，我使用Thymeleaf作为模板引擎，开始了一个Spring启动项目。后端和前端是分开的，ajax用于通过一组RESTful服务获取和发布数据，例如/dog/1024，这是javascript中的硬编码。这个项目是在spring boot的嵌入式tomcat下运行的。

一切正常，直到将其部署到tomcat服务器。在tomcat中，此项目部署在类似子目录的URL下，例如http://host/zoo，因此上面的RESTful服务应该是/zoo/dog/1024。 HTML中的网址可以由th:src，th:href呈现，而javascript中的网址则不会呈现，而javascript中的错误链接会导致所有内容崩溃。同样的问题发生在css文件中，其中显示了背景图片URL。

我们有几个解决方案：

产地：

我的api.js文件如下：

var Api = {
    Dog: {
        page_url: '/dog/page',
        create_url: '/dog/create',
        update_url: '/dog/update',
        create: function(dog) {
            // post dog entity to create_url
        },
        update: function(dog) {
            // post dog entity to update_url
        }
    },
}

这样它就可以在像Api.Dog.create(dog)这样的地方使用。

解决方案0：

每次服务器URL结构更改时手动更改URL。

解决方案1：

添加一个服务，比如/resources/api.js，由Thymeleaf生成一个javascript文件，对css文件做同样的事情。

解决方案2：

将所有网址解压缩为HTML片段中的内联javascript / css，以包含片段而不是引用外部文件。

似乎解决方案1对于HTTP缓存来说是最干净和最友好的，但这样做是否是一个好习惯？

或者是否有更好的解决方案？

Answer 1

没有javascript不需要知道服务器URL更改它应该解耦。

您可以使用base tag指定子目录并使用路径的相对URL。我建议这是你的解决方案3。以下是有关我们如何在节点中进行此操作的扩展信息，但也许您可以在春季实现相同的目标。

如果你有类似预构建步骤的东西，这种方法很好。

目前在我们的节点项目中，我们保留一个manifest.json，其中包含所有配置，如服务器路径，名称，库的源路径等。，

{＆＃39; path＆＃39;：{ ＆＃39;目录＆＃39;：＆＃39; / zoo＆＃39;，＆＃39; fallbackpath＆＃39;：＆＃39; / src＆＃39; } } //这也可以来自env变量

我们在index.html模板中使用baseurl的占位符。

<base href=%path.directory% target="_blank">

我们在部署时使用gulp string replace替换href，读取配置。应用程序内部的所有资产和REST调用都将保持相对，而不是绝对的URL。

这样客户端就不会知道部署更改。这也增加了保持开发团队的工作不受开发人员更改域等工作影响的好处。

如果spring将服务器路径存储为变量，那么也许你可以直接将它连接到Thymeleaf，你的工作将减少一半。

应该呈现javascript文件以适应服务器URL的变化吗？

产地：

解决方案0：

解决方案1：

解决方案2：

1 个答案: