我正在编写一个系统,其中前端使用 AngularJS,后端使用 Java 和 Jersey。
但我在使用 $locationProvider.html5Mode (true);
删除 url 中的“#”时遇到问题。
如果我单击页面上的链接,则会显示正确的 View 。但是,如果我在浏览器中按 F5 或复制并粘贴 URL,服务器会查找不存在的资源并说它不可用。
我无法在服务器上将链接重定向到 webapp 的入口点,例如此处请求的 https://docs.angularjs.org/guide/ $位置。
此外,我尝试按照他们在这里所说的关于 servlet 的方式进行操作 AngularJS HTML5 Mode - How do direct links work without server specific changes? ,但对我来说没有用。
有人知道如何让它工作吗?
在 NodeJS 中,它会使用 app.use ('/', express.static (__ dirname + '/public')) ;
。
下面是我使用的代码:
appRoutes.js
angular.module('appRoutes', [])
.config(
[ '$routeProvider', '$locationProvider',
function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl : 'views/home.html',
controller : 'HomeController'
})
.when('/login', {
templateUrl : 'views/login.html',
controller : 'LoginController'
}).otherwise({
redirectTo : '/'
});
$locationProvider.html5Mode(true);
} ])
.run(function($rootScope, $location, Login) {
$rootScope.$on("$locationChangeStart", function(event, next, current) {
if (!Login.isLogged()) {
$location.path('/login');
}
});
});
网络.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<welcome-file-list>
<welcome-file>index.html</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>Resources</servlet-name>
<servlet-class>org.glassfish.jersey.servlet.ServletContainer</servlet-class>
<init-param>
<param-name>jersey.config.server.provider.packages</param-name>
<param-value>sammubr.resources</param-value>
</init-param>
<init-param>
<param-name>jersey.config.server.provider.classnames</param-name>
<param-value>sammubr.filtro.FiltroSeguranca;org.glassfish.jersey.filter.LoggingFilter</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Resources</servlet-name>
<url-pattern>/api/*</url-pattern>
</servlet-mapping>
<servlet>
<servlet-name>Login</servlet-name>
<servlet-class>org.glassfish.jersey.servlet.ServletContainer</servlet-class>
<init-param>
<param-name>jersey.config.server.provider.packages</param-name>
<param-value>sammubr.authenticate</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>Login</servlet-name>
<url-pattern>/authenticate/*</url-pattern>
</servlet-mapping>
<servlet>
<servlet-name>Logout</servlet-name>
<servlet-class>org.glassfish.jersey.servlet.ServletContainer</servlet-class>
<init-param>
<param-name>jersey.config.server.provider.packages</param-name>
<param-value>sammubr.logout</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>Logout</servlet-name>
<url-pattern>/logout/*</url-pattern>
</servlet-mapping>
</web-app>
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<base href="/" />
<title>SampleApp</title>
<!-- CSS -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body ng-app="sampleApp" ng-controller="MainController">
<div class="container">
<!-- ANGULAR DYNAMIC CONTENT -->
<div ng-view></div>
</div>
<!-- ANGULARJS -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<script src="libs/angular-bootstrap/ui-bootstrap-tpls-0.11.0.min.js"></script>
<script src="libs/angular-route/angular-route.min.js"></script>
<script src="libs/angular-cookie/angular-cookies.min.js"></script>
<!-- CUSTOM JS -->
<script src="js/app.js"></script>
<script src="js/appRoutes.js"></script>
<script src="js/controllers/MainCtrl.js"></script>
<script src="js/controllers/HomeCtrl.js"></script>
<script src="js/controllers/LoginCtrl.js"></script>
<script src="js/services/LoginService.js"></script>
<script src="js/services/UsuarioService.js"></script>
<script src="js/services/UsuarioService.js"></script>
<script src="js/controllers/UsuarioListCtrl.js"></script>
<script src="js/controllers/UsuarioItemCtrl.js"></script>
</body>
</html>
最佳答案
尝试使用ocpsoft rewrite .
按照说明进行安装,然后使用您的入口点和 url 添加配置类。
@RewriteConfiguration
public class RewriteUrlConfigurationProvider extends HttpConfigurationProvider {
@Override
public Configuration getConfiguration(ServletContext servletContext) {
return ConfigurationBuilder.begin()
.addRule(Join.path("/registration").to("/index.html"))
.addRule(Join.path("/department/{id}").to("/index.html")).where("id").matches("[0-9]+");
}
@Override
public int priority() {
return 10;
}
}
关于java - HTML5 模式下的 AngularJS + Java,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25228911/