Say bank.com has SSL. Cool! Now how does Angular work? You visit angular-site.com/some/path and backend server rewrites the request to angular-site.com/index.html. You still see angular-site.com/some/path. And it works and that's how Angular servers that serve Angular apps work.
Now, what prevents bank-malicious-url.com from acting like a viewer, where it access bank.com when you visit it hence the SSL encryption/decryption is made between it and the legit bank.com, whilst malicious-bank.com url has a simple letsencrypt certificate that is showing you a not so legit green secured URL web address on the top of your web browser?
Please help! I abandoned my patent, I've been building my Angular web app and now I think that the old me was not so dumb after all. Where to proceed from now?
The malicious site could go about a few ways of potentially using functionality based on what protections the real bank's site is using. If it's not protected against CSRF & JWTs aren't in use, it could send a request on behalf of the user.
If the bank's site allows framing, a clickjacking attack could occur.
---
From your further comments though, it also sounds like you may be talking about phishing. There are several PoCs and real-world examples of attackers hosting a fake login page for Microsoft/Apple/Facebook and interacting in real-time with the real site. This allows them to also prompt the user for an MFA code which they'll use to authenticate.
If it's this phishing scenario, there's not a big way to block these for completely public-facing sites. Anything behind a VPN / whitelist would be impossible though (ofc).
Yes, that’s a phising technique. CORS, CSP, or CSFR tokens can’t prevent it.
---
bank.com can mitigate it by blocking my-bank.com IPs
---
This 2007 paper [1] is about the initial mitigation idea, which was using Extended Validation Certificates (EV SSL). The study showed that users didn't pay attention to the special UI address bar EV certs had. In 2018 Chrome removed that UI style [2]
[1] http://www.usablesecurity.org/papers/jackson.pdf
[2] https://www.ghacks.net/2018/05/18/google-chrome-removal-of-s...
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Co...
Would be an additional method.
Your attack is not new/novel.
It's not a bad idea to just put in a CSP (always put in a CSP!), CORS policy, and Same-Origin. This is configured on your app rather than server (usually).
MDN is one of the better resources for this, and links out to other authoritative resources in the additional info section of a directive.