AngularJS html5mode

[kylegillen]

Hi

I can't figure out how (if it's possible) to use browser refreshing when using Codekit & HTML5mode.

Unless I manually add in a # at the root path & refresh the browser with the amended URL I always get a 404.

I was wondering if anyone had been able to get it working?

As an addendum, doing this with Apache requires the following in an .htaccess file:

Options +FollowSymLinks

<ifModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !index
    RewriteRule (.*) index.html [L]
</ifModule>

[bdkjones]

Yea, this is the thing where angular loads pages based on query parameters? I don't have experience with it, but I've heard of it. Can you walk me through it?

Sent from my iPhone

On May 11, 2016, at 15:49, Kyle Gillen [email protected] wrote:

Hi

I can't figure out how (if it's possible) to use browser refreshing when using Codekit & HTML5mode.

Unless I manually add in a # at the root path & refresh the browser with the amended URL I always get a 404.

I was wondering if anyone had been able to get it working?

— You are receiving this because you are subscribed to this thread. Reply to this email directly or view it on GitHub

[kylegillen]

Hey Brian, thanks for chiming in.

I'm not an Angular expert by any means, I'll just relay what I know.

Basically, by default locationProvider (their base routing module) prefixes URL's with a hashbang (can be customised to something else) to get around i.e. http://foobar.com/#!/baz=23#baz

If you enable html5mode the hashbang no longer applies. URLs act as standard. However, once enabled each time you refresh the page the app no longer resolves the URL. You can gladly click around your routes all day, but as soon as you refresh - no go.

If you add the hashbang back in after the domain, however, the page resolves to the desired location.

The rationale behind stripping the hashbang by using html5mode is for SEO purposes, being that any Angular project is an SPA.

I don't know if any of the above helps, but if you need something more - just holler. Resource: $location Reference Link

Thanks again for looking into this.

[bdkjones]

Hi Kyle,

Thanks. What breaks when the page is reloaded?

On 13 May 2016, at 06:10, Kyle Gillen <[email protected] mailto:[email protected]> wrote:

Hey Brian, thanks for chiming in.

I'm not an Angular expert by any means, I'll just relay what I know.

Basically, by default locationProvider (their base routing module) prefixes URL's with a hashbang (can be customised to something else) to get around i.e. http://foobar.com/#!/baz=23#baz http://foobar.com/#!/baz=23#baz If you enable html5mode the hashbang no longer applies. URLs act as standard. However, once enabled each time you refresh the page the app no longer resolves the URL. You can gladly click around your routes all day, but as soon as you refresh - no go.

If you add the hashbang back in after the domain, however, the page resolves to the desired location.

The rationale behind stripping the hashbang by using html5mode is for SEO purposes, being that any Angular project is an SPA.

I don't know if any of the above helps, but if you need something more - just holler. Resource: $location Reference Link https://docs.angularjs.org/guide/%24location Thanks again for looking into this.

— You are receiving this because you commented. Reply to this email directly or view it on GitHub https://github.com/bdkjones/CodeKit/issues/613#issuecomment-219038323

[subhaze]

@nextriot have you setup CK to be a proxy for the apache server?

[kylegillen]

Thanks for chiming in guys.

That's how I ended up resolving it (setting up an external server using MAMP and the htaccess).

I was just interested in knowing if there was anyway to resolve this directly using the CK server.