Angular -如何导入googleapis库？

Question

我正在尝试将Google Drive API整合到我的一个项目中。Node.js quick start guide要求我导入文件读取和googleapis库。但是，当我尝试这样做时，在将其导入到app.module.ts或任何组件时遇到了问题:组件导入代码：

import { Injectable } from '@angular/core';
import {google, drive_v3} from 'googleapis'
const drive = google.drive({version: 'v3'});
@Injectable({
  providedIn: 'root'
})
export class SubscriptionService {
  constructor () {}
}

错误：

ERROR in ./node_modules/google-auth-library/build/src/auth/googleauth.js
Module not found: Error: Can't resolve 'child_process' in '...\node_modules\google-auth-library\build\src\auth'
ERROR in ./node_modules/google-auth-library/build/src/crypto/node/crypto.js
Module not found: Error: Can't resolve 'crypto' in '...\node_modules\google-auth-library\build\src\crypto\node'
ERROR in ./node_modules/jwa/index.js
Module not found: Error: Can't resolve 'crypto' in '...\node_modules\jwa'
ERROR in ./node_modules/google-auth-library/build/src/auth/googleauth.js
Module not found: Error: Can't resolve 'fs' in '...\node_modules\google-auth-library\build\src\auth'
ERROR in ./node_modules/google-p12-pem/build/src/index.js
Module not found: Error: Can't resolve 'fs' in '...\node_modules\google-p12-pem\build\src'
ERROR in ./node_modules/googleapis-common/build/src/discovery.js
Module not found: Error: Can't resolve 'fs' in '...\node_modules\googleapis-common\build\src'
ERROR in ./node_modules/gtoken/build/src/index.js
Module not found: Error: Can't resolve 'fs' in '...\node_modules\gtoken\build\src'
ERROR in ./node_modules/agent-base/patch-core.js
Module not found: Error: Can't resolve 'https' in '...\node_modules\agent-base'
ERROR in ./node_modules/https-proxy-agent/index.js
Module not found: Error: Can't resolve 'net' in '...\node_modules\https-proxy-agent'
ERROR in ./node_modules/google-auth-library/build/src/auth/googleauth.js
Module not found: Error: Can't resolve 'os' in '...\node_modules\google-auth-library\build\src\auth'
ERROR in ./node_modules/google-auth-library/build/src/auth/googleauth.js
Module not found: Error: Can't resolve 'path' in '...\node_modules\google-auth-library\build\src\auth'
ERROR in ./node_modules/gaxios/build/src/gaxios.js
Module not found: Error: Can't resolve 'stream' in '...\node_modules\gaxios\build\src'
ERROR in ./node_modules/google-auth-library/build/src/auth/oauth2client.js
Module not found: Error: Can't resolve 'stream' in '...\node_modules\google-auth-library\build\src\auth'
ERROR in ./node_modules/googleapis-common/build/src/apirequest.js
Module not found: Error: Can't resolve 'stream' in '...\node_modules\googleapis-common\build\src'
ERROR in ./node_modules/jws/lib/data-stream.js
Module not found: Error: Can't resolve 'stream' in '...\node_modules\jws\lib'ERROR in ./node_modules/jws/lib/sign-stream.js
Module not found: Error: Can't resolve 'stream' in '...\node_modules\jws\lib'ERROR in ./node_modules/jws/lib/verify-stream.js
Module not found: Error: Can't resolve 'stream' in '...\node_modules\jws\lib'ERROR in ./node_modules/https-proxy-agent/index.js
Module not found: Error: Can't resolve 'tls' in '...\node_modules\https-proxy-agent'

如何在Angular中正确导入googleapis库？我试着按照很多人的建议将下面的脚本导入添加到index.html中，但似乎不起作用(参见评论)。

<script src="https://apis.google.com/js/api.js"></script>

我还确保执行以下安装：

npm install --save @types/gapi
npm install --save @types/gapi.auth2
npm install --save @types/gapi.client.drive

Answer 1

googleapis (和google-auth-library)是一个NodeJS库。你不能直接在前端项目中使用它。有一些变通方法--参见https://medium.com/angular-in-depth/google-apis-with-angular-214fadb8fbc5 (但我没有亲自尝试过，所以不推荐)。

这是因为您无法通过import导入它。要使TS编译器满意(假设您已经安装了类型@types/gapi*)，请在访问gapi全局对象的文件中添加此导入：

/// <reference types="gapi.client. drive" />