I'm using the Predix UI seed and I'm trying to remove the # from the URL, so that
http://localhost:5000/#/dash
becomes
http://localhost:5000/dash
What's the best way to do this?
The seed-app.html page, which is where I thought I could configure the URL structure, has the following key elements
...
<!-- app route -->
<link rel="import" href="../../bower_components/app-route/app-location.html">
<link rel="import" href="../../bower_components/app-route/app-route.html">
...
<!-- px components -->
<link rel="import" href="../../bower_components/px-app-nav/px-app-nav.html">
<link rel="import" href="../../bower_components/px-view/px-view.html">
<!-- app-location captures url and assigns _route value -->
<app-location
id="carbonLocation"
route="{{_route}}"
use-hash-as-path>
</app-location>
<!-- /dashboards route and view -->
<app-route
route="[[_route]]"
pattern="/dashboards"
active="{{_dashboardsActive}}">
</app-route>
...
<script>
Polymer({
is: 'seed-app',
properties: {
routesActive: {
type: Boolean,
value: false
},
...
// Sets app default base URL for client-side routing
pathPrefix: {
type: String,
value: '#'
}
},
ready: function(){
this._checkForDefaultRoute();
},
_checkForDefaultRoute: function() {
// set default route to /dashboards
var l = window.location;
if((l.hash === "#/" || l.hash === "") && l.pathname === "/") {
l.hash = "/dashboards";
}
}
});
</script>
I removed the pathPrefix
pathPrefix: {
type: String,
value: ''
}
and changed the _checkForDefaultRoute function like so
_checkForDefaultRoute: function() {
// set default route to /runtime
var l = window.location;
if((l.hash==="") && l.pathname==="/"){
l.pathname="/login";
}
}
The result is that I still need to use # as a prefix to reach the pages.
Please see the answere to this question in the Predix Forum:
https://forum.predix.io/questions/18308/predix-ui-seed-app-remove-hash-from-url.html#answer-18365