4

I have been trying to figure this out off and on for a few days now and everything I have read on the internet says that it should just work. My app routing works just fine as long as I am in the app, but when I try to copy and paste a url it loses its state and redirects to home.

* edit I am starting to think it is because app.yaml is handling the "serve up index.html no matter what", it seems like whatever app.yaml does it strips information away and thats why $state has a url of "" edit *

I have my server configured to return index.html no matter what the url so it is getting to the routing logic with the url I pasted still in the browser bar. When I put a breakpoint in the run block where I inject $state and $stateParams it shows the current url is "", when it gets to the config block with my routes it goes to the .otherwise('/') and redirects me to the start of the app.

app.run([
    '$rootScope', '$state', '$stateParams', function($rootScope, $state, $stateParams){
        $rootScope.$state = $state;
        $rootScope.$stateParams = $stateParams;
        console.log($rootScope);
}])

.config([
'$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider){
    $locationProvider.html5Mode(true);
    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            url: '/',
            templateUrl: 'app/layout/home.html',
            controller: function($stateParams){
                debugger;
            }
        })
        .state('other', {
             url: '/{abc:[a|b|c|d]}',
             templateUrl: 'app/layout/other.html'
         });
}]);

Here is my app.yaml

application: app
version: 1
runtime: python27
api_version: 1
threadsafe: no

handlers:
- url: /(.*\.(gif|png|jpg|ico|js|css|html))
  static_files: \1
  upload: (.*\.(gif|png|jpg|ico|js|css|html))

- url: /robots.txt
  static_files: robots.txt
  upload: robots.txt 

- url: .*
   static_files: index.html
   upload: index.html //I am relying on this as a fallback for any 404's, it seems to work

skip_files:
- ^(.*/)?#.*#$
- ^(.*/)?.*~$
- ^(.*/)?.*\.py[co]$
- ^(.*/)?.*/RCS/.*$
- ^(.*/)?\..*$
- node_modules/*
- grunt/*
- Gruntfile.js
- less/*
- lib/*

Here is my main.py it is just the default that google gives you

import os
from google.appengine.ext import webapp
from google.appengine.ext.webapp import util
from google.appengine.ext.webapp import template

class MainHandler(webapp.RequestHandler):
  def get (self, q):
    if q is None:
      q = 'index.html'

    path = os.path.join (os.path.dirname (__file__), q)
    self.response.headers ['Content-Type'] = 'text/html'
    self.response.out.write (template.render (path, {}))

def main ():
  application = webapp.WSGIApplication ([('/(.*html)?', MainHandler)],     debug=True)
  util.run_wsgi_app (application)

if __name__ == '__main__':
  main ()

So when I go to localhost:8000 I get to the home page just fine. I click a link to go to other and I end up at localhost:8000/a or /b etc. If I copy and paste that link into another tab I end up at localhost:8000. I put breakpoints in the run and config block and the url hasn't changed by the time it gets there, so I am 90% sure its not the servers problem, but I have no idea what it could be. I did have the issue before where I would go to /a and it would return an error cannot get /a. So I fixed that with the serve up index all the time change, which is why I am fairly confident I set up the server correctly.

As far as I can tell from all my research this should just work without any configuration other than this on the angular side. Also like I said I can navigate within my app just fine, so it seems like my states are set up correctly.

Only SO questions I could find with similar problems did not seem to apply unless I'm missing something. 1 is about the serve up index issue I fixed and the other he was missing a '/' which I don't think I am.

How can I go directly to a state with ui-router without first navigating to index.html

Can't navigate to ui-router state with URL

Community
  • 1
  • 1
Kevin F
  • 2,836
  • 2
  • 16
  • 21

1 Answers1

1

In case anyone is wondering the issue was the regex format is messed up

//this is wrong
url: '/{abc:[a|b|c|d]}'

//this is right
url: '/{abc:a|b|c|d}'

I'm thinking it was working fine internally because I have the ui-sref bound to the state and when I tried to copy and paste a url it was relying on matching the url. Either way its finally working

Kevin F
  • 2,836
  • 2
  • 16
  • 21