Node.js の REST API を使用して Word ドキュメントに注釈を追加する

クラウド上で Word 文書にプログラムで簡単に注釈を付けることができます。画像、コメント、メモ、その他の種類の外部コメントを注釈としてドキュメントに追加できます。この記事では、Node.js の REST API を使用して Word ドキュメントに注釈を追加する方法を学びます。

この記事では次のトピックについて説明します。

Word ドキュメント注釈 REST API および Node.js SDK

DOC または DOCX ファイルに注釈を付けるには、GroupDocs.Annotation Cloud の Node.js SDK API を使用します。コンソールで次のコマンドを使用してインストールしてください。

npm install groupdocs-annotation-cloud

上記の手順に従う前に、ダッシュボードからクライアント ID とシークレットを取得してください。 ID とシークレットを取得したら、以下に示すようにコードを追加します。

global.clientId = "659fe7da-715b-4744-a0f7-cf469a392b73"; 
global.clientSecret = "b377c36cfa28fa69960ebac6b6e36421";
global.myStorage = "";

const configuration = new groupdocs_annotation_cloud.Configuration(clientId, clientSecret);
configuration.apiBaseUrl = "https://api.groupdocs.cloud";

Node.js の REST API を使用して Word ドキュメントに注釈を付ける

以下に示す簡単な手順に従って、DOCX ファイルに注釈を追加できます。

ドキュメントをアップロードする

まず、以下のコード例を使用して、DOCX ファイルをクラウドにアップロードします。

// APIの初期化
var fileApi = new groupdocs_annotation_cloud.FileApi(configuration);
// ローカル/ディスクからIOStreamでファイルを開きます。
var resourcesFolder = 'C:\\Files\\Annotation\\sample.docx';
fs.readFile(resourcesFolder, (err, fileStream) => {
  // アップロードリクエストの作成
  var request = new groupdocs_annotation_cloud.UploadFileRequest("sample.docx", fileStream, myStorage);
  // ファイルをアップロードする
  fileApi.uploadFile(request);
});

その結果、アップロードされた DOCX ファイルは、クラウド上のダッシュボードの ファイル セクション で利用できるようになります。

Node.js で DOCX ファイルに複数のアノテーションを追加する

以下の手順に従って、プログラムで Word 文書に複数の注釈を追加できます。

  • まず、AnnotateApi のインスタンスを作成します。
  • 次に、AnnotationInfo の最初のインスタンスを作成します。
  • 次に、最初のインスタンスの注釈プロパティ (位置、タイプ、テキストなど) を設定します。
  • 上記の手順を繰り返して、AnnotationInfo の複数のインスタンスを追加します。複数のアノテーションを追加するには、インスタンスごとに異なるアノテーション タイプとその他のプロパティを設定します。
  • 次に、FileInfo のインスタンスを作成し、入力ファイルのパスを設定します。
  • 次に、AnnotateOptions のインスタンスを作成します。
  • ここで、FileInfo と定義された注釈インスタンスを AnnotateOptions に割り当てます。
  • また、出力ファイルのパスも設定します。
  • その後、AnnotateOptions を指定して AnnotateRequest メソッドを呼び出します。
  • 最後に、AnnotateRequest で AnnotateApi.annotate() メソッドを呼び出して結果を取得します。

次のコード サンプルは、Node.js の REST API を使用して Word ドキュメントに複数の注釈を追加する方法を示しています。

// APIの初期化
let annotateApi = groupdocs_annotation_cloud.注釈を付けるApi.fromKeys(clientId, clientSecret);

// 距離アノテーションの定義
let a1 = new groupdocs_annotation_cloud.AnnotationInfo();
a1.annotationPosition = new groupdocs_annotation_cloud.Point();
a1.annotationPosition.x = 1;
a1.annotationPosition.y = 1;
a1.box = new groupdocs_annotation_cloud.Rectangle();
a1.box.x = 100
a1.box.y = 100
a1.box.width = 200
a1.box.height = 100
a1.pageNumber = 0
a1.penColor = 1201033
a1.penStyle = groupdocs_annotation_cloud.AnnotationInfo.PenStyleEnum.Solid;
a1.penWidth = 3
a1.opacity = 1
a1.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.Distance;
a1.text = "This is distance annotation";
a1.creatorName = "Anonym A.";

