Nginx rewrite rules for Angularjs to remove # hash in url in dynamic routes

Question

I have done the following:

AngularJS app

In app.js:

$locationProvider.html5Mode(true);

In index.html:

<base href="/">

nginx config

location / { try_files $uri /index.html; }

After deployment, things are working fine (# hash sign is removed) with the static pages. I can go directly to http://fakeurl/about or http://fakeurl/download pages; if I refresh the browser, the pages still load.

However, when I go directly to a dynamic page:

http://fakeurl/cars/:car_id

Then nginx will serve 404.

If I use the # path, then it redirects to the path without the # sign and displays the page; but when I refresh the page again, it shows 404. (This only happens with dynamic routes)

http://fakeurl/#/cars/:car_id

http://fakeurl/#/shops/:shop_id

What rewrite rules do I need to write in the nginx blocks to serve my dynamic routes? Thanks!

Answer 1

I burnt all my midnight oil last night and I found a solution here. If you have a better one, please post here so I can learn

https://gist.github.com/mreigen/4dc8effec8186315c3aac4ce6da46c9a

Answer 2

我想你可以使用这个正则表达式模式^(.*)\\/#并用$1重写它。