Point angular app on subdomain to subfolder with nginx

Question

I want to point sub.example.com to example.com/sub (without actually redirecting). I've achieved this with following nginx config:

server {
    listen 80;
    server_name ~^(.*)\.example\.com$ ;
    root /var/www/html/example.com/public_html/sub;
}

The problem is, I have an Angular app on sub.example.com and it tries to load its js resources from the below path and fails to do so (404 Not found):

http://sub.example.com/sub/inline.bundle.js
http://sub.example.com/sub/vendor.bundle.js
...

To make a build I'm using following command:

ng build --base-href /sub/

How to resolve this? Is this Angular issue or can I fix it with nginx config? I've tried the proxy_pass but with no success.

I think so, at least I had to use it at the beginning when I was accessing the app through example.com/sub, its source location hasn't changed, I just want to access it through sub.example.com now — Adam Bardon
– Adam Bardon, Commented Feb 18, 2018 at 18:45
I'd say to try without. Since you've got nginx redirections, it should not be needed anymore. Otherwise, it if still does not work after removing it, have a look at the deploy-url option — David
– David, Commented Feb 18, 2018 at 18:47
It worked! Do you want to post it as an answer so I can accept it? — Adam Bardon
– Adam Bardon, Commented Feb 18, 2018 at 19:15

David · Accepted Answer · 2018-02-18 20:41:46Z

5

Specifying base-href is only needed for the router if your app is not served from the root location, e.g. http://example.com/sub

In your case, you added nginx rules so that content can be served from a sub folder, but using a "root" location (http://sub.example.com)

So from an angular point of view, everything is like it's served from a root folder, meaning there is no need to specify base-href

answered Feb 18, 2018 at 20:41

David

34.6k13 gold badges90 silver badges124 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

nyxz · Accepted Answer · 2018-06-15 15:05:15Z

0

I had that problem when I was implementing internationalization of Angular application that needed to be served from different sub-directories for each language. Check my solution on the topic.

answered Jun 15, 2018 at 15:05

nyxz

7,4789 gold badges60 silver badges74 bronze badges

1 Comment

Adam Bardon Over a year ago

Using --base-href /sub/ argument was causing my problem.

Collectives™ on Stack Overflow

Point angular app on subdomain to subfolder with nginx

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related