Tomcat、Grunt 构建
Tomcat, Grunt build
我正在为我的 angular js 应用程序使用 grunt,并为我的服务器端使用 tomcat。
只要需要,在开发环境中,我运行 Grunt build,获取 dist 文件夹并将其放入 tomcat webapp 文件夹中。
但是,我有一个奇怪的问题。仅当我从 HTML 页面单击它们时,应用程序中的 URL 才有效。
例如如果我输入 http://localhost:8080/upload
- 我会得到 404 page not found error
,但是如果从索引页面 - http://localhost:8080
,我点击页面中的 link 导致上传它工作正常。
可能是什么问题?
如果我在 node.js 上运行应用程序,link 可以完美运行!只是 Tomcat 它没有按预期工作。
已编辑
我在 angular js
中这样定义 url
angular.module('angularjsApp')
.config(function ($stateProvider) {
$stateProvider
.state('upload', {
url: '/upload',
templateUrl: 'app/upload/upload.html',
controller: 'UploadCtrl'
});
});
这些链接是真正的标准 HTML 链接吗?如果 Tomcat 没有回答 http://localhost:8080/upload
,那么它可能不是 GET
请求。
为了通过 AngularJs 服务器然后在域后添加 /#/
并确保 html5 模式默认启用是 false
($locationProvider.html5mode
)。下面是您的应用程序从客户端站点提供内容的示例(angular-js)
http://localhost:8080/#/upload
您 angular 设置其使用历史推送状态进行导航的方式,更改浏览器的 URL 而实际上不会导致浏览器从后端重新获取其内容。
因此在浏览器中使用推送状态 angular 可以很好地导航,但是当请求实际发送到服务器时,它会响应 404,因为你没有任何东西可以为你的 HTML 服务。
有两种解决方法:
- 改用#!网址,以便您始终从服务器获得相同的 URL(请参阅其他答案)。
- 更新您的服务器以便为所有路径提供相同的静态 HTML(此答案)。
您需要发回初始 HTML 内容的 servlet 才能对所有路由执行此操作 - 因此映射到 /*
而不仅仅是 /
所以它总是给出任何路径 returns同HTML.
所以您的 web.xml 有一个看起来像这样的正在返回的 servlet:
<servlet>
<servlet-name>StaticHtmlServlet</servlet-name>
<servlet-class>com.example.StaticHtmlServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>StaticHtmlServlet</servlet-name>
<url-pattern>/</url-pattern>
<url-pattern>/*</url-pattern> <!-- so this is what's added -->
</servlet-mapping>
我正在为我的 angular js 应用程序使用 grunt,并为我的服务器端使用 tomcat。
只要需要,在开发环境中,我运行 Grunt build,获取 dist 文件夹并将其放入 tomcat webapp 文件夹中。
但是,我有一个奇怪的问题。仅当我从 HTML 页面单击它们时,应用程序中的 URL 才有效。
例如如果我输入 http://localhost:8080/upload
- 我会得到 404 page not found error
,但是如果从索引页面 - http://localhost:8080
,我点击页面中的 link 导致上传它工作正常。
可能是什么问题?
如果我在 node.js 上运行应用程序,link 可以完美运行!只是 Tomcat 它没有按预期工作。
已编辑
我在 angular js
中这样定义 urlangular.module('angularjsApp')
.config(function ($stateProvider) {
$stateProvider
.state('upload', {
url: '/upload',
templateUrl: 'app/upload/upload.html',
controller: 'UploadCtrl'
});
});
这些链接是真正的标准 HTML 链接吗?如果 Tomcat 没有回答 http://localhost:8080/upload
,那么它可能不是 GET
请求。
为了通过 AngularJs 服务器然后在域后添加 /#/
并确保 html5 模式默认启用是 false
($locationProvider.html5mode
)。下面是您的应用程序从客户端站点提供内容的示例(angular-js)
http://localhost:8080/#/upload
您 angular 设置其使用历史推送状态进行导航的方式,更改浏览器的 URL 而实际上不会导致浏览器从后端重新获取其内容。
因此在浏览器中使用推送状态 angular 可以很好地导航,但是当请求实际发送到服务器时,它会响应 404,因为你没有任何东西可以为你的 HTML 服务。
有两种解决方法:
- 改用#!网址,以便您始终从服务器获得相同的 URL(请参阅其他答案)。
- 更新您的服务器以便为所有路径提供相同的静态 HTML(此答案)。
您需要发回初始 HTML 内容的 servlet 才能对所有路由执行此操作 - 因此映射到 /*
而不仅仅是 /
所以它总是给出任何路径 returns同HTML.
所以您的 web.xml 有一个看起来像这样的正在返回的 servlet:
<servlet>
<servlet-name>StaticHtmlServlet</servlet-name>
<servlet-class>com.example.StaticHtmlServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>StaticHtmlServlet</servlet-name>
<url-pattern>/</url-pattern>
<url-pattern>/*</url-pattern> <!-- so this is what's added -->
</servlet-mapping>