2017-10-09 54 views
1

我試圖從使用角度2的nodejs訪問api。但是我越來越奇怪即使花費了幾個小時後仍然無法解決的錯誤。我基本上是新的意味着堆棧。在從angular2到nodejs的路由中出現錯誤預檢請求未通過訪問控制檢查:No'Access-Control-Allow-Origin'

我的角2服務 -

import {Injectable} from '@angular/core'; 
import {Http, Response, Headers, RequestOptions, RequestMethod} from "@angular/http"; 
import {Observable} from "rxjs/Rx"; 

@Injectable() 
export class LoginService { 

constructor(private http:Http) { } 
    // Uses Observable.forkJoin() to run multiple concurrent http.get() requests. 
    // The entire operation will result in an error state if any single request fails. 
    createUser(user) { 
    let headers = new Headers({ 'Content-Type': 'application/json' }); 
    headers.append('Content-Type', 'application/json'); 
    headers.append('Accept', 'application/json'); 

    headers.append('Access-Control-Allow-Origin', '*'); 
    //headers.append('Access-Control-Allow-Credentials', 'true'); 

    // headers.append('Access-Control-Request-Method',"'GET', 'POST', 'OPTIONS'"); 
    headers.append('Access-Control-Allow-Origin', '*'); 
    let options = new RequestOptions({ headers: headers }); 
    let body = JSON.stringify(user); 

    alert(body); 
    return this.http.get('http://localhost:8080/api/user/signup', options); 
    //return this.http.post('http://localhost:8080/api/user/signup', body, options); 
    //alert (response) ; 
    //return response; 
    } 
    validateUser(user) { 
    let headers = new Headers({ 'Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 
    let body = JSON.stringify(user); 
    console.log('Request : '+body); 
    return this.http.post('localhost:8080/api/user/signup/', body, options).map((res: Response) => res.json()); 
    } 
} 

我的API的NodeJS -

usseRouter.post('/signup', function(req, res) { 
    console.log(req.body + " data " + req.body.username) 

//res.header('Access-Control-Allow-Origin', '*'); 
//res.setHeader('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS'); 
if (!req.body.username || !req.body.password || !req.body.email) { 
    console.log(req.body + " data " + req.body.username) 
    res.json({success: false, msg: 'Please pass username ,password and email.'}); 
} else { 
    console.log(req.body + " data " + req.body.username) 

    var newUser = new User({ 
    username: req.body.username, 
    password: req.body.password, 
    email : req.body.email 
    }); 
    // save the user 
    newUser.save(function(err) { 
    if (err) { 
     return res.json({success: false, msg: 'Username already exists.'}); 
    } 
    res.json({success: true, msg: 'Successful created new user.'}); 
    }); 
} 
}); 

節點API工作在郵遞員罰款,但試圖通過角2 錯誤連接時給錯誤:

Failed to load http://localhost:8080/api/user/signup: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. 

回答

0

您應該將標題設置爲來自服務器不在客戶端的請求中。 您可以在res對象服務器端中設置標題。就像這樣:

usseRouter.post('/signup', function(req, res) { 
    res.setHeader('Access-Control-Allow-Origin', '*'); 
    ... 
    newUser.save(function(err) { 
     if (err) { 
      return res.json({success: false, msg: 'Username already exists.'}); 
     } 
     res.json({success: true, msg: 'Successful created new user.'}); 
    }); 

讓我知道它是否適合您。

相關問題