Question

我试图像这样从我的本地主机获取数据：

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable({
    providedIn: 'root'
})
export class SearchServiceService {

    apiRoot:string = 'https://itunes.apple.com/search';
    results:Object[];
    loading:boolean;

    constructor(private http:HttpClient) {
        this.results = [];
        this.loading = false;
    }

    search(term:string){
        let promise = new Promise((resolve, reject) => {
            let apiURL = `${this.apiRoot}?term=${term}&media=music&limit=20`;
            this.http.get(apiURL).toPromise().then(res => {
                // console.log( res.json() );
                resolve();
            }, function(error){
                console.log('error is', error);
            })
        });
        return promise;
    }
}

我正在使用Chrome浏览器。为防止出现CORS问题，我使用了此扩展名：

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi/related?hl=en-US

但是仍然出现错误：

Failed to load https://itunes.apple.com/search?term=Moo&media=music&limit=20: The 'Access-Control-Allow-Origin' header contains multiple values 'http://evil.com/, *', but only one is allowed. Origin 'http://localhost:4200' is therefore not allowed access.

zone.js:2969 Cross-Origin Read Blocking (CORB) blocked cross-origin response https://itunes.apple.com/search?term=Moo&media=music&limit=20 with MIME type text/javascript. See https://www.chromestatus.com/feature/5629709824032768 for more details.

未获取数据。我需要在这里进行哪些更改？有人帮我吗？

Answer 1

我认为，目前最好的选择是在http选项中指明以文本数据形式获取响应。浏览器的corb算法将忽略文本数据。

<audio id="audioplayer" src=<blob url here set via javascript> controls type="audio/mpeg">

然后由您将响应数据解析回json。修补订户调用中的数据时，浏览器corb algorithim似乎仍然处于活动状态。

您可能需要将其保存到类变量中，然后再从那里解析它。

由于存在“ CORB”问题，因此无法从“跨域”获取数据

1 个答案: