Question

我正在开发一个Angular2应用程序。我使用arangoDB api作为后端来接收json数据。我正在使用restful api服务。

我在app.component.html中添加了一个按钮来调用该函数。我在下面添加了服务组件和app.component的代码。我收到了上述错误。

app.component.ts

import { Component } from '@angular/core';
import { Http, Response, RequestOptions, Headers} from '@angular/http';
import { MyHttpserviceService } from './my-httpservice.service';

@Component({
selector: 'app-root',
templateUrl:'app.component.html',
//providers: [MyHttpserviceService]
})

export class AppComponent {
getData: string;
postData: string;

constructor (private http:MyHttpserviceService) {}

client_grid_Get(){

this.http.server_grid_Get().subscribe(
      data => this.getData = JSON.stringify(data),
      error => alert(error),
      () => console.log("finished")
     );
} 
}

我-httpservice.Service.ts

import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
import { Http, Response, Headers, RequestOptions, URLSearchParams } from '@angular/http';


@Injectable()
export class MyHttpserviceService {

constructor(private http:Http) {}

server_grid_Get() {

var request = new XMLHttpRequest();
var user = "Admin";
var pass = "admin";

//Use Basic authentication
request.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + pass));
request.setRequestHeader('Content-Type','application/json');
request.setRequestHeader('Access-Control-Allow-Credential','true');

return this.http.get("http://190.100.00.000:8000/_db/xxxxx_app/_api/document/wsdl_test/4934434").map(res => res.json());

//request.responseType = 'json'; <--Notice it was removed

 request.addEventListener('load', function(event) {
    if (request.status >= 200 && request.status < 300) {
        console.log(request.responseText);
    } else {
        console.warn(request.statusText, request.responseText);
    }
});
request.send();
}
}

app.component.html

<button type="submit" (click)="client_grid_Get()"> test GET data 
</button>
<p> OUTPUT: {{ getData }} </p>

错误DOMException：无法在'XMLHttpRequest'上执行'setRequestHeader'：对象的状态必须是OPENED

0 个答案: