我正在使用 Angular2 RC5(核心、http 等)并尝试连接到支持 CORS 的 Node.js 服务器。我的应用程序是从 Angular-CLI(版本:“1.0.0-beta.11-webpack.2”)生成的。
// src/app/app.component.ts
...
ngOnInit () {
const headers: Headers = new Headers();
headers.append('Accept', 'application/json');
headers.append('Content-Type', 'application/json');
headers.append('Access-Control-Allow-Origin', '*');
const options = new RequestOptions({
headers: headers
});
this.http.get('http://localhost:9000/api/v1/users', options)
.map((res: Response) => res.json())
.subscribe(users => console.log(users));
}
...
当应用程序启动时,调用了 OnInit
Hook ,我在控制台中收到错误消息。这是我收到的错误消息。
EXCEPTION: TypeError: Cannot read property 'toString' of null
browser_adapter.js:84EXCEPTION: TypeError: Cannot read property 'toString' of nullBrowserDomAdapter.logError @ browser_adapter.js:84BrowserDomAdapter.logGroup @ browser_adapter.js:94ExceptionHandler.call @ exception_handler.js:65(anonymous function) @ application_ref.js:267ZoneDelegate.invoke @ zone.js:323onInvoke @ ng_zone_impl.js:53ZoneDelegate.invoke @ zone.js:322Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356onInvokeTask @ ng_zone_impl.js:44ZoneDelegate.invokeTask @ zone.js:355Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474
zone.js:461 Unhandled Promise rejection: Cannot read property 'toString' of null ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'toString' of null(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494
zone.js:463 Error: Uncaught (in promise): TypeError: Cannot read property 'toString' of null(…)
如果我完全放弃 options
和 header
,我会收到 CORS 错误,但服务器的响应状态为 200。 (我想如果我能传递正确的 Header,它应该可以工作。)
this.http.get('http://localhost:9000/api/v1/users')
.map((res: Response) => res.json())
.subscribe(users => console.log(users));
这是控制台的错误
XMLHttpRequest cannot load http://localhost:4000/api/v1/users. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.
browser_adapter.js:93EXCEPTION: Response with status: 0 for URL: null
browser_adapter.js:84EXCEPTION: Response with status: 0 for URL: nullBrowserDomAdapter.logError @ browser_adapter.js:84BrowserDomAdapter.logGroup @ browser_adapter.js:94ExceptionHandler.call @ exception_handler.js:65next @ application_ref.js:348schedulerFn @ async.js:89SafeSubscriber.__tryOrUnsub @ Subscriber.js:225SafeSubscriber.next @ Subscriber.js:174Subscriber._next @ Subscriber.js:124Subscriber.next @ Subscriber.js:88Subject._finalNext @ Subject.js:128Subject._next @ Subject.js:120Subject.next @ Subject.js:77EventEmitter.emit @ async.js:77onHandleError @ ng_zone_impl.js:74ZoneDelegate.handleError @ zone.js:327Zone.runTask @ zone.js:259ZoneTask.invoke @ zone.js:423
Subscriber.js:229Uncaught Response with status: 0 for URL: null
有人可以帮忙吗?谢谢。
最佳答案
我是新手,所以请耐心等待,但就我而言,后端 Node.js 服务器应该返回 Access-Control-Allow-Origin header 。出于安全考虑,服务器端的 CORS 默认处于禁用状态。 使用以下问题帮助您实现:How to allow CORS?
关于angularjs - Angular2 Http 设置 header Access-Control-Allow-Origin 和 http CORS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38939845/