Ошибка кросс-оргина в Google Chrome для вызова API

Question

Ошибка кросс-оргина в Google Chrome для вызова API

0

в бэкенде nodejs я добавил этот код к server.js

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

но в angularjs 2 клиентской стороне в google chrome бросает эту ошибку

XMLHttpRequest cannot load http://localhost:8080/team. 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:3000' is therefore not allowed access. The response had HTTP status code 405.

это служебный код для angular2, который я использую

export class DataService {
    // URL to web api

    constructor(private http: Http, private _configuration: Configuration,private team:Team) {

        //this.actionUrl = _configuration.ServerWithApiUrl;
        this.actionUrl = "http://localhost:8080/team";

    }
    private actionUrl: string;

    addData(postData: Team): Observable<Team[]> {

        //let body = JSON.stringify({ Team });
        this.team = postData;
        console.log(this.team);
        let body = JSON.stringify({ postData });
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });

        console.log(body);

        return this.http.post(this.actionUrl, body, options)
            .map(this.extractData)
            .catch(this.handleError);

    }

kohli 22 сен. 2016, в 08:10

Источник

Теги:

angular

angularjs

node.js

api

2 ответа

Ещё вопросы

mxii · Answer 1 · 2016-09-22T03-17-00.000Z

ОБНОВЛЕНО:

Для вашего нового сообщения об ошибке: Angular2 - нижний корпус заголовков. Обновите свой сервер, чтобы принять content-type.

res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, content-type, Accept");

Вы не можете отправить сообщение на этот URL: http://posttestserver.com/post.php?dir=anyNameYouWillFind

И можете видеть ваши сообщения там: http://posttestserver.com/data/

Просмотрите год, месяц, день и любойNameYouWillFind..

OLD:

вы должны прикрепить свой URL-адрес!

this.http.get(' http ://localhost: 8080/v1_user/45646/team');

Вы имеете в виду, я должен добавить " localhost: 8080 / v1_user / 45646 / team " этот URL на стороне клиента справа ??
Пожалуйста, опубликуйте ваш метод Angular2 get.
я использую его для поста я редактировал вопрос
Но в вашем сообщении об ошибке есть другой URL-адрес .. localhost: 8080 / v1_user / 45646 / team вместо localhost: 8080 / team, как в вашем вопросе ..
я обновил в соответствии с вашим ответом ошибка была изменена
angular - это нижний регистр заголовков, пожалуйста, обновите свой бэкэнд, чтобы разрешить также content-type .
я получаю эту ошибку сейчас XMLHttpRequest cannot load http://localhost:8080/v1_user/45646/team. Response for preflight has invalid HTTP status code 405
Я не уверен, является ли это проблемой Angular2 или вашим бэкендом. Пожалуйста, проверьте публикацию по этому адресу: http://posttestserver.com/post.php .

kohli · Answer 2 · 2016-09-22T03-19-00.000Z

Исправлено, добавив это в backend node.js

// access control --> allowed all origin
app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    // Request headers you wish to allow
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');

    next();
})

.options('*', function(req, res, next){
    res.end();
})
;