My web application is built using Spring, Angular, and Rest. I successfully removed the hashtag from the URL by implementing the following code:
if(window.history && window.history.pushState) {
$locationProvider.html5Mode(true);
}
in index.html
<base href="/webapptest/">
Now, the home page looks good and everything is working perfectly. The URL appears like this:
http://localhost:8080/webapptest/The issue arises when I try to navigate to the second page after removing the hashtag, causing a 404 error upon reloading. I suspect it may be a server-side problem due to changing the URL structure, but I'm unsure about what needs to be adjusted.
This is my Spring Controller:
@RestController
@RequestMapping(value="api/files")
public class FileController {
@RequestMapping( method = RequestMethod.GET)
public @ResponseBody() String getFile(HttpServletRequest request) throws IOException {
String htmlString = "";
try {....
...
return htmlString;
}
The same controller and method are used for both the homepage and page2. Any suggestions on how to resolve the issue of reloading the page without the hashtag?
app.js :
uploadFile.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider) {
$routeProvider
.when('/', {
templateUrl : 'resources/html/home.html',
controller : 'uploadFileController'
})
.when('/page2', {
templateUrl : 'resources/html/page2.html',
controller : 'uploadFileControllerAdmin'
})
.otherwise({
redirectTo: '/'
});
if(window.history && window.history.pushState) {
$locationProvider.html5Mode(true);
}
}])