axios post 403 forbidden but postman works

Question

use axios post get 403 forbidden but postman and axios get all works

Server: Spring Boot localhost:8080

Web: Vue.js + Axios localhost:80

Spring Boot CORS CONFIG:

@Configuration
public class WebMVCConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/api/**")
                .allowedHeaders("*")
                .allowedMethods("*")
                .maxAge(1800)
                .allowedOrigins("http://localhost:80/");
    }
}

Vue.js ProxyTable:

proxyTable: {
  '/api':{
    target: "http://localhost:8080/",
    changeOrigin:true,
  }},

Axios func:

  doLogin(){
    axios({
      method: 'post',
      url: '/api/te',
      data: {
        userNumber: 'hi'
      }
    });

Spring Boot Controller:

@PostMapping("/te")
public String Test(@RequestBody HashMap<String,String> map) {
    return map.get("userNumber");
}

then,in MSEdge localhost:80/ :

403 forbidden

however in postman it works well:

postman works

I've tried for 3 hours ,and now I'm very tired...

CORS usually doesn't return 403, when its a CORS issue it usually is so that the server will return the correct response, but the browser will stop you from viewing the response because of missing CORS-headers... i might be wrong, but are you sure its a CORS issue? — Toerktumlare, Jul 13 '20 at 18:00
in fact,i dont know what happened....i tried 'get' with a new controller without args, it works well,just can't post...(posting without payload also got 403) — chillsoul, Jul 13 '20 at 18:15
what i can see from your webbrowser (i can't read Chinese) is that it looks like the request from axios is made to `127.0.0.1:80` so is the proxy working? — Toerktumlare, Jul 13 '20 at 18:33
yes it works,i tried to use post man get 127.0.0.1:80/api/te ,it works...and 127.0.0.1:8080/api/te in the same way.now i solved it ,look my answer,even if i dont know why ;P — chillsoul, Jul 13 '20 at 18:39

chillsoul · Answer 1 · 2020-07-14T08:14:48.293

Ok I HAVE SOLVED IT NOW!!!!

that's because I've configured CORS

allowedOrigins("http://localhost:80/");

and

proxyTable: {
  '/api':{
    target: "http://localhost:8080/",
    changeOrigin:true,
  }},

Reason:

allowedOrigin should be http://localhost:80 , adding '/' in the end is a mistake.
proxyTable.'/api'.changeOrigin:true will just set Host Header to target,NOT set Origin Header to target,this is DIFFERENT from allowedOringins method in SpringBoot CORS CONFIG,your request's origin is still htpp://localhost (the page that request)。

so the right code is:

@Configuration
public class WebMVCConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/api/**")
                .allowedHeaders("*")
                .allowedMethods("*")
                .maxAge(1800)
                .allowedOrigins("http://localhost");
    }
}

and

proxyTable: {
  '/api':{
    target: "http://localhost:8080",
    changeOrigin:true,
  }},

;P

axios post 403 forbidden but postman works

1 Answers1

Linked