Skip to main content

ライセンス設定

前提​

  • 開発ライセンス購入済であること : localhost 用のライセンスキー発行
  • 配布用ライセンス発行済であること : ドメイン単位で Web 管理画面から発行

対応内容​

  • 初回に1回だけ、wjcCore.setLicenseKey(key) を呼ぶ

初回呼ぶスクリプトを設定​

docusaurus.config.ts
const config: Config = {
  ...
  clientModules: [
    require.resolve('./src/clientModules/set-wijmo-license')
  ],
};
src/clientModules/set-wijmo-license.ts
import License from '@site/src/utils/License'; 
License.setLicenseKey();

ライセンス設定用のクラス例​

ローカルと公開用ドメインでライセンスキーが異なるので、呼び分けるもの。

src/utils/License.ts
import * as wjcCore from '@grapecity/wijmo';

export default class License {
  public static setLicenseKey() {
    if (typeof window !== 'undefined') {
      const host = window.location.hostname;
      const key  = this.Keys.get(host);
      if (key == null) {
        console.error(`LicenseKey for [${host}] is not defined.`);
        return;
      }
      console.log('set license');
      wjcCore.setLicenseKey(key);
    }
  }
  private static Keys: Map<string, string> = new Map([
    ['localhost'        , 'XXXXXXXXXXXXXXXXXXXX'],
    ['sugoi-domain.com' , 'sugoi-domain.com,XXXXXXXXXXXX'],
  ]);
}

(参考) 改善案​

こんなふうにした方が良いかもしれない

  • setLicenseKey(process.env.WIJMO_LICENSE_KEY);
  • .env ファイルに WIJMO_LICENSE_KEY=... として保存

ただ、こうするいは dotenv-webpack などの対応が必要（Docusaurus v3 は .env 読み込みにやや工夫が必要）

(参考) NGだった方式: src/theme/Layout/index.tsx の useEffect​

src/theme/Layout/index.tsx は初回で読み込まれるが、
Wijmo のライセンスチェックよりタイミングが遅いようだ。

src/theme/Layout/index.tsx
import React, { useEffect } from 'react';
import Layout from '@theme-original/Layout';

import License from '@site/src/utils/License'; 

export default function LayoutWrapper(props) {
  useEffect(() => {
    License.setLicenseKey();
  }, []);

  return <Layout {...props} />;
}
Last updated on