导入和使用 WooCommerce API 后出现空白屏幕答案

【问题标题】：Getting Blank screen after importing and using WooCommerce API导入和使用 WooCommerce API 后出现空白屏幕
【发布时间】：2019-09-23 02:53:44
【问题描述】：

在我的主页中导入 API 后，我尝试在 Ionic4 应用程序中使用 WooCommerce API 我在以下输出屏幕上看不到任何内容是代码：
主页.ts

import { Component } from '@angular/core';
import * as WC from '@woocommerce/woocommerce-rest-api';

@Component({
selector: 'app-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss'],
})
export class HomePage {

//Local Objet WooCommerce of type any
WooCommerce: any;

constructor() {

this.WooCommerce = WC({ 
   url: "https://shop.example.com",
   consumerKey: "ck_fc057c56e5b430c9f4be64c86225e11943647ca1",
   consumerSecret: "cs_12842c6e3c1122e9a17cb5c6b4e33aca3e0199528",
 });

 this.WooCommerce.getAsync("products").then( (data) => {
  console.log(data);
 }, (err) => {
  console.log(err)
 })
 }
 }

使用这个新的 WooCommerce API，当我导入这个 API 时，我的 Ionic 应用程序主页消失了。当我评论这段代码时，它再次出现。这是我导入和使用它的方式。运行此代码后，我在控制台输出：

https://prntscr.com/p8kbmy

【问题讨论】：

我不确定在公共论坛上发布consumerSecret 是否安全。我建议您为您的站点重新生成这些 api 密钥，以防您产生安全问题。
谢谢，发帖前我改了key，现在改网站了。下次我记得不要提钥匙了。谢谢你这么快回复。

标签： woocommerce ionic4 woocommerce-rest-api

【解决方案1】：

根据您的屏幕截图，您遇到了global 未定义的问题。

解决方案seems to be 使用此行自己定义全局：

(window as any).global = window;

打开/src/polyfills.ts并将其添加到底部：

// BUG FIX: Add global to window, assigning the value of window itself.
// https://github.com/socketio/socket.io-client/issues/1166#issuecomment-386195105
(window as any).global = window;

【讨论】：