// エリアアノテーションの定義
let a2 = new groupdocs_annotation_cloud.AnnotationInfo();
a2.annotationPosition = new groupdocs_annotation_cloud.Point();
a2.annotationPosition.x = 1;
a2.annotationPosition.y = 1;
a2.box = new groupdocs_annotation_cloud.Rectangle();
a2.box.x = 80
a2.box.y = 400
a2.box.width = 200
a2.box.height = 100
a2.penColor = 1201033;
a2.penStyle = groupdocs_annotation_cloud.AnnotationInfo.PenStyleEnum.Solid;
a2.pageNumber = 0;
a2.penWidth = 3;
a2.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.Area;
a2.text = "This is area annotation";
a2.creatorName = "Anonym A.";

// 矢印アノテーションの定義
let a3 = new groupdocs_annotation_cloud.AnnotationInfo();
a3.annotationPosition = new groupdocs_annotation_cloud.Point();
a3.annotationPosition.x = 1;
a3.annotationPosition.y = 1;
a3.box = new groupdocs_annotation_cloud.Rectangle();
a3.box.x = 100;
a3.box.y = 100;
a3.box.width = 200;
a3.box.height = 100;
a3.pageNumber = 0;
a3.penColor = 1201033;
a3.penStyle = groupdocs_annotation_cloud.AnnotationInfo.PenStyleEnum.Solid;
a3.penWidth = 1;
a3.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.Arrow;
a3.text = "This is arrow annotation";
a3.creatorName = "Anonym A.";

// 楕円注釈を定義する
let a4 = new groupdocs_annotation_cloud.AnnotationInfo();
a4.annotationPosition = new groupdocs_annotation_cloud.Point();
a4.annotationPosition.x = 1;
a4.annotationPosition.y = 1;
a4.box = new groupdocs_annotation_cloud.Rectangle();
a4.box.x = 350;
a4.box.y = 350;
a4.box.width = 200;
a4.box.height = 100;
a4.pageNumber = 0;
a4.penColor = 1201033;
a4.penStyle = groupdocs_annotation_cloud.AnnotationInfo.PenStyleEnum.Solid;
a4.penWidth = 4;
a4.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.Ellipse;
a4.text = "This is ellipse annotation";
a4.creatorName = "Anonym A.";

// 入力ファイルパス
let fileInfo = new groupdocs_annotation_cloud.FileInfo();
fileInfo.filePath = "sample.docx";

// 注釈オプションを定義する
let options = new groupdocs_annotation_cloud.注釈を付けるOptions();
options.fileInfo = fileInfo;
options.annotations = [a1, a2, a3, a4];
options.outputPath = "AddMultipleAnnotations.docx";

// 注釈リクエストの作成
let request = new groupdocs_annotation_cloud.注釈を付けるRequest(options);

// 注釈を付ける
let result = await annotateApi.annotate(request);
Node.js で DOCX ファイルに複数のアノテーションを追加する

Node.js で DOCX ファイルに複数のアノテーションを追加する

注釈付きファイルをダウンロードする

上記のコード サンプルは、注釈付き Word 文書 (DOCX) をクラウド上に保存します。次のコードサンプルを使用してダウンロードできます。

// FileApi を構築する
var fileApi = new groupdocs_annotation_cloud.FileApi(configuration);

// ダウンロードファイルリクエストの作成
let request = new groupdocs_annotation_cloud.DownloadFileRequest("AddMultipleAnnotations.docx", myStorage);
// ダウンロードファイル
let response = await fileApi.downloadFile(request);

// ファイルを作業ディレクトリに保存する
fs.writeFile("C:\\Files\\Annotation\\AddMultipleAnnotations.docx", response, "binary", function (err) { });

