カスタムコードとは
お客様がご自身で記述した
- JavaScript
- CSS
のソースコードを、Worksアプリ上で動作可能にする機能です。
カスタムコード機能を使うことで、ご自身の利用環境に合わせた「挙動」「デザイン」になるよう、Worksアプリをカスタマイズ出来るようになります。
カスタムコードを反映させられる画面は下記の通りです。
- レコード一覧画面
- レコード詳細画面
- レコード登録画面
また、カスタムコードはPCで操作する際の画面にのみ反映されます。スマホ版で操作する際の画面には反映されませんので、ご注意下さい。
利用条件
- カスタムコード機能はPremiumプランのユーザーのみご利用頂けます。
- カスタムコード機能利用に伴う追加料金は発生致しません。
設定方法
カスタムコードの新規作成方法を紹介します。
- アプリ設定画面のサイドバーから「カスタムコード」を選択する
- 「新規登録」を押下する
- 「状態」 … 「公開」中のカスタムコードのみ、ユーザーの画面に適用されます。
- 「名称」 … 管理しやすいような名称を設定してください。
- 「適用画面」 … 新規作成時のみ、カスタムコードを適用する画面を選択出来ます。
- 「コード種別」 … 新規作成時のみ、カスタムコードの言語を選択出来ます。
- 「閲覧・編集権限」 … カスタムコードを保守するユーザーを制限出来ます。
- 「メモ」 … カスタムコードに関する説明のメモを保存出来ます。
- 設定変更を終えたら、「保存」ボタンを押して下さい。
- カスタムコードの作成が完了したら、次はソースコードを登録していきます。
カスタムコードを反映させる流れ
コード編集画面の説明に入る前に、カスタムコードを作成〜反映させるまでの流れを確認しましょう。
カスタムコードは、下記の図のような流れで修正していきます。
- 編集中のソースコードを一時保存し、編集者のみ挙動を確認できる状態にする。
- 編集者はWorksアプリの画面を確認し、期待した挙動になるか検証する。
- 期待通りではなかった場合、再度修正して一時保存し、検証を行う。
- 期待通りの挙動が確認できたら、本番反映して全員のWorksアプリに反映させる。
ポイントは下記の通りです。
- 一時保存中のカスタムコードは「編集者のみ」がアプリ上で確認出来る
- カスタムコードは本番反映して初めて、全員が確認出来るようになる
コード編集画面の利用方法
ここからは、コード編集画面の使い方を紹介します。
【①基本設定 / コード編集画面の切り替え】
タブを切り替えることで、「基本設定」「コード編集」を行うことができます。
【②ソースコードの修正】
エディタ内に現在編集中のソースコードが表示されています。ここでソースコードの修正が出来ます。
初期状態では、サンプルのソースコードが表示されます。
もしくは、VSCodeなどのお手持ちのエディタで作成したソースコードを、ここに貼り付けても構いません。
【③現在編集中のソースコードと、本番反映済みのソースコードを比較】
差分表示を確認することで、現在どのような修正を行っているのかが分かります。
【④現在編集中のソースコードを保存して、編集者のWorksアプリにのみ反映する】
一時保存を行うことで、編集中のソースコードを保存するとともに、編集者のWorksアプリにのみ変更内容を反映出来ます。編集者はカスタムコードを反映させた画面を確認し、期待通りの挙動になることを確認しましょう。
【⑤一時保存した内容を全員に反映・破棄】
一時保存中のソースコードがある場合は、下記のようなボタンが表示されます。
一時保存の内容を破棄したい場合は「変更を破棄」、検証が済んだ一時保存の内容を全員に反映させたい場合は「本番反映」を選択します。
運用中のカスタムコードを編集したくなったら
本番反映中のカスタムコードを修正したくなった際、他のユーザーに使用感の変化を感じさせることなく、ソースコードの修正・検証を行うことが出来ます。
下記ボタンからコード編集画面に遷移し、ソースコードを編集して「一時保存」まで行った段階で、編集者のWorksアプリにのみ変更が反映されます。「本番反映」を行わない限り、他のユーザーには影響ありませんので、十分に検証を行った上で「本番反映」を行いましょう。
カスタムコードを複製したくなったら
運用中のカスタムコードを参考に、微修正したカスタムコードを作成したい場合は「複製」機能がおすすめです。
カスタムコードが読み込まれる順番
1つの画面に複数のカスタムコードを読み込ませることも出来ます。その場合、実行される順番が重要になります。
カスタムコードは上から並べられている順番に実行されますので、意図した順番で実行させるには「順序」をドラッグ&ドロップで変更して下さい。
カスタムコード機能の使用に関する注意事項
カスタムコード機能（以下本機能）を用いてJavaScriptやCSSを作成・保存する際に以下の点に注意してください。
- 禁止事項
- 悪意のあるコードの禁止: 本機能から意図的にウイルス、マルウェア、スパイウェア、またはその他の悪意のあるコードを含むJavaScript等の登録を禁止します。安全なコーディング慣行に従い、信頼できるソースから提供されたコードを使用するか、十分にテストを行って安全性を確保してから公開を行ってください。
- リバースエンジニアリングの禁止: サスケWorksの内部機能、アルゴリズム、またはコードを解析し、逆コンパイル、逆アセンブル、リバースエンジニアリング、または他の類似の手法を使用することを禁止します。
- セキュリティに関する注意事項
セキュリティ上のリスクを最小限に抑えるために、以下の注意事項に従ってください。
- 信頼できないソースの回避: 本機能には信頼できないソースから提供されたJavaScriptコードを登録しないでください。不正なソースからのコードは、個人情報の漏洩やアカウントの乗っ取りなどのリスクを引き起こす可能性があります。
- コードのテスト: 作成したJavaScriptコードが他のユーザーに影響を与える可能性がある場合は、事前に慎重にテストしてください。Worksアプリ全体のパフォーマンスやセキュリティに悪影響を及ぼす恐れがある場合は、直ちに修正する必要があります。
- 違反行為に対する制裁
上記の注意事項や禁止事項に違反した場合、株式会社インターパークは以下の措置を取る権利を留保します。
- アカウントの停止: 違反が確認された場合、ユーザーのアカウントへのアクセスを一時的または永久に停止することがあります。
- 悪意のあるコードの除去: ユーザーが埋め込んだ悪意のあるコードが発見された場合、本ウェブアプリの運営者はそれを除去する権利を有します。
- 法的手続き: 悪意のある行為により損害が発生した場合、適用される法律に基づき、関連当局に報告し、法的手続きを踏む場合があります。