Published 2023/02/04 はじめまして。Argano の松田です。 本記事では、React Native で JavaScript からネイティブコードを呼び出す方法を紹介します。
Native Module React Native でアプリを作成する際、次のような要望が出てくるかもしれません。
Apple や Google Pay にアクセスするためのネイティブ API など、JavaScript ではデフォルトで利用できないネイティブプラットフォーム API にアクセスする必要がある 既存の Objective-C、Swift、Java、Kotlin、C++ ライブラリを JavaScript で再実装せずに再利用したい 画像処理などのために高性能なマルチスレッドコードを記述したい そんな時に React Native の Native Module をいう機能を使用できます。 Native Module は、Objective-C、Swift、Java、Kotlin、C++ クラスのインスタンスを JavaScript オブジェクトとして公開し、それによって JavaScript の中から任意のネイティブコードを実行できるようにするものです。 今回は React Native アプリケーション内の JavaScript から ネイティブのメソッドを実行してみます。 最終的には、JavaScript から MyModule.log('Test'); を呼び出し、ネイティブにログ出力できるようにします。
Native Module の作成 環境構築は終わっている前提で進めます。Android の Native Module を作成するには Java か Kotlin を選ぶことができますが、今回は Java を使用します。 ます、android/app/src/main/java/com/your-app-name/ フォルダ内に、MyModule.
Continue reading ↦ Published 2023/02/03 こんにちは。Arganoの長澤です。
今回はZoho CRMのカスタム関数＆ワークフロールールの活用事例を紹介します。
Webフォームを利用して顧客情報の自動更新を実現する方法 ややピンポイントな事例ではありますが、日本語での情報があまりないようですので、Zoho CRMのカスタム関数やワークフロールールについて知りたい方、自動化を進めたい方の一助になれば幸いです。CRMを検討している方、Zohoが気になっている方の参考にもなれば幸いです。
Zoho CRMのWebフォームは、CRM内の項目と紐づけてデータを取得できる便利なものですが、既存データの上書きができません。そのまま使用すると新規データとしてのみCRMに取り込まれます。
しかしながら今回の事例同様、既に取得している顧客データの上書きがしたい、というケースも多いかと思います。
解決策 解決策は次の通りです。
Webフォームを作成する 取得した情報を既存データに上書きするカスタム関数を作成する カスタム関数を発動するワークフロールールを作成する 順に解説します。
Webフォームを作成する 例えばこのようなものです。取得したい情報を項目として設定します。
取得した情報を既存データに上書きするカスタム関数を作成する CasesDetail = zoho.crm.getRecordById("Cases",CasesId); CasesEmail = CasesDetail.get("Email"); ContactsDetail = zoho.crm.searchRecords("Contacts","(Email:equals:" + CasesEmail + ")"); Contacts = ContactsDetail.get(0); updateMap = Map(); updateMap.put("favorite_city",ifnull(CasesDetail.get("favorite_city"),"")); updateMap.put("why_i_fell_in_love",ifnull(CasesDetail.get("why_i_fell_in_love"),"")); updateMap.put("the_day_i_fell_in_love",ifnull(CasesDetail.get("the_day_i_fell_in_love"),"")); update = zoho.crm.updateRecord("Contacts",Contacts.get("id"),updateMap,{"trigger":{"workflow"}}); このように記述します。
「Cases」はWebフォームから送信された情報が新規データとして取り込まれるタブ（モジュール）です。
「Contacts」は「顧客」タブを表します。
Webフォームから取得する各項目のAPI名は次の通りです。
好きな街: favorite_city 好きになった理由: why_i_fell_in_love 好きになった日: the_day_i_fell_in_love 今回はCases、Contactsの両タブにおける同名項目（今回で言えば好きな街、好きになった理由など）のAPI名を同名に設定していますが、タブごとにAPI名が異なる場合もありますので注意が必要です。
これにて、「Webフォームから取得した情報がCasesに入った際、メールアドレス（Email）が既存顧客と同じ場合、その顧客データの項目（取得した項目: 好きな街他）を更新する」関数の完成です。
カスタム関数を発動するワークフロールールを作成する ワークフロールールはこのように設定します。一部英語的な表現でわかりづらいですが、Casesが作成された際、メールアドレスが空でなかった場合に、作成した関数が発動する、というワークフローです。
これで新たに取得した情報を既存の顧客データに手動入力する、という手間から解放されました。
おめでとうございます。
以上
Published 2023/01/27 はじめまして、Arganoのジェソンです。 postMessageを利用する機会があったので、パフォーマンスについて調べて見ました。
postMessage란? postMessage는 크로스 도큐먼트 메세징(Cross Document Messaging)이라고도 불립니다. 일반적으로 스크립트는 same-origin policy에 의해 protocol, domain, port 중 하나라도 다른 경우엔 다른 윈도우와 통신할 수 없습니다. 하지만 이름에서도 알 수 있듯이 postMessage()를 사용하면 origin이 다른 윈도우와 통신할 수 있습니다.
사용방법은 아래와 같습니다.
송신방법 window.postMessage(data, targetOrigin, [transfer]); data: 다른 스크립트에 전달할 메세지(data는 string형태로만 전달된다.) targetOrigin: 타겟 도메인, 즉 메세지를 수신받는 도메인을 지정한다. 대상이 특정 도메인이 아니라면 "*"료 지정한다. transfer 객체를 전송할 수 있다.
Continue reading ↦ Published 2023/01/20 はじめまして、Arganoの池田です。
本記事ではバリデーションライブラリZodについて紹介します。
Zod とは ZodはTypeScript-firstなスキーマ定義とバリデーションを提供するライブラリです。Zodは他のバリデーションライブラリと比べてTypescriptとの相性が非常に良く、依存パッケージが無いことやバンドルサイズが小さいといった特徴があります。Zodの利用方法などについて紹介しながらTypescriptとの相性の良さについて見ていきます。
基本動作 TypescriptでZodを利用する際の一例を以下に示します。Zodのスキーマ定義は例として以下のように記述することができます。
import { z } from 'zod' const user = z.object({ name: z.string(), email: z.string().email(), }) Zodではスキーマ定義からバリデーションのインターフェースをTypeScript型で生成することができます。スキーマ定義がより複雑化した際にこれらの型定義に悩まされなくて良いという点で非常に便利な機能でTypescriptとの相性の良さが表れています。
type UserInput = z.input<typeof user> type UserOutput = z.output<typeof user> バリデーションはuser.parseによって実行され上記の型情報にある通り入力はUserOutput型にパースされて帰ってきます。また、バリデーション失敗時にはエラーの詳細を含んだZodErrorオブジェクトがthrowされます。
try { const parsed = user.parse({ name: "name", email: "email", }) } catch (e) { if (instanceof ZodError) { console.log(e) // ZodError: [ // { // "validation": "email", // "code": "invalid_string", // "message": "Invalid email", // "path": [ // "email" // ] // } // ] } } 利用例 基本的な使い方は以上です。次はより複雑なスキーマを定義してみます。以下のようなユーザー情報がフォームに入力され、これを元に入力を検証しながら出力を適当な型に変換するような場合を想定します。
Continue reading ↦ Published 2022/12/17 Arganoの渡部（@nabeix）です。
Cloud Funcitons (2nd gen) で利用できるフォントを調べました。
Node.js 16のランタイムで調査しましたが、他のランタイムでも同じだと思われます。
/usr/share/fonts/truetype/tlwg/TlwgTypo-Bold.ttf: Tlwg Typo:style=Bold /usr/share/fonts/truetype/tlwg/TlwgTypewriter-BoldOblique.ttf: Tlwg Typewriter:style=Bold Oblique /usr/share/fonts/truetype/tlwg/Garuda.ttf: Garuda:style=Regular /usr/share/fonts/truetype/freefont/FreeSansBold.ttf: FreeSans:style=Bold,получерен,negreta,tučné,fed,Fett,Έντονα,Negrita,Lihavoitu,Gras,Félkövér,Grassetto,Vet,Halvfet,Pogrubiony,Negrito,gros,Полужирный,Fet,Kalın,huruf tebal,жирний,Krepko,treknraksts,pusjuodis,đậm,Lodia,धृष्ट /usr/share/fonts/truetype/freefont/FreeSans.ttf: FreeSans:style=Regular,нормален,Normal,obyčejné,Mittel,µεσαία,Normaali,Normál,Medio,Gemiddeld,Odmiana Zwykła,Обычный,Normálne,menengah,прямій,Navadno,vidējs,normalusis,vừa,Arrunta,सामान्य /usr/share/fonts/truetype/liberation/LiberationSansNarrow-Italic.ttf: Liberation Sans Narrow:style=Italic /usr/share/fonts/type1/gsfonts/n021024l.pfb: Nimbus Roman No9 L:style=Medium Italic /usr/share/fonts/truetype/kacst/KacstFarsi.ttf: KacstFarsi:style=Medium /usr/share/fonts/truetype/freefont/FreeSerifBoldItalic.ttf: FreeSerif:style=Bold Italic,получерен курсивен,negreta cursiva,tučné kurzíva,fed kursiv,Fett-Kursiv,Negrita Cursiva,Lihavoitu Kursivoi,Gras Italique,Félkövér dőlt,Grassetto Corsivo,Vet Cursief,Halvfet Kursiv,Pogrubiona kursywa,Negrito Itálico,gros cursiv,Обычный Курсив,Tučná kurzíva,Fet Kursiv,ตัวเอียงหนา,Kalın İtalik,huruf tebal kursif,жирний курсив,Polkrepko Pežeče,treknais kursīvs,pusjuodis kursyvas,nghiêng đậm,Lodi etzana,धृष्ट-तिरछा /usr/share/fonts/opentype/ipafont-mincho/ipam.ttf: IPAMincho,IPA明朝:style=Regular /usr/share/fonts/truetype/kacst/mry_KacstQurn.ttf: mry_KacstQurn:style=Regular /usr/share/fonts/truetype/tlwg/TlwgTypist.ttf: Tlwg Typist:style=Regular /usr/share/fonts/truetype/kacst-one/KacstOne-Bold.
Continue reading ↦ Published 2022/12/15 はじめまして、Arganoの渡部（@nabeix）です。
Arganoの技術ブログ第一弾としてGCPのCloud Run Jobsの機能と、実運用する際のちょっとしたポイントを解説したいと思います。
※ 記事執筆時点でpre-GAEとして公開している機能を含みます
Cloud Run Jobs とは Cloud Run JobsとはGCPのコンテナ実行サービスであるCloud Runのジョブ実行環境です。
Cloud RunはWebサーバの実行環境のみでしたが、このCloud Run Jobsの登場によりバックグラウンドでのタスク処理を行う仕組みを気軽に構築できるようになりました。
定期実行を行う場合はCloud Schedulerを用いてスケジューリングします。
ジョブの実行時間は最大1時間となっており、この点を考慮したロジック実装が必要となります、
1時間以上掛かるジョブの実行が必要な場合は以下の方法を検討してみても良いと思います。
1時間以上の処理を実行する方法 1回のジョブ実行時間を1時間以内に収めつつ、自身のジョブを再帰的に呼び出すことで結果として1時間以上のタスク処理を実現しました。
ジョブを呼び出しはWeb APIによって行います。
エンドポイントは以下の形式のものが割り当てられており、POSTメソッドを用いてコールします。
https://{region}-run.googleapis.com/apis/run.googleapis.com/v1/namespaces/{project-name}/jobs/{job-name}:run 参照: ジョブを実行する
このときあ、アクセストークンが必要ですが、このトークンはメタデータサーバから取得します。
メタデータサーバとは、GCEやCloud Run内部から利用できるGCPプロジェクトの各種認証情報を取得できるサーバです。
以下のようにリクエストを送ることで、アクセストークンを取得できます。
function getToken() { $tokenUrl = 'http://metadata.google.internal/computeMetadata/v1/instance/service-accounts/default/token'; $ch = curl_init(); curl_setopt_array($ch, array( CURLOPT_URL => $tokenUrl, CURLOPT_HTTPHEADER => ['Content-Type: application/json', 'Metadata-Flavor: Google'], CURLOPT_CUSTOMREQUEST => 'GET', CURLOPT_RETURNTRANSFER => true, )); $res = curl_exec($ch); curl_close($ch); $decoded = json_decode($res); return $decoded->access_token; } 取得したトークンを利用してジョブのエンドポイントにPOSTリクエストを送ることで、ジョブを再実行することができます。
Continue reading ↦