---
title: "Advanced I/O functionの設定"
url: https://docs.catalyst.zoho.com/ja/tutorials/payslip-generator-app/nodejs/configure-function/
description: "Catalystコンポーネントを使用して、動的なカスタム給与明細テンプレートからPDFドキュメントを生成し、生成したドキュメントをエンドユーザーにメールで送信する基本的なWebアプリを構築します。"
last_updated: 2026-08-17T12:16:04Z
service: All Services
type: tutorial
related_links:
  - name: "Functions"
    url: /ja/serverless/help/functions/introduction/
  - name: "Advanced I/O Functions"
    url: /ja/serverless/help/functions/advanced-io/
  - name: "Functionsディレクトリ構造"
    url: /ja/cli/v1/project-directory-structure/functions-directory/
---

# Advanced I/O Functionの設定

次に、ファンクションコンポーネントを設定して、Payslip Generatorアプリケーションのコーディングを開始します。

[ファンクションのディレクトリ](https://docs.catalyst.zoho.com/ja/cli/v1/project-directory-structure/functions-directory)（`functions/payslip_generator_function`）には以下が含まれています：
* `index.js` メインファンクションファイル
* `catalyst-config.json` 設定ファイル
* Nodeモジュール
* [`package.json`](https://docs.npmjs.com/files/package.json) および [`package-lock.json`](https://docs.npmjs.com/configuring-npm/package-lock-json.html) 依存関係ファイル

`index.js`ファイルにコードを追加します。

Advanced I/O functionには以下の機能が含まれています：
* [PDF & Screenshot SDK](https://docs.catalyst.zoho.com/ja/sdk/nodejs/v2/smartbrowz/generate-pdfnscreenshot/#generate-visual-documents-using-template)をトリガーして、ヘッドレスブラウザを実行し、入力された詳細情報をテンプレートにレンダリングしてPDFドキュメントを生成します。

* [Send Mail SDK](https://docs.catalyst.zoho.com/ja/sdk/nodejs/v2/cloud-scale/mail/send-email/)をトリガーして、PDFドキュメントを添付し、アプリケーション内からメールで送信します。

### Node.js用Expressフレームワークのインストール

Advanced I/O functionのコーディングには、[Expressフレームワーク](https://expressjs.com/)を使用します。ファンクションのコードでExpressパッケージをインポートするには、システムにExpress依存関係をインストールする必要があります。

ローカルマシンに`Express.js`をインストールするには、ターミナルでファンクションのホームディレクトリ（`functions/payslip_generator_function`）に移動し、以下のコマンドを実行します：

```sh
npm install express --save
```

これにより、Expressモジュールがインストールされ、依存関係が保存されます。
![catalyst_payslip_express_install](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/catalyst_payslip_express_install.webp)

この情報は`package.json`ファイルにも更新されます。
![catalyst_payslip_package_json](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/catalyst_payslip_package_json.webp)

それでは、Advanced I/O functionのコーディングを開始しましょう。

以下のコードをコピーして、プロジェクトの`functions/payslip_generator_function`ディレクトリにある`index.js`に貼り付けて、ファイルを保存します。アプリケーションのファイルの作業には、お好みのIDEを使用できます。

> **Note:** 

* このセクションのコードをよく読んで、完全に理解してください。

* **33**行目に**Template ID**を、**68**行目に設定済みの**メールID**を入力してください。

**index.js**

```javascript
'use strict'
const express = require('express')
const catalyst = require('zcatalyst-sdk-node')
const fs = require('fs')
const app = express()
const os = require('os')
const path = require('path')
app.use(express.json())
app.post('/generatepayslip', async (req, res) => {
  try {
    const catalystApp = catalyst.initialize(req)
    const smartbrowz = catalystApp.smartbrowz()
    if (!req.body) {
      throw new Error('Request body is empty')
    }
    const {
      employeeName,
      employeeEmail,
      employeeId,
      designation,
      basicSalary,
      allowances,
      deductions,
      paymentMethod
    } = req.body
    const date = new Date()
    const currentMonth = date.toLocaleString('default', { month: 'long' })
    const currentYear = date.getFullYear()
    const filepath = path.join(os.tmpdir(), '/payslip.pdf')
    // テンプレートから出力を生成
    await smartbrowz
      .generateFromTemplate('xxxxxxxx12345', // Template IDを入力してください
        {
        // クライアントから取得したテンプレートに渡すデータ
          template_data: {
            company: 'Zylker Technologies',
            employeeName,
            employeeId,
            designation,
            basicSalary,
            allowances,
            deductions,
            totalEarnings:
            parseFloat(basicSalary) + parseFloat(allowances),
            netSalary:
            parseFloat(basicSalary) +
            parseFloat(allowances) -
            parseFloat(deductions),
            paymentMethod,
            month: currentMonth,
            year: currentYear
          }
        })
      .then((inputStream) => {
        return new Promise((resolve, reject) => {
          inputStream
            .pipe(fs.createWriteStream(filepath))
            .on('close', resolve)
            .on('error', reject)
        })
      }).catch((err) => {
        throw err
      })
    await catalystApp
      .email()
      .sendMail({
        from_email: 'emmy@zylker.com', // コンソールで設定したメールIDを入力してください
        to_email: [employeeEmail],
        html_mode: true,
        subject: `Payslip for the month of ${currentMonth} ${currentYear}`,
        content: `Hello ${employeeName}, Your payslip for ${currentMonth} ${currentYear} has been issued. You can find your payslip attached with this email. Cheers,Zylker`,
        attachments: [fs.createReadStream(filepath)] // ファイル添付用のファイルストリームを作成
      })
      .then((row) => {
        res.status(200).send('Payslip generated and sent to Employee email')
      })
      .catch((err) => {
        throw err
      })
  } catch (error) {
    console.log(error)
    res.status(500).send(error)
  }
})
module.exports = app

```

ファンクションディレクトリの設定が完了しました。次に、クライアントディレクトリの設定に進みます。