Node.js の REST API を使用して Word ドキュメントに画像注釈を追加する

以下の手順に従って、プログラムで Word 文書に画像注釈を追加できます。

  • まず、AnnotateApi のインスタンスを作成します。
  • 次に、AnnotationInfo のインスタンスを作成します。
  • 次に、長方形を定義し、その位置、高さ、幅を設定します。
  • その後、位置、テキスト、高さ、幅などの注釈プロパティを設定します。
  • 次に、注釈のタイプを画像に設定します。
  • 次に、FileInfo のインスタンスを作成し、入力ファイルのパスを設定します。
  • 次に、AnnotateOptions のインスタンスを作成します。
  • 次に、FileInfo オブジェクトと注釈を AnnotateOptions に割り当てます。
  • また、出力ファイルのパスも設定します。
  • その後、AnnotateOptions オブジェクトを引数として AnnotateRequest メソッドを呼び出してリクエストを作成します。
  • 最後に、AnnotateRequest オブジェクトを使用して AnnotateApi.annotate() メソッドを呼び出して結果を取得します。

次のコード サンプルは、Node.js の REST API を使用して Word ドキュメントに画像注釈を追加する方法を示しています。前述の手順に従ってファイルをアップロードおよびダウンロードしてください。

// APIの初期化
let annotateApi = groupdocs_annotation_cloud.注釈を付けるApi.fromKeys(clientId, clientSecret);

// 画像の注釈を定義する
let a1 = new groupdocs_annotation_cloud.AnnotationInfo();
a1.annotationPosition = new groupdocs_annotation_cloud.Point();
a1.annotationPosition.x = 1;
a1.annotationPosition.y = 1;
a1.box = new groupdocs_annotation_cloud.Rectangle();
a1.box.x = 300;
a1.box.y = 320;
a1.box.width = 200;
a1.box.height = 40;
a1.pageNumber = 0;
a1.penColor = 1201033;
a1.penStyle = groupdocs_annotation_cloud.AnnotationInfo.PenStyleEnum.Solid;
a1.penWidth = 1;
a1.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.Image;
a1.text = "This is image annotation";
a1.creatorName = "Anonym A.";
a1.imagePath = "JohnSmith.png";

// 入力ファイルパス
let fileInfo = new groupdocs_annotation_cloud.FileInfo();
fileInfo.filePath = "sample.docx";

// 注釈オプションの定義
let options = new groupdocs_annotation_cloud.注釈を付けるOptions();
options.fileInfo = fileInfo;
options.annotations = [a1];
options.outputPath = "AddImageAnnotation.docx";

// 注釈リクエストの作成
let request = new groupdocs_annotation_cloud.注釈を付けるRequest(options);

// 注釈を付ける
let result = await annotateApi.annotate(request);
Node.js の REST API を使用して Word ドキュメントに画像注釈を追加する

Node.js の REST API を使用して Word ドキュメントに画像注釈を追加する

Node.js の REST API を使用して Word ドキュメントにテキスト フィールドの注釈を追加する

前述の手順に従って、プログラムで Word 文書にテキスト フィールドの注釈を追加できます。ただし、注釈タイプを TextField として設定する必要があります。

次のコード サンプルは、Node.js の REST API を使用して Word ドキュメントにテキスト フィールドの注釈を追加する方法を示しています。前述の手順に従ってファイルをアップロードおよびダウンロードしてください。

// APIの初期化
let annotateApi = groupdocs_annotation_cloud.注釈を付けるApi.fromKeys(clientId, clientSecret);

// テキストフィールドの注釈を定義する
let a1 = new groupdocs_annotation_cloud.AnnotationInfo();
a1.annotationPosition = new groupdocs_annotation_cloud.Point();
a1.annotationPosition.x = 1;
a1.annotationPosition.y = 1;
a1.box = new groupdocs_annotation_cloud.Rectangle();
a1.box.x = 300;
a1.box.y = 310;
a1.box.width = 200;
a1.box.height = 50;
a1.pageNumber = 0;
a1.fontColor = 3093151;
a1.fontSize = 12;
a1.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.TextField;
a1.text = "Text field text";
a1.creatorName = "Anonym A.";

