Miguel Fermin
Miguel Fermin

Reputation: 380

App Engine + Polymer.dart single page web app routing with hashbang

I'm creating a single page web app using polymer.dart and wants to deploy it on google app engine. I'm stack at routing

I'm using redstone and shelf_static for my server and route_hierarchical for my client.

bin/server.dart

import 'package:appengine/appengine.dart';

import 'package:redstone/server.dart' as app;
import 'package:shelf_static/shelf_static.dart';

main() {
  var staticHandler = createStaticHandler("web", 
      defaultDocument: "index.html", serveFilesOutsidePath: true);

  app.setShelfHandler(staticHandler);

  app.setupConsoleLog();
  app.setUp();

  runAppEngine(app.handleRequest);
}

lib/main_app/main_app.dart

import 'package:polymer/polymer.dart';

import 'package:route_hierarchical/client.dart';

@CustomTag('main-app')
class MainApp extends PolymerElement {
  final Router router = new Router();

  MainApp.created() : super.created();

  ready() {
    print("Main App: ready()");

    router.root
      ..addRoute(name: 'home', path: '/', enter: showHome, defaultRoute: true)
      ..addRoute(name: 'login', path: '/#!/login', enter: showLogin);

    router.listen();
  }

  void showHome(RouteEvent event) {
    print("Main App: showHome()");
  }

  void showLogin(RouteEvent event) {
    print("Main App: showLogin()");
  }
}

lib/main_app/main_app.html

web/index.html

Pages

If I run the app locally using "pub serve" command, it works.
However if i run it on appengine using "gcloud preview app run app.yaml" command, the login route isn't working and logs an error.
http://prntscr.com/77adww

Upvotes: 1

Views: 202

Answers (1)

Miguel Fermin
Miguel Fermin

Reputation: 380

I finally got it working! The problem was, I was running the untransformed output just like @Jake MacDonald said. here's how

replace

var staticHandler = createStaticHandler("web", defaultDocument: "index.html", serveFilesOutsidePath: true);

with

var staticHandler = createStaticHandler("build/web", defaultDocument: "index.html", serveFilesOutsidePath: true);

Upvotes: 1

Related Questions