帳票出力

このページではCreate!Form Cloudで帳票出力を行う方法について説明します。
帳票定義のアップロード、プレビュー実行、そして本番出力まで、帳票出力に必要な一連の手順を順を追って説明します。

帳票定義をアップロードする

この手順では、帳票出力するために帳票定義が入っている作業ディレクトリをアップロードする手順について説明します。
事前準備で準備したサンプル帳票「仕入品購入申請書」の作業ディレクトリ「01_申請・申込書」をアップロードします。

ログイン後に表示される帳票定義画面で、[アップロード]ボタンをクリックします。

図1：作業ディレクトリアップロード
[フォルダーを選択]ボタンをクリックして、サンプル帳票「仕入品購入申請書」が保存されている作業ディレクトリ「01_申請・申込書」を選択します。

図2：作業ディレクトリのアップロードモーダル
[アップロード]ボタンをクリックして、作業ディレクトリ「01_申請・申込書」をアップロードします。
表示されている作業ディレクトリの処理内容を確認します。
[作業ディレクトリ名]が「01_申請・申込書」であることを確認し、問題がなければ[はい]ボタンをクリックします。

図3：作業ディレクトリの処理内容を確認
アップロード完了後、[作業ディレクトリのアップロード]モーダルを閉じます。

図4：作業ディレクトリのアップロードモーダルを閉じる

※対応していない拡張子のファイルはアップロードされません。
　対応しているファイルの拡張子については、「1.概要・制限事項」の作業ディレクトリのアップロードを参照してください。
帳票定義画面に作業ディレクトリ「01_申請・申込書」が表示されます。

図5：作業ディレクトリアップロード後

Note

この手順で使用する帳票定義では、出力設定ファイルを使用しません。
帳票出力時にQDFファイルを指定する場合や、外字・埋め込みフォントを含む帳票出力する場合など、一部の帳票定義では出力設定ファイルのアップロードが必要です。
出力設定の詳細については、出力設定を参照してください。

プレビュー実行をする

この手順では、サンプル帳票のプレビュー実行の方法について説明します。
プレビュー実行を行い出力された帳票を確認することで、予期せぬ帳票レイアウトの崩れやデータソースの誤りなどを事前に確認できます。

作業ディレクトリ一覧で作業ディレクトリ「01_申請・申込書」をクリックして帳票定義一覧を開きます。
「01_申請・申込書」内の「仕入品購入申請書」を選択し、[プレビュー実行]ボタンをクリックします。

図6：プレビュー実行
使用するデータソースのZIPファイルを作成します。
本帳票では、帳票内に画像を出力するため、画像ファイルをデータソースとしてZIPファイルに含めます。
作業ディレクトリ「01_申請・申込書」内に「A01_ShiireKounyu.zip」という名前で作成します。
ZIPファイルには以下のファイルを含めます。
（ZIPファイルの直下に各ファイルが配置されるように圧縮してください）
- 「A01_ShiireKounyu.csv」
- 作業ディレクトリ「01_申請・申込書」内の画像ファイル
  - 「shibuya.JPG」
  - 「shinjuku.JPG」
Note

ZIPデータソースの作成方法や注意点については、補足情報を参照してください。
[プレビュー実行]モーダルのStep1で、前の手順で作成した「A01_ShiireKounyu.zip」を選択します。

図7：プレビュー実行モーダルStep1
Step2で文字コード、オプション設定を行います。
このサンプルではサンプルデータの文字コードがShift_JISのため、Step2で文字コードを「SJIS」に変更します。

図8：プレビュー実行モーダルStep2
Step3の確認で内容を確認し、[出力]ボタンをクリックします。

図9：プレビュー実行モーダルStep3
プレビュー実行が完了すると、出力されたPDFが表示されます。
プレビュー内容を確認後、[プレビュー実行]モーダルを閉じます。

帳票出力する

この手順ではサンプルコードを使用して帳票出力APIを実行し、帳票出力する手順について説明します。
本番モードで帳票出力するまでの流れを解説します。
テストモードと本番モードの詳細については、テスト/本番を参照してください。

[サンプルコード]ボタンをクリックすると[サンプルコード生成]モーダルが表示されます。
選択した帳票名が「仕入品購入申請書」であれば[次へ]ボタンをクリックします。

図10：サンプルコード生成モーダル
Step1のオプション選択モーダルが表示されるので、文字コードを「SJIS」に変更します。

図11：サンプルコード生成モーダルStep1
Step2では、Step1で設定した内容が正しく反映されているかを確認します。
文字コードが「SJIS」になっているか、帳票名・帳票IDが意図したものになっているかを確認し、問題なければ[出力]ボタンをクリックします。

図12：サンプルコード生成モーダルStep2
使用するプログラム言語を選択してコピーアイコンボタンをクリックします。
コピーしたコードを、プログラム言語ごとに指定された方法で保存します。

Pythonのコードを保存

任意のフォルダーに「output_form.py」という名前でファイルを作成し、
コピーしたコードを貼り付けて保存します。

Node.jsのコードを保存

ライブラリをインストールしたnpmプロジェクトのフォルダー内に「output_form.js」という名前でJavaScriptファイルを作成し、
コピーしたコードを貼り付けて保存します。

Fetch APIのコードを保存

任意のフォルダーに「output_form.html」という名前でHTMLファイルを作成し、
コピーしたコードを貼り付けて保存します。

Javaのコードを保存

pom.xmlの<mainClass>に指定したクラス名を「main」とし「main.java」というJavaファイルを作成して、コピーしたコードを貼り付けて保存します。
package宣言は、Mavenプロジェクトのパッケージ構成に合わせて調整してください。
サンプルコードではpublicクラスを定義しているため、クラス名とファイル名を一致させてください。

