response设置响应头,解决跨域请求问题,No 'Access-Control-Allow-Origin' header is present on the requested resource

今天被跨域请求的问题困扰了很久,跨域一句话的理解就是:服务端和请求端的地址不一样。

跨域的详细介绍可以参考:浏览器和服务器实现跨域(CORS)判定的原理,这里不多赘述。

我出现的问题,主要就是客户端向发送了服务端请求,服务器已经能返回数据,但是浏览器不接收。


Failed to load http://localhost:8080/XXXX: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

英语不是很好,根据翻译报错的内容大概就是:

未能加载这个地址(http://localhost:8080/XXXX)请求的资源,因为没有“Access-Control-Allow-Origin”这个响应头。因此,访问源(http://localhost:8081)不被允许接收这个资源。如果这个资源是你需要的,请将请求的模式设置为“no-cors”,以获取与CORS禁用的资源。

也就是说,从报错的内容来看,大概能有两种方式可以解决这个问题,一个是在服务器端设置这个响应头,第二就是设置CORS。但是对于初入门的小白来说,能有一个方法解决就已经很不错了。当然,网上找了一些资料,方法非常多,但是那些精髓的内容,我等小白实在参不透,没一个知道具体怎么用上去的。

后来在一位群里请教了一位大神,大神的回复也是比较简短:

“好像是在服务端的request设置ContentType可以解决”

我都快要哭了,好在都在群里,能继续追问,我马上截图服务端的代码给大神参考


等了一会,大神让我加上这个:

this.response.setHeader("Access-Control-Allow-Origin", "*");
this.response.setHeader("Cache-Control","no-cache"); 


生硬地加上去肯定是报错的:


而后我思考了一会,以前学Servlet的时候,doGet和doPost里面request和response基本都是成对出现的,所以我这里就加上了HttpServletResponse response,最后如下图所示,跨域访问可总算解决了。


为了感谢大神,我把QQ钱包仅剩的6.21元贡献了出来(原本想发6.66,结果不够钱),对大神表示诚挚的感谢!


其实,当自己这个流程走通了之后,有些地方自然就会明白了。我后端的代码是从其他的地方学习的,方法始终是死的,人是活的,这段代码只有request,没有response,因为request是处理客户端的请求等等,而当地址一样的时候自然不会出现跨域的问题。当理解了request是处理请求,response是返回结果,其实问题也就简单多了。


2018-05-17 更新:

最后发现,如果是使用Spring Boot创建的项目,直接添加一句注解到controller和方法就可以了。

@CrossOrigin

猜你喜欢

转载自blog.csdn.net/tg928600774/article/details/80325040