如何创build跨域请求(Angular 2)?
如何使用Angular 2创build跨域请求? 你能提供一个例子吗? localhost:3000和localhost:8000跨域请求? 谢谢。
事实上,Angular2中没有任何关于跨域请求的事情。 CORS是浏览器原生支持的东西。 这个链接可以帮助你理解它是如何工作的:
- http://restlet.com/blog/2015/12/15/understanding-and-using-cors/
- http://restlet.com/blog/2016/09/27/how-to-fix-cors-problems/
简而言之,在跨域请求的情况下,浏览器会在请求中自动添加一个Origin
标头。 有两种情况:
- 简单的请求 。 这个用例适用于使用HTTP GET,HEAD和POST方法的情况。 在POST方法的情况下,仅支持具有以下值的内容types:
text/plain
,application/x-www-form-urlencoded
和multipart/form-data
。 - 预冲的请求 。 当“简单请求”用例不适用时,首先请求(使用HTTP OPTIONS方法)检查在跨域请求的上下文中可以做什么。
所以实际上大部分工作必须在服务器端完成才能返回CORS头文件。 主要的是Access-Control-Allow-Origin
之一。
200 OK HTTP/1.1 (...) Access-Control-Allow-Origin: *
要debugging这些问题,您可以使用浏览器中的开发人员工具(“networking”选项卡)。
关于Angular2,只需像使用其他任何请求一样使用Http
对象(例如相同的域):
return this.http.get('https://angular2.apispark.net/v1/companies/') .map(res => res.json()).subscribe( ... );
对我来说这是另一个问题。 对一些人来说这可能是微不足道的,但是花了我一段时间才弄清楚。 所以这个答案可能对某些人有帮助。
我有我的API_BASE_URL
设置为localhost:58577
。 读完第一百万次的错误信息后,硬币掉了下来。 问题在于它只支持HTTP
和其他一些协议。 我不得不改变API_BASE_URL
,使其包含协议。 所以改变API_BASE_URL
到http://localhost:58577
它完美的工作。
在客户端,你无能为力。 我在服务器端的控制器中添加@CrossOrigin
,它工作。
@RestController @CrossOrigin(origins = "*") public class MyController
请参阅文档 。
林
@RestController @RequestMapping(value = "/profile") @CrossOrigin(origins="*") public class UserProfileController {
SpringREST提供了@CrossOrigin注释,其中(origins =“*”)允许从任何来源访问REST APIS。
我们可以将其添加到相应的API或整个RestController。