Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Remove /#/ from URL #71

Closed
tomasholderness opened this issue Dec 8, 2016 · 8 comments
Closed

Remove /#/ from URL #71

tomasholderness opened this issue Dec 8, 2016 · 8 comments
Assignees
@tomasholderness @ojha-url
Labels
bug
Milestone
Beta 1

Comments

@tomasholderness
Copy link
Contributor

No description provided.

@tomasholderness
Copy link
Contributor Author

References, looks like we'll need some support from @matthewberryman server side, I haven't completely got my head around how push state works.

(1) https://discoveraurelia.com/tutorials/supporting-pushstate-nice-urls/
(2) http://aurelia.io/hub.html#/doc/article/aurelia/router/latest/router-configuration/2

@matthewberryman
Copy link
Contributor

I have set up cloudfront for petabencana.id as per https://keita.blog/2015/11/24/hosting-a-single-page-app-on-s3-with-proper-urls/ to support this—it's currently being deployed (ETA in a few minutes from time of this comment). It's a bit of a hack, and means that 404 error handling in #57 needs to be done by aurelia.
@mgvarley is best placed to advise on push state and error handling. Also let me know if there's a better way of doing this in cloudfront.

@tomasholderness tomasholderness added this to the Beta 1 milestone Dec 8, 2016
@matthewberryman matthewberryman mentioned this issue Dec 9, 2016
Closed
@mgvarley
Copy link

mgvarley commented Dec 9, 2016 •
edited
Loading

Hi guys - you should be able to get this working using the advice here http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/cheat-sheet/7. So in the aurelia router:

  configureRouter(config) {
    ...
    config.options.pushState = true;
    config.options.root = '/';
    ...
    config.map([

Then in Cloudfront config you will need to redirect all 404s and 403s to /index.html and return status as 200. @matthewberryman I see you are just doing this for 404s currently however AWS is returning a 403 if you call something it does not know about e.g. https://petabencana.id/hello - I have amended the Cloudfront config for dev to do both, if this works OK you will need to do the same for the other Cloudfront dists

@mgvarley
Copy link

mgvarley commented Dec 9, 2016

Just tried this out locally with latest dev branch and can't seem to get it working, also included in index.html head section as advised in the docs. Not sure why this is not playing ball, will continue to investigate

@mgvarley
Copy link

mgvarley commented Dec 9, 2016

It looks like this approach does work however the code you have for routing is then overriding and putting the # back in. Suggest looking at <a route-href.. logic in aurelia for linking between pages. The change to index.html required to make this work is as follows:

<head>
<base href="/">
...
</head>

@tomasholderness
Copy link
Contributor Author

Fixed in ef36332

@matthewberryman
Copy link
Contributor

Reopening until I've made the corresponding 403 change in CF (soon)

@matthewberryman
Copy link
Contributor

Done in our prod environment (and @mgvarley had already made the change in dev as noted). Will take a few minutes for CF to pick up the change.

@matthewberryman matthewberryman mentioned this issue Jun 26, 2017
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@tomasholderness tomasholderness

@ojha-url ojha-url

Labels
bug
Projects
None yet
Milestone
Beta 1
Development

No branches or pull requests
4 participants
@tomasholderness @mgvarley @matthewberryman @ojha-url