Angular <-> Spring, brak odpowiedzi (VPS)

Siemka, mam pewnie problem związany z wysyłaniem zapytań na serwer.

Generalnie wygląda to tak że odpalam aplikacje springa, potem angulara, wszystko rusza.
Przy czym jak wysyłam zapytanie z angulara na apke w springu to jest status failed (no idea why)

Nie wiem czy na VPS trzeba coś dodatkowo pokonfigurować, ale dziwne jest to, że odpalając angulara na vps,
a serwer springa u siebie na pc to wtedy requesty dochodzą i serwer odsyła response (???)

Przez co możnaby wnioskować, że aplikacja springa na vps pod jakimś innym url niż localhost:8080, tylko nie wiem jak mógłbym to sprawdzić?
Przy odpalaniu w logach jest że

Tomcat started on port(s): 8080 (http) with context path '

bump

cors?

Jak przykładowo wywołam dowolny endpoint:

curl localhost:8080/customer/session

to jest normalnie odpowiedź, a przez angulara nie ma :/

Co ci pisze konsola (f12).
Na jaki adres idą te zapytania?
No bo jak masz serwer (z angularem) na adresie http://x.y.z:9090/index.html
to zapytania do localhost:8080 na pewno nie będą działać.

1. Z powodu zabezpieczeń.
2. I bez sensu **localhost **to twój komputer, a pewnie byś chciać springa z serwera odpytać.

jarekr000000 napisał(a):

Co ci pisze konsola (f12).
Na jaki adres idą te zapytania?
No bo jak masz serwer (z angularem) na adresie http://x.y.z:9090/index.html
to zapytania do localhost:8080 na pewno nie będą działać.

1. Z powodu zabezpieczeń.
2. I bez sensu **localhost **to twój komputer, a pewnie byś chciać springa z serwera odpytać.

Zapytania idą na localhost:8080.

To co, teraz muszę wszystkie http.requesty od strony angulara zmienić? Tylko na jaki adres? ip.vps:8080 ?

Zmieniłem requesty url od strony angulara tak jak tutaj:

I teraz wszystko działa, tylko teraz rodzi mi się pytanie w głowie:

Czy jeśli już chcemy wrzucić na deploy jakąś aplikacje, to zawsze musimy potem zmieniać wszystkie url request w aplikacji angulara?
Niby nie jest to jakoś mega uciążliwe jak sie ma ich koło 30, ale podejrzewam że przy większym projekcie mogłoby to być kłopotliwe :D
Nie ma jakiejś szybszej drogi?

Pierwsze - to zwykle nie potrzebuje pisać tego http:// tylko możesz używać adresów względnych.
Drugie - location.host - zwraca nazwę strony hosta (w Angularze jest do tego specjalny serwis)
Trzecie - w programowaniu normalnie można używac zmiennych, stałych i definiowac to w jednym miejscu.

Jeśli dasz url w postaci api/dupa to strzeli http://<host>:<port>/<baseUrl>/api/dupa
natomiast w przypadku /api/dupa to wynikiem będzie strzał do http://<host>:<port>/api/dupa

Tak to mniej więcej powinno wyglądać:

public getDupa(): Observable<Dupa> {
        const url = `api/dupa`;
        const params = new HttpParams()
            .set('param', 'x')
        return this.http.get(url, {params: params});
    }

Pozwolę sobie odkopać ten temat bo mam niezrozumiały dla mnie problem..

Otóż z poziomu przeglądarki wysyłając request pod adres vps:

server nie odpowiada, nic z tych rzeczy.

Natomiast jak wywołam jakiś endpoint curlem w ten sposób:

To server normalnie odpowiada, nie ma problemu. (z każdym innym jest tak samo, wszystko działa)

Czy ktoś wie co może być grane? :/

@mr_jaro:

Tak wyglada moj config:

@Component
@Order(Ordered.HIGHEST_PRECEDENCE)
public class SecurityRequestFilter implements Filter {
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) {
        HttpServletRequest request = (HttpServletRequest) req;
        HttpServletResponse response = (HttpServletResponse) res;

        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");
        response.setHeader("Access-Control-Allow-Headers", "x-requested-with, x-auth-token");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Credentials", "true");

        if(!(request.getMethod().equalsIgnoreCase("OPTIONS"))) {
            try {
                chain.doFilter(req, res);
            } catch (Exception e) {
                e.printStackTrace();
            }
        } else {
            System.out.println("Pre-fight");
            response.setHeader("Access-Control-Allowed-Methods", "POST, GET, DELETE");
            response.setHeader("Access-Control-Max-Age", "3600");
            response.setHeader("Access-Control-Allow-Headers", "authorization, content-type, x-auth-token, " +
                    "access-control-request-headers,access-control-request-method,accept,origin,authorization,x-requested-with");
            response.setStatus(HttpServletResponse.SC_OK);
        }
    }



    public void init(FilterConfig filterConfig) {}

    public void destroy() {}
}

Jak stawiasz aplikację angularową?
Ja bym nie konfigurował tego cors'a po stronie backendu, tylko zrobił proxy na poziomie nginx/apache czy innego http-servera, który serwuje twoją aplikacje angularową.
Wtedy, gdy twoja aplikacja angularowa jest dostępna z adresu https://example.com, wszystko co idzie na https://example.com/api/*, proxowałbym po stronie http-servera na twój docelowy backend.

edit: BTW, czy twój backend jest widoczny w internecie? Z tego co widzę to request robisz z maszyny gdzie jest postawiony backend?