// 入力ファイルパス
let fileInfo = new groupdocs_annotation_cloud.FileInfo();
fileInfo.filePath = "sample.docx";

// 注釈オプションの定義
let options = new groupdocs_annotation_cloud.注釈を付けるOptions();
options.fileInfo = fileInfo;
options.annotations = [a1];
options.outputPath = "AddTextFieldAnnotation.docx";

// 注釈リクエストの作成
let request = new groupdocs_annotation_cloud.注釈を付けるRequest(options);

// 注釈を付ける
let result = await annotateApi.annotate(request);
Node.js の REST API を使用して Word ドキュメントに注釈を追加する

Node.js の REST API を使用して Word ドキュメントにテキスト フィールドの注釈を追加する

Node.js の REST API を使用した Word ドキュメントのウォーターマーク注釈

前述の手順に従って、プログラムで Word 文書に透かし注釈を追加できます。ただし、注釈タイプをウォーターマークとして設定する必要があります。

次のコード サンプルは、Node.js の REST API を使用して Word ドキュメントにウォーターマーク注釈を追加する方法を示しています。前述の手順に従ってファイルをアップロードおよびダウンロードしてください。

// APIの初期化
let annotateApi = groupdocs_annotation_cloud.注釈を付けるApi.fromKeys(clientId, clientSecret);

// 透かし注釈を定義する
let a1 = new groupdocs_annotation_cloud.AnnotationInfo();
a1.annotationPosition = new groupdocs_annotation_cloud.Point();
a1.annotationPosition.x = 1;
a1.annotationPosition.y = 1;
a1.box = new groupdocs_annotation_cloud.Rectangle();
a1.box.x = 100;
a1.box.y = 700;
a1.box.width = 500;
a1.box.height = 100;
a1.pageNumber = 0;
a1.penColor = 1201033;
a1.penStyle = groupdocs_annotation_cloud.AnnotationInfo.PenStyleEnum.Solid;
a1.penWidth = 2;
a1.fontSize = 24;
a1.angle = 75;
a1.type = groupdocs_annotation_cloud.AnnotationInfo.TypeEnum.Watermark;
a1.text = "This is a watermark annotation";
a1.creatorName = "Anonym A.";

// 入力ファイルパス
let fileInfo = new groupdocs_annotation_cloud.FileInfo();
fileInfo.filePath = "sample.docx";

// 注釈オプションの定義
let options = new groupdocs_annotation_cloud.注釈を付けるOptions();
options.fileInfo = fileInfo;
options.annotations = [a1];
options.outputPath = "AddWatermarkAnnotation.docx";

// 注釈リクエストの作成
let request = new groupdocs_annotation_cloud.注釈を付けるRequest(options);

// 注釈を付ける
let result = await annotateApi.annotate(request);
Node.js の REST API を使用した Word ドキュメントのウォーターマーク注釈

Node.js の REST API を使用した Word ドキュメントのウォーターマーク注釈

オンラインで試す

上記の API を使用して開発された、次の無料のオンライン DOCX アノテーション ツールをお試しください。 https://products.groupdocs.app/annotation/docx

結論

この記事では、クラウド上の Word 文書に注釈を追加する方法を学習しました。 Node.js の REST API を使用して、画像フィールドとテキスト フィールドの注釈を DOCX ファイルに追加する方法についても説明しました。この記事では、プログラムで DOCX ファイルをクラウドにアップロードし、編集したファイルをクラウドからダウンロードする方法についても説明しました。さらに、ドキュメント を使用して、GroupDocs.Annotation Cloud API について詳しく学ぶことができます。また、API リファレンス セクションも提供されており、ブラウザーを通じて直接 API を視覚化して操作できるようになります。不明な点がある場合は、フォーラム でお気軽にお問い合わせください。

関連項目