パフォーマンス改善テクニック(FileMaker WebDirect と Web ビューア)を読んで、ヘルプの重要性を再確認した話

こんにちは。

株式会社フルーデンスの小巻です。

2023年11月8日・9日・10日に、Claris Engage Japan 2023が開催されました。

久々のオフラインでの開催となり、すごく刺激的で楽しかったです。本当にありがとうございました。関係者の皆様、本当にお疲れ様でした。

今回は、2023年11月08日 16:00 からのセッション ( T-5 「Claris FileMaker パフォーマンス改善テクニック(Database処理負荷とデータトラフィックの低減 )」 ) の中で発表された内容において、ヘルプとは違い難易度の高い方法を提示されていると感じましたので、本記事を作成しました。

本記事の目的

ヘルプを確認する重要性を伝えるためです。

また、私自身も間違えて発信することはありますので、自戒の念を込めて記事をかいております。

登壇者の方に対して、なにかしらの意図があるわけではありません。

対象の読者

FileMaker Pro、FileMaker Go、WebDirectにおいて、効率よく Webビューア + JavaScript を活用したい方

上記の方以外は、本記事を読む必要はありません。

環境について

FileMaker Server 20.2.1.19

該当のセッションについて

具体的には、以下のYouTubeで公開されているセッション動画の「38:20」以降に説明している内容になります。

セッション内容の確認と、ヘルプとの相違点

セッション内容

上記の「対象の読者」にも記載している通り、FileMaker Pro、FileMaker Go、WebDirectにおいて、効率よく同じコードでWebビューア + JavaScript を活用したいという説明がされております。

YouTubeの動画を確認しますと、概ね、以下のような内容だと思います。

  1. 例として、サンプルとなるHTMLのコードをフィールドに保存する。
  2. FileMaker Pro、WebDirectで、HTMLが正しく表示されるか確認する。
  3. FileMaker Proでは表示されるが、WebDirectでは表示されない。
  4. そのため、FileMaker Serverの公開ディレクトリにサンプルのHTMLを配置して、そのURLをWebビューアで読み込む方法を提示している。
  5. URLを参照することで、FileMaker Proでも、WebDirectでも、同じように表示される。

続きを読む →

created-and-released-an-api-to-generate-qr-codes-01
2件のコメント

FileMakerからQRコードを生成するためのAPIを公開しました

こんにちは。株式会社フルーデンスの小巻です。

タイトルの通り、FileMakerからQRコードを生成するためのAPIを公開しましたので、APIを説明するための記事になります。

現状のFileMakerでは、標準の機能で、QRコードを生成することはできません。

FileMakerからQRコードを生成するためには、MBSプラグインやその他の専用のプラグインを利用するケースが多いのではないかと思います。

弊社でも、今までは上記で書いたように、プラグインを使ってQRコードを生成しておりましたが、APIを作れば良いのではないか?と思い立ち、APIを作成することにしました。

対象者

  • FileMakerからQRコード(オブジェクトフィールドで管理)を生成したい方

メリット

  • 「URLから挿入」ステップのみで生成できる。
  • 1回の処理で100個のQRコードを生成できる。
  • プラグインのインストールが不要。

デメリット

  • オフライン環境下では、QRコードを生成できない。

仕組み

今回のAPI公開にあたり、主に以下のAWSのサービスを利用しています。

上記の内容について、簡易的な記事を公開しておりますでの、興味のある方はご確認ください。

続きを読む →

FileMaker から S3 や EC2 などの AWS の API を利用する方法

こんにちは。株式会社フルーデンスの小巻です。

タイトルの通り、FileMaker から S3 や EC2 などの AWS の API を利用する方法についての解説記事です。

今までは、FileMaker で画像や動画などのファイルを使う場合、Dropbox を使って実装するケースが多くありました。
しかし、昨今では、AWS EC2 で FileMaker Server を利用するケースや、BIツールとして Amazon QuickSight と連携したり、Amazon API Gateway や AWS Lambda、Amazon SES を利用するケースも増えてきました。

そのため、オブジェクトフィールドの代替手段として、Dropbox に加えて S3 で実装するケースが増えてきました。

S3 は容量を気にすることなく始めることができますし、Cyberduck や Mountain Duck などを使うことで、いろいろなケースで使えるメリットもあります。

S3 に限らず、FileMaker から AWS の API を利用できるようになれば、EC2・Lambda・QuickSight など、いろいろな用途で利用できる幅が増えると思います。

また、昨今では、開発者の中でも Claris Connect や Zapier、Make(旧Integromat)などの GUI でアプリ連携をするサービスを使う人も増えてきました。

大変便利ですが、連携されていないアプリの API は利用できないということになります。

メインのサービスが連携されているので、ほとんどのケースをカバーできるので良いのかもしれませんが、個人的にはドキュメントを読み、手を動かし実装する方法についても多くの人に挑戦して頂ければと思います。

対象者

  • AWS の API の署名の作成方法を理解したい方
  • 様々な AWS の API を、SDKやライブラリを使わずに実行したい方

初めに

最近では、Google や Microsoft、Dropbox などの API を利用する際は、OAuth 2.0 を理解していれば、ほとんどの API が利用できる状況です。

しかし、AWS の API は、リクエスト情報をもとに署名を作成し、ヘッダーに作成した署名を設定する必要があります。

そのため、OAuth 2.0 とは少し違う方法で API を実行する必要があります。

今回は、FileMaker から S3 の API を利用する想定で、署名の作成方法や実際にリクエストする方法までの工程を解説します。

公式ドキュメント

詳細については、以下のドキュメントを見ていただければと思います。

今回はの記事では、以下のドキュメントに書いている以上のことは記載していません。
そのため、以下のドキュメントを理解されている方は、記事を読む必要はありません。

AWS API リクエストの署名

how-to-use-aws-apis-s3-ec2-from-filemaker-37

署名バージョン 4 の署名プロセス

how-to-use-aws-apis-s3-ec2-from-filemaker-38

署名バージョン 4 を使用した AWS リクエストへの署名

how-to-use-aws-apis-s3-ec2-from-filemaker-39

環境

私の環境は以下の通りです。

  • macOS Monterey (v12.6.1)
  • FileMaker Pro 19.6.1.45

curl コマンドの具体例とデモ動画

ドキュメントの通りに進めていき、最終的に署名が作成できましたら、以下のような curl コマンドをリクエストします。

今回の記事を通して、オプションの `–header “Authorization: XXXXX” ` という値を作成する方法を理解して頂ければと思います。

curl コマンド

S3の “demo-eib5t-filemaker” バケットにある “animal_chara_radio_azarashi.png” というpngファイルを取得する際のコマンドになります。

URL
https://demo-eib5t-filemaker.s3.us-east-1.amazonaws.com/animal_chara_radio_azarashi.png

curlオプション
--request GET
--header "Authorization: AWS4-HMAC-SHA256 Credential=yourAaccessKeyId/20221130/us-east-1/s3/aws4_request, SignedHeaders=host;x-amz-content-sha256;x-amz-date, Signature=d36d49c86a509378e7b75ebd0730d86e9a8dcec4b8508543bb6bf0af98b7fe66"
--header "x-amz-content-sha256: e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855"
--header "x-amz-date: 20221130T044954Z"
--show-error
--dump-header $dumpHeader
--FM-return-container-variable
--output "animal_chara_radio_azarashi.png"

デモ動画

サンプルファイルを使いデモ動画を準備しました。

続きを読む →

1件のコメント

API GatewayとAWS Lambda(Node.js)を使いQRコードを生成するAPIを作成する その2

こんにちは。

株式会社フルーデンスの小巻です。

今回はタイトルの通り、API GatewayとAWS Lambda(Node.js)を使いQRコードを生成するAPIを作成する方法を書きます。


更新履歴

2023年9月25日

2023年9月25日に、以下の記事を公開しました。
簡易的にQRコードを生成できるようになりましたので、興味がありましたら、ご確認ください。

FileMakerからQRコードを生成するためのAPIを公開しました | フルーデンス

FileMakerからQRコードを生成するためのAPIを公開しました


以前、API GatewayとAWS Lambda(Node.js)を使い効率よくWebサービスと連携する その1という記事を書きましたので、その続編になります。

内容は以下の通りです。

目次

  • ローカルでコードを書く
  • AWS Lambda レイヤーを活用する
  • AWS Lambdaで関数を作成する
  • Amazon API GatewayでAPIを作成する
  • Amazon API GatewayのAPIキーを活用する

環境

  • macOS Catalina 10.15.6
  • FileMaker Pro 19.1.2.219

前提

  • AWSのアカウントを作成していること
  • nodeをインストールしていること

少しコードを書きますが、簡単なコードなので、興味がある方は是非とも手を動かして頂ければと思います。

私もNode.jsを勉強中のため、コードに誤りがあったり、より良いコードがあるようでしたらご指摘頂ければと思います。

API化するメリット

  • オンラインであれば、URLから挿入ステップで簡単に作成できる。
  • (開発者として考えると)さまざまなソリューションで使い回せる。

QRコード生成のイメージ

今回のブログの作業が完了すると、FileMakerから簡単にQRコードを生成できます。

filemaker-aws-apigateway-lambda-qrcode-1

filemaker-aws-apigateway-lambda-qrcode-2

// # --- sample param
// # {
  "text": "FileMaker開発者でVimを使っている人はいますか?",
  "options": {
    "type": "png",
    "margin": 0,
    "scale": 4,
    "color": {
      "dark": "#000",
      "light": "#0000"
    }
  }
}
# 
# --- set param
変数を設定 [ $param ; 値: "" ] 
変数を設定 [ $param ; 値: JSONSetElement ( $param ; "text" ; qrcode::text ; JSONString ) ] 
変数を設定 [ $param ; 値: JSONSetElement ( $param ; "options.type" ; qrcode::options_type ; JSONString ) ] 
変数を設定 [ $param ; 値: JSONSetElement ( $param ; "options.margin" ; qrcode::options_margin ; JSONNumber ) ] 
変数を設定 [ $param ; 値: JSONSetElement ( $param ; "options.scale" ; qrcode::options_scale ; JSONNumber ) ] 
変数を設定 [ $param ; 値: JSONSetElement ( $param ; "options.color.dark" ; qrcode::options_color_dark ; JSONString ) ] 
変数を設定 [ $param ; 値: JSONSetElement ( $param ; "options.color.light" ; qrcode::options_color_light ; JSONString ) ] 
# 
変数を設定 [ $debug_url ; 値: api_qrcode_url ] 
変数を設定 [ $debug_option ; 値: api_qrcode_option ( api_qrcode_key ; $param ) ] 
# 
# --- curl
変数を設定 [ $result ; 値: "" ] 
URL から挿入 [ 選択 ; ダイアログあり: オフ ; ターゲット: $result ; api_qrcode_url ; SSL 証明書の検証 ; cURL オプション: api_qrcode_option ( api_qrcode_key ; $param ) ] 
# 
# --- qrcode result
変数を設定 [ $statusCode ; 値: JSONGetElement ( $result ; "statusCode" ) ] 
変数を設定 [ $body ; 値: JSONGetElement ( $result ; "body" ) ] 
If [ $statusCode = 200 ] 
	# --- ok
	フィールド設定 [ qrcode::qrcode ; Base64Decode ( $body ; "qrcode.png" ) ] 
Else
	# --- error
	警告音
	カスタムダイアログを表示 [ "error" ; $body ] 
End If
# 
現在のスクリプト終了 [ テキスト結果:    ] 

filemaker-aws-apigateway-lambda-qrcode-3

"https://api.frudens.com/test-qrcode/"

filemaker-aws-apigateway-lambda-qrcode-4

Let (
$____body____ = _body ;

Substitute (
List (

"--request POST " ;
"--header 'x-api-key: __key__' " ;
"--data-binary @$____body____ "

)  ; /*list*/

[ _singleQuotation_ ; _doubleQuotation_ ] ;
[ "__key__" ; _key ]

) /*substitute*/

) /*let*/

filemaker-aws-apigateway-lambda-qrcode-5

オブジェクトフィールドをエクスポートして…

ターミナルで確認します。

filemaker-aws-apigateway-lambda-qrcode-6

(ins) teruhiro@MacBook-Pro-13:~ $ zbarimg Desktop/qrcode.png
QR-Code:FileMaker開発者でVimを使っている人はいますか?
scanned 1 barcode symbols from 1 images in 0.01 seconds

        . EAN/UPC (EAN-13, EAN-8, EAN-2, EAN-5, UPC-A, UPC-E, ISBN-10, ISBN-13)
        . DataBar, DataBar Expanded
        . Code 128
        . Code 93
        . Code 39
        . Codabar
        . Interleaved 2 of 5
        . QR code
        . SQ code
  - is the barcode large enough in the image?
  - is the barcode mostly in focus?
  - is there sufficient contrast/illumination?
  - If the symbol is split in several barcodes, are they combined in one image?
  - Did you enable the barcode type?
    some EAN/UPC codes are disabled by default. To enable all, use:
    $ zbarimg -S*.enable 
    Please also notice that some variants take precedence over others.
    Due to that, if you want, for example, ISBN-10, you should do:
    $ zbarimg -Sisbn10.enable 

続きを読む →

FileMaker 19の新機能「Web ビューアで JavaScript を実行」の使い方とインスペクタの活用方法

こんにちは。

株式会社フルーデンスの小巻です。

2020年05月21日にFileMaker 19がリリースされました。

今回は、タイトルの通りFileMaker 19の新機能「Web ビューアで JavaScript を実行」の使い方とインスペクタの活用方法について書きます。

サンプルファイル

以下のリポジトリからCloneか、ダウンロードしてください。

https://github.com/frudens/filemaker-webviewer-javascript

https://github.com/frudens/filemaker-webviewer-javascript/archive/master.zip

filemaker19-perform-javascript-in-web-viewer-15

filemaker19-perform-javascript-in-web-viewer-16

FileMakerからWeb ViewerのJavaScriptを実行(イメージ)

以下のスクショのように実行できます。

左のFileMakerの「fmToWeb」というボタンをクリックすると、Web ViewerのJavaScriptが実行されます。

filemaker19-perform-javascript-in-web-viewer-1

Web Viewerの準備

ここから、具体的な手順になります。

続きを読む →