I configured Spring Security to work with JWT . My service is stateless and gives json 's. The problem is that when I try to get a token through the browser, I get the following error:

 XMLHttpRequest cannot load http://localhost:7345/login. No 'Access-Control-Allow-Origin' header is present on the requested resource.

With a regular controller, I could simply CrossOrigin annotation, but if I create such a controller, it will override my settings in Spring Security .

What to do ?

    2 answers 2

    Need to add a global CORS request configuration

     @Configuration @EnableWebMvc public class WebConfig extends WebMvcConfigurerAdapter { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**"); } }

    More details can be found in the documentation 27.3.1

    • I tried to do so. The error remained: joxi.ru/D2PGDK9cQzK7m3 - faoxis
    • As far as I remember, you write the front on angular 2. When requesting, you need to specify the option withCredentials in the angular. An example of such a request - Ruslan Masgutov
    • A bit off topic. I just can not understand what is happening. I make a request through postman : joxi.net/krDGOLBcQXqgAp . Via Angular2 : joxi.net/BA0Np9EUGXxvmy . I do the request like this: joxi.ru/BA0Np9EUGXjvmy . - faoxis
    • According to the recommendations of the W3C , another link , which is described in a more understandable language. In short, GET and POST requests can cause side effects on the server, so the browser in front of them sends an OPTIONS request to check the ability to serve requests. OPTIONS requests send and process only headers - RFC 2616 - Ruslan Masgutov
    • I made it so that only headers were OPTIONS in response to an OPTIONS request. As a result, I get the following error: XMLHttpRequest cannot load http://localhost:7345/login. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. XMLHttpRequest cannot load http://localhost:7345/login. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. - faoxis

    Perhaps the answer is not to the question asked, but it will solve your problem. If there is nginx, then you serve them statics and redirect requests to the back (service of spa applications through nginx). For local development mode, webpack-dev-server has a proxy setting for proxying a request to the backend. On the front, you don’t tell the host where to send the request. In this case, no spring configuration is required.

    UPDATE

    const METADATA = { host: 'localhost', port: 3000, baseUrl: '/', hostUrl: 'http://localhost:3001' }; //--- devServer: { // конфиги.. proxy: { '/api/*': { target: METADATA.hostUrl, secure: false } } // конфиги... }

    • And do not tell webpack.config.js what should be in a typical webpack.config.js to run on angular 2 with proxying? Never worked with a webpack . It will be generally cool if you have an example. :) - faoxis
    • Added in response a part of his webpack.config.js for proxying requests - Ruslan Masgutov
    • And in what file should it be? In webpack.config.js ? Still do not really understand how to run it. If I run the webpack command, then I have one big js file, but this does not affect what happens when the npm start command is executed. - faoxis
    • The webpack command is a compilation of source codes for distribution, npm start is a compilation and start of a dev server. my old template for project initialization - Ruslan Masgutov
    • Cool The only thing I can not understand how to properly proxy. I did this: proxy: { '/back': { target: 'http://localhost:7345' } } . The problem is that the beginning with /back not chopped off and it turns out when I request /back/login I get to http://localhost:7345/back/login , but I need http://localhost:7345/login . - faoxis