概要
Salesforce(以降SFDCとする)アプリケーションをApex、Visualforcceを使わずにローカル環境で開発する方法をご紹介します。
代表的な方法としてはローカルからjsforce経由でSFDC APIを叩いて、SFDCデータを取得して開発するイメージになります。
この方法だとローカルにWebサーバとプロキシサーバの両方を立てなければならないのが、なにげにめんどくさい。ということでプロキシサーバとWebサーバをDockerで一元管理すればコマンド一つでそれらの環境が構築されるので、アプリケーション開発にスムーズに取り掛かれる。
また、ApexやVisualforcceに慣れていない(もしくは初めての)場合は、今まで使い慣れてきた開発言語(Javascript、HTML、CSS)でまずプロトタイピングして、慣れてきた頃(ガバナ制限を抑えるため)にApexやVisualforceに移植していく場合にも有効かと思います。
(RemoteActionに置き換えるなど)
以下にてサンプルコードをベースに説明していきますので、必要に応じて読み替えて頂ければ幸いです
https://github.com/comefigo/local-prototyping-sfdc-app-sample.git
準備
Docker
- Dockerをインストール
- ドライブの共有設定
開発ソースが保存されているドライブの共有設定を有効に設定
OAuth設定
ローカルの開発環境からSFDCに認証するために、SFDCのOAuth設定をします
設定が反映させるまで最大10分かかります
1. 新規接続アプリケーションの作成
2. OAuth設定
- コールバックURLはローカル環境のWebサーバのURLを指定してください(デフォルトはhttp://localhost:3000/)
- OAuth範囲は「データへのアクセスと管理」
- Webアプリケーション設定の開始URL(デフォルトはhttp://localhost:3000/)
3. 認証情報の保存
「app」-「static」-「js」-「jsforce.config.js」に手順2で保存後に表示されるコンシューマー鍵をclientIdに上書きしてください
if (!jsfConn) {
jsforce.browser.init({
clientId: 'salesforce コンシューマ鍵',
redirectUri: 'http://localhost:3000/',
proxyUrl: 'http://localhost:3123/proxy/'
});
var jsfConn = jsforce.browser.connection;
// アクセストークンがない場合は、認証
if (!jsfConn.accessToken) {
jsforce.browser.login();
}
}
プロキシサーバとWebサーバの起動
下記の説明はこちらのサンプルコードをもとに解説します
サンプルコードのルートディレクトリで以下のコマンドを実施します
> docker-compose up -d
これだけです!
これで開発用のプロキシーサーバとWebサーバが起動します!
アプリケーションの開発
「app」-「static」配下がWebアプリケーションの公開ディレクトリになりますので、
いつも通りにWebアプリケーションの開発ができます!
サンプルコードを動かすには
app配下で以下のコマンドを実行してください
> bower install
ポート変更
Webサーバのデフォルトポートを3000としていますが、それ以外のポートに変更したい場合は、
以下のファイルと設定をそれぞれ変更する必要があります
-
docker-compose.yml
ports: - "<new port>:3000" environment: - PORT=<new port>
-
jsforce.config.js
-
Salesforce OAuthのコールバックURLと開始URL
参考にしたサイト
jsforce様様です!