使用AngularJS HTML5模式的Spring Boot

Question

我用Spring Boot启动我的Web应用程序。它使用一个简单的主类来启动嵌入式tomcat服务器：

@Configuration
@EnableAutoConfiguration
@ComponentScan
public class Application {

    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);
    }

}

我想配置服务器的方式，他可以处理angularjs HTML5模式，将激活与

$locationProvider.html5Mode(true);

其他用户的相关帖子显示，您需要重定向到根目录。html5模式从url中删除hashbag。如果你刷新页面，服务器找不到页面，因为他没有处理散列。请参阅：AngularJS-为什么更改url地址时$routeProvider似乎不起作用，而我遇到了404错误

Answer 1

我找到了一个我能接受的解决方案。

@Controller
public class ViewController {

    @RequestMapping("/")
    public String index() {
        return "index";
    }

    @RequestMapping("/app/**")
    public String app() {
        return "index";
    }
}

angularjs应用程序必须位于子域应用程序下。如果你不想，你可以创建一个类似子域的应用程序。子域。映射到你的子域应用的com。有了这个结构，你就不会与WebJAR、statis内容等产生冲突。

Answer 2

我也有同样的问题。据我所知，在html5模式下，angularjs不解析哈希，而是输入url或通过pushState添加的url。

问题是PathResourceResolver映射目录，而不是文件。因为它打算从目录中服务请求的html" target="_blank">文件，而不是重写网址。对于应用程序来说，这是意味着，如果你刷新浏览器窗口或像http://example.com/mystate一样键入网址，它会从服务器查询“/mystate”。如果Spring不知道网址，他们会返回404。解决方案之一是将每一个可能的状态映射到index.html，就像这里一样（来源，顺便说一句，看看webjars——太棒了！）。但在我的情况下，我可以安全地将 "/**" 映射到index.html，因此我的解决方案是覆盖PathResourceResolver#getResources：

@Configuration
@EnableConfigurationProperties({ ResourceProperties.class })
public class WebMvcConfig extends WebMvcConfigurerAdapter {

    @Autowired
    private ResourceProperties resourceProperties = new ResourceProperties();

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        Integer cachePeriod = resourceProperties.getCachePeriod();

        registry.addResourceHandler("/static/**")
                .addResourceLocations("classpath:/static/")
                .setCachePeriod(cachePeriod);

        registry.addResourceHandler("/**")
                .addResourceLocations("classpath:/static/index.html")
                .setCachePeriod(cachePeriod).resourceChain(true)
                .addResolver(new PathResourceResolver() {
                    @Override
                    protected Resource getResource(String resourcePath,
                            Resource location) throws IOException {
                        return location.exists() && location.isReadable() ? location
                                : null;
                    }
                });
    }
}

Answer 3

使用此控制器将URI转发到index.html以保存AngularJS路由。源https://spring.io/blog/2015/05/13/modularizing-the-client-angular-js-and-spring-security-part-vii

@Controller
public class ForwardController {

    @RequestMapping(value = "/**/{[path:[^\\.]*}")
    public String redirect() {
        // Forward to home page so that route is preserved.
        return "forward:/";
    }
} 

在这个解决方案中，ForwardController只转发路径，这些路径在任何其他Controller或RestController中都没有定义。这意味着如果你已经：

@RestController
public class OffersController {

    @RequestMapping(value = "api/offers")
    public Page<OfferDTO> getOffers(@RequestParam("page") int page) {
        return offerService.findPaginated(page, 10);
    }
} 

两个控制器都将正常工作-@RequestMapping（value=“api/offers”）在@RequestMapping（value=“/**/{[path:[^\\.]*}”）之前被检查