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