保存後、[サンプルコード生成]モーダルを閉じます。

図13：サンプルコード生成モーダルコードコピー
API画面を開き、APIトークンの右側にあるコピーアイコンボタンをクリックしてAPIトークンをコピーします。

図14：APIトークンをコピー

サンプルコード内の変数の値を変更します。

サンプルコード生成で作成したコード内の変数の値を、実行環境に合わせて変更します。

Python環境の場合

変更が必要な設定	変更前のコード	変更後のコード	補足
APIトークン	`api_token = 'yourApiToken'`	`api_token = 'APIトークンを入力'`	1つ前の手順でコピーしたAPIトークンを指定します。
データソース	`data_source_path = '/path/datasource.zip'`	`data_source_path = r'C:\ProgramData\Infotec\CreateForm\12\work\sample\01_申請・申込書\A01_ShiireKounyu.zip'`	LF形式に変換したデータソース、画像ファイルが入っている「A01_ShiireKounyu.zip」のパスを指定します。
出力ファイルパス	`output_file_path = '/path/output.pdf'`	`output_file_path = r'C:\ProgramData\Infotec\CreateForm\12\work\sample\01_申請・申込書\A01_ShiireKounyu.pdf'`	出力する帳票のパスを指定します。

Node.js環境の場合

変更が必要な設定	変更前のコード	変更後のコード	補足
APIトークン	`const apiToken = 'yourApiToken';`	`const apiToken = 'APIトークンを入力';`	1つ前の手順でコピーしたAPIトークンを指定します。
データソース	`const dataSourcePath = '/path/datasource.zip';`	`const dataSourcePath = 'C:\\ProgramData\\Infotec\\CreateForm\\12\\work\\sample\\01_申請・申込書\\A01_ShiireKounyu.zip';`	LF形式に変換したデータソース、画像ファイルが入っている「A01_ShiireKounyu.zip」のパスを指定します。
出力ファイルパス	`const outputFilePath = '/path/output.pdf';`	`const outputFilePath = 'C:\\ProgramData\\Infotec\\CreateForm\\12\\work\\sample\\01_申請・申込書\\A01_ShiireKounyu.pdf';`	出力する帳票のパスを指定します。

Java環境の場合

変更が必要な設定	変更前のコード	変更後のコード	補足
APIトークン	`String apiToken = "yourApiToken";`	`String apiToken = "APIトークンを入力";`	1つ前の手順でコピーしたAPIトークンを指定します。
データソース	`String dataSourcePath = "/path/datasource.zip";`	`String dataSourcePath = "C:\\ProgramData\\Infotec\\CreateForm\\12\\work\\sample\\01_申請・申込書\\A01_ShiireKounyu.zip";`	LF形式に変換したデータソース、画像ファイルが入っている「A01_ShiireKounyu.zip」のパスを指定します。
出力ファイルパス	`String outputFilePath = "/path/output.pdf";`	`String outputFilePath = "C:\\ProgramData\\Infotec\\CreateForm\\12\\work\\sample\\01_申請・申込書\\A01_ShiireKounyu.pdf";`	出力する帳票のパスを指定します。

Fetch API環境の場合

変更が必要な設定	変更前のコード	変更後のコード	補足
APIトークン	`const apiToken = "yourApiToken";`	`const apiToken = 'APIトークンを入力';`	1つ前の手順でコピーしたAPIトークンを指定します。
出力ファイル名	`const outputFileName = 'output.pdf';`	`const outputFileName = 'A01_ShiireKounyu.pdf';`	出力する帳票のファイル名を指定します。

帳票定義画面を開き、「01_申請・申込書」内の「仕入品購入申請書」を選択し詳細にある設定の[テスト/本番]を「本番」に変更します。

図15：設定を本番モードに変更

Warning

本番モードでAPIから帳票出力された場合は契約した出力枚数を消費します。
なお、トライアルの場合は出力枚数が消費されますが、料金は発生しません。

※ 本番モードでの出力はコストが発生するため、内容を十分に理解したうえで次の手順に進んでください。
サンプルコードを実行します。
Python環境で実行

作成したソースファイルがあるフォルダーで以下のコマンドを実行します。
```
python output_form.py（または python3 output_form.py）
```
Node.js環境で実行

作成したソースファイルがあるフォルダーで以下のコマンドを実行します。
```
node output_form.js
```
Fetch APIで実行

サンプルコード生成で作成したHTMLファイルをブラウザで開いて実行します。
データソースファイル「A01_ShiireKounyu.zip」を選択してPDF出力ボタンをクリックすると、帳票出力APIが実行され、PDFをダウンロードできます。
Java環境で実行

Mavenプロジェクトとして作成された場合、pom.xmlがあるディレクトリで以下のコマンドを実行します。
```
mvn compile
mvn exec:java
```
出力結果を確認します。

Python/Node.js/Javaの場合

出力ファイルパスを指定する変数output_file_pathで指定したパスにPDFファイルが生成されていることを確認します。
出力されたPDFファイルを開き、内容が正しく表示されていることを確認します。

Fetch APIの場合

帳票出力APIの実行後、ブラウザからPDFファイルがダウンロードされます。
ダウンロードされたPDFファイルを開き、内容が正しく表示されていることを確認します。

※本番モードで出力したファイルのため「C!」の透かしが入っていません。

次のステップ

次のステップの帳票出力後の確認では、帳票出力のログとコストの確認方法を説明します。