Failed to load resource: the server responded with a status of 403

超、凢脫俗 2022-04-11 11:20 337阅读 0赞

Failed to load resource: the server responded with a status of 403 ()
    personList.html:1 Failed to load http://192.168.0.103/person/getList: 
    Response to preflight request doesn't pass access control check:
     No 'Access-Control-Allow-Origin' header is present on the requested resource. 
     Origin 'http://127.0.0.1:8020' is therefore not allowed access. The response had HTTP status code 403.

前后端联调时，出现如上的错误，可能是因为`contentType`指定不恰当或者后端要求数据格式不匹配引起的

1.  后端不要求`json`格式，但是前端是`json`格式
    
    前端：
    
        $(function(){
        	$.ajax({
        		type:"get",
        		url:"http://192.168.0.103/person/getList",
        		dataType:"json",
        		contentType:"application/json;charset=utf-8",
        		success:function(result){
        			alert(result);
        		}
        	});
        });
    
    后端：
    
        @RequestMapping(value = "/getList", produces = MediaType.APPLICATION_JSON_VALUE)
        @ResponseBody
        public ResultBean getList() {
        	return new ResultBean(getData());
        }
2.  后端要求是`json`，前端传的数据是`form`表单序列化`$("#form").serialize()`  
    前端：
    
        $(function(){
        	$.ajax({
        		type:"post",
        		url:"http://192.168.0.103/person/createByJson",
        		dataType:"json",
        		data:$("#form").serialize(),
        		contentType:"application/json;charset=utf-8",
        		success:function(result){
        			alert(result);
        		}
        	});
        });
    
    后端：
    
        @PostMapping(value = "/createByJson", consumes = MediaType.APPLICATION_JSON_VALUE, produces = MediaType.APPLICATION_JSON_VALUE)
        @ResponseBody
        public ResultBean createByJson(@RequestBody @Validated Person person) {
        	return new ResultBean(person);
        }