Ionic 3谷歌登录设备端报错：gapi.auth2.init invalid cookiepolicy

这个问题我之前帮好几个开发者排查过，核心原因是设备端WebView的运行环境和本地浏览器完全不同：本地浏览器是标准的HTTP/HTTPS同源环境，而设备上的WebView要么是file://协议，要么是自定义的应用内部scheme，single_host_origin这个cookie策略依赖浏览器的同源cookie机制，在设备环境里根本不适用，所以才会抛出这个异常。下面给你几个可行的解决办法：

1. 替换cookiepolicy参数值 #

直接把cookiepolicy: 'single_host_origin'改成cookiepolicy: 'none'，这个值会跳过谷歌授权的cookie策略检查，完美适配设备WebView的环境。修改后的代码如下：

private initializeGoogleOAuth2() {
  try {
    this.auth2 = gapi.auth2.init({
      client_id: this.CLIENT_ID,
      cookiepolicy: 'none',
    });
  } catch (error) {
    alert('gapi error' + error)
  }
}

2. 确保gapi在平台就绪后再加载 #

Ionic应用在设备上需要等待原生平台完全初始化，不要在组件的ngOnInit或构造函数里直接调用初始化方法，而是放在Platform.ready()的回调中，保证环境就绪后再加载gapi脚本并初始化：

import { Platform } from 'ionic-angular';

constructor(private platform: Platform) {
  this.platform.ready().then(() => {
    // 先加载gapi脚本，再初始化授权
    this.loadGoogleAuthScript();
  });
}

private loadGoogleAuthScript() {
  const scriptElement = document.createElement('script');
  scriptElement.src = 'https://apis.google.com/js/api:client.js';
  scriptElement.onload = () => {
    this.initializeGoogleOAuth2();
  };
  document.body.appendChild(scriptElement);
}

3. 检查OAuth客户端ID的配置 #

别忽略这个细节：你在谷歌云控制台创建的客户端ID，必须是Android平台类型的，而不是Web应用类型。配置时要确保：

• 包名和你Ionic项目config.xml里的id字段完全一致
• 签名证书指纹要和你打包应用时用的密钥一致（测试阶段可以用调试密钥的指纹）

如果用了Web类型的客户端ID，即使本地浏览器能运行，设备端也会出现权限或策略相关的异常。

内容的提问来源于stack exchange，提问作者Market