Asked Jun 11th, 2019 2:19 a.m. 608 0 3
  • 608 0 3
0

Reserve proxy config nginx with laravel and angular app.

Share
  • 608 0 3

Mình đang config trên server nginx để sử dụng laravel làm api và Angular App frontend.

Mình config cho laravel trên cổng 80 và Angular serve trên cổng 4200. Và cả 2 đều run qua domain bằng nginx. Mình đang bị vướng chỗ ở app Angular. Angular của mình trỏ vào được nhưng các file js thì bị báo 404 (do nó vẫn trỏ vào domain gốc kiểu https://example.com/main.js trong khi đáng lẽ phải là http://IP:4200/main.js).

Đây là config nginx của mình cho angular:

location /frontend/ {
                proxy_pass        http://IP:4200/;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header            X-Real-IP       $remote_addr;
                proxy_set_header            X-Forwared-For  $proxy_add_x_forwarded_for;
                rewrite ^/(.*)$  /$1  break;
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

Phần trước đó thì config cho laravel ở localtion / và .php vẫn oke. Có ai gặp trường hợp này rồi ko cho mình xin solution với ạ. P/s: domain của mình thì kiểu là https://example.com

3 ANSWERS


Answered Jun 11th, 2019 4:21 p.m.
Accepted
+1

Bạn đang deploy để dev hay deploy production vậy? Nếu deploy production thì ko nên reverse proxy đến ng serve như vậy mà nên dùng ng build và dùng nginx để serve static html.

Cái nữa là nên deploy frontend angular vào location root / và backend api vào /api chẳng hạn, vì cần vào trang frontend là chủ yếu mà nhỉ? Cách này cũng dễ config hơn.

Share
Avatar No Naem @Naem
Jun 12th, 2019 1:33 a.m.

Chuẩn rồi a :v

E ko làm phía FE nên lúc đầu cx ko hiểu sao serve ra port :v xong suggest họ build ra dist để trỏ vào index nên dễ hơn ạ, Nhưng theo cách sử dụng port kia vẫn làm được ạ, chỉ tại nó tù hơn thôi ạ :v

0
| Reply
Share
Answered Jun 11th, 2019 6:44 a.m.
0

Thử thay proxy_set_header Host $host; thành proxy_set_header Host IP:4200;

Share
Avatar No Naem @Naem
Jun 11th, 2019 1:29 p.m.

ko được bạn à :v

0
| Reply
Share
Answered Aug 5th, 2019 7:56 a.m.
0

Bạn đang sử dụng nginx Reserve proxy thì truy cậpnhư vậy là đúng rồi nhé. còn lỗi 404 khi vào http://IP:4200/main.js thì chắc là do cấu hình của Angular của bạn

Share
Viblo
Let's register a Viblo Account to get more interesting posts.