Reserve proxy config nginx with laravel and angular app.
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 CÂU TRẢ LỜI
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.
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
ko được bạn à :v
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