I am new to web security and as I am learn about CSRF, I have a very simple question:
Say we have this scenario:
On web browser, I visit a normal website (call it website A) and login with credentials.
After I am authenticated, website A would issue an access token for my browser to store. As I am using website A, any subsequent http requests I make are sent to the api endpoints and the auth token is attached with the requests.
Now I visit an evil website. When the html / javascript frontend code of the evil website loads in the browser, it induces me to issue an HTTP request to the api endpoint of website A.
However, since resources (DOM, local storage, cookies) of different origins are segregated in the browser, there is no way for the evil site's frontend code to access the access token of website A. Therefore the induced HTTP request to api endpoint of website A would contain no access token. The request would not be successful.
It seems to me that using authentication token alone can prevent CSRF, as long as cookies of different origins are segregated and not accessible cross-origin-wise, which is pretty definite in modern day web browser.
There is absolutely no way that one website's frontend code can get another site's cookies / DOM / storage in browser.
Why are there all those other techniques of preventing CSRF?
The problem is cookies. If the token is stored in a cookie, it will be sent with requests to the victim, regardless of where the request is being sent from. This means that the token cookie will be sent to victim.com even if the site sending the request is attacker.com.
There is now a new-ish cookie attribute SameSite that prevents this with the very purpose of mitigating CSRF, and also there are the more traditional approaches to make sure a request was made on the legitimate app origin (like synchronizer tokens, double submit and so on).
Also note that if the token is not sent as a cookie (but in something like a request header, or just in the request body), no further protection is needed in general. There may be special edge cases though, other forms of authentication that do send credentials automatically, like for example http basic auth or client certificates, but those are rarely used in a normal web app for humans to interact with.