2017-07-12 298 views
1

我试图在Angular 4 Universal应用程序中从Google中检索联系人。拒绝从URL执行脚本,因为它的MIME类型('application/json')不可执行,并且启用严格的MIME类型检查

但我收到此错误信息一旦认证已经完成:

拒绝从 https://www.google.com/m8/feeds/contacts/default/full?access_token=TOKEN&alt=json 执行脚本,因为它的MIME类型(“应用/ JSON”)不是可执行文件,并 严格的MIME类型检查已启用。

目前一切都在一个组件举行:

import { Component, OnInit } from '@angular/core'; 
import { Jsonp } from '@angular/http'; 

@Component({ 
    selector: 'refer-friend', 
    templateUrl: './referFriend.component.html', 
}) 
export class ContactsComponent implements OnInit { 
    constructor(private jsonp: Jsonp) { } 
    ngOnInit(): void { 
    this.auth(); 
    } 
    auth() { 
    gapi.auth.authorize({ 
     'client_id': 'CLIENTID.apps.googleusercontent.com', 
     'scope': 'https://www.google.com/m8/feeds' 
    },() => { 
     this.fetch(gapi.auth.getToken()); 
    }); 
    } 
    fetch(token: any) { 
    this.jsonp.get('https://www.google.com/m8/feeds/contacts/default/full?access_token=' + token.access_token + '&alt=json') 
    .map(data => { 
     return data; 
    }) 
    .subscribe(data => { 
     console.log(data); 
    }); 
    } 
} 

我这没有这个错误发生的正常工作的代码from this sample。所以我只能猜测Angular正在实施一些东西......

+0

你确定这不是重复吗? https://stackoverflow.com/questions/36289495/how-to-make-a-simple-jsonp-asynchronous-request-in-angular-2 – JGFMK

+1

你也不会在地图中返回数据。它通常用于执行诸如将https://www.w3.org/Protocols/rfc2616/rfc2616-sec6.html转换为json有效内容的响应 - 响应包含HTTP头等,以便映射(响应:响应=>响应。 JSON())。你也应该把它重构成一个服务,并把它作为一个Observable返回。理想的接口或领域模型类。我看到您正在订阅Feed。然后,组件应该使用@ Injectable注入@Injectable作为组件构造函数中的私有参数,并将其连接到您的app-module.ts – JGFMK

+0

的@ ngModule providers:[],然后该组件变为... this.service.subscribe (data => this.data = data); – JGFMK

回答

2

Google Contacts API文档有一个指向alt标签如何工作的链接。值'json'并不表示它会返回JSONP数据。 Google会返回该MIME类型,因为它会给你的数据不可执行。

https://developers.google.com/gdata/docs/2.0/reference

尝试使用@angular/http标准get方法,而不是Jsonp

+0

你是对的,谢谢你!我想我对基于它的例子感到困惑,因为那是使用JSONP进行AJAX调用。 –

相关问题