Here's my main.dart:
import 'dart:html';
import 'package:route/client.dart';
import 'urls.dart';
void main() {
var router = new Router()
..addHandler(homeUrl, showHome)
..addHandler(galleryurl, showGallery)
..listen();
HttpRequest.getString("home.html").then((html){
querySelector("#container").innerHtml = html;
});
}
void showHome(String path){
HttpRequest.getString("home.html").then((html){
querySelector("#container").innerHtml = html;
});
}
void showGallery(String path){
HttpRequest.getString("gallery.html").then((html){
querySelector("#container").innerHtml = html;
});
}
urls.dart:
library urls;
import 'package:route/url_pattern.dart';
final homeUrl = new UrlPattern(r'(.*)/');
final homeUrlWithFile = new UrlPattern(r'(.*)/index.html');
final contacturl = new UrlPattern(r'(.*)/contact');
final galleryurl = new UrlPattern(r'(.*)/gallery');
final allUrls = [homeUrl, contacturl, galleryurl];
and my body in index.html:
<body>
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="/">Home</a></li>
<li><a href="/gallery">Gallery</a></li>
</ul>
</div>
</div>
</nav>
<main id="container">
</main>
<footer class="footer" >
<div class="col-md-10 col-md-offset-1 col-sm-12">here's footer</div>
</footer>
<script src="packages\jquery_for_pub\1.11.0\jquery-1.11.0.min.js"></script>
<script src="packages/bootstrap/js/bootstrap.js"></script>
<script type="application/dart" src="main.dart"></script>
<script data-pub-inline src="packages/browser/dart.js"></script>
</body>
my problem is when i go to localhost:8080/gallery , i got error 404. but if i open localhost:8080 and click on gallery link, it works.
i want to redirect it to index.html and the #container's content changed to gallery when it opened in localhost:8080/gallery. thanks for the help
If you use pushState (default) you need server support to redirect a request to the correct URL. This is often delegated to nginx for example.
Alternatively you can disable pushState and use fragments instead