2020年5月

LWC Local Developmentを試してみた

  • 2020.05.23

概要 SalesforceのLightning Web Component(LWC)をローカルサーバーで動かせる機能がBeta版でリリースされていたので、どんなものかを触って確かめてみました。 準備 Local Dev Server用のCLIをインストール 最終的にはSalesforce CLIのパッケージに含まれるようですが、現在はBeta版なので含まれていないので、個別にインストールする必要があります。 組織の認証 Devhub組織と認証して、Scratch組織を作成しておきます。どうやら接続先はSandboxではなくScratch組織である必要があるみたいです。この辺は結構前に書いた記事ですが、下記をご参照ください。 Salesforce DXの基礎の基礎https://qiita.com/yhayashi30/items/80dd868f2e15aac67072 ローカルサーバーを起動 下記のコマンドを実行することでnode.jsがローカルサーバーを起動してくれます。 また、VSCodeのコマンドパレットで下記を実行して操作することもできます。 起動して開くSFDX: Open Local Development Server 起動SFDX: Start Local Development Server 停止SFDX: Stop Local Development Server 表示(選択したLWCのソースコードを右クリック)Preview Lightning Web Components in VS Code これで準備ができたので、localhostにアクセスすると画面が表示されるはずです。 http://localhost:3333/ 特徴 ローカルのLWCを画面描画 最初、localhostにアクセスすると自分のローカルプロジェクトに含まれているLWCがリンクでリスト表示されます。 リンクをクリックすると、LWCがローカルサーバー上で表示されます。また、画面右上にある”View in VS Code”のボタンを押下すると、画面で表示しているLWCのソースコード をVS Code上で表示してくれます。VS Code上でLWCのソースを修正すると即時にローカルサーバーにデプロイが行われて画面が最新化されるようになっているようです。 コンパイルチェックしてくれる 今までSalesforceの開発ではSandboxやScratch組織にソースコードをアップロードしないとコンパイルのチェックはできませんでしたが、ローカルサーバーを使う事でLWCの構文チェックを行ってくれて、どこでエラーが発生しているかを表示してくれます。ちなみにエラー画面は下記のようなイメージで、どこでエラーが起きているかやエラーメッセージも表示されます。 データ表示 LWCはローカルサーバーで動いているのですが、Apexの処理は接続しているScratch組織上で実行するようになっているので、組織のデータを検索したり、登録/更新することも可能なようです。 参考 Local Development (Beta)https://developer.salesforce.com/tools/vscode/en/lwc/localdev Announcing LWC Local Development Betahttps://developer.salesforce.com/blogs/2019/10/announcing-lwc-local-development-beta.html

ABC165 C問題(2020.5.2)

  • 2020.05.23

概要 本記事は、AtCoderのABC165に参加した際に回答することができなかったの問題を解説を読んで理解した内容を記載します。C問題で回答できなかったのは久しぶりだったので、しっかりと復習したいと思います。 問題 C – Many Requirementshttps://atcoder.jp/contests/abc165/tasks/abc165_c 解説 pdf https://img.atcoder.jp/abc165/editorial.pdf 動画(Youtube) 理解 まず計算量を考える部分ですが、数の組み合わせですが等しい数も選択することができるので、玉を並べてそれらに仕切りを置くようなイメージで算出します。具体的にはN個の仕切りとM-1個の玉からN個を選択するときの組み合わせが総数となります。なので、N+M-1 Choose N となり、今回の最大数は19 Choose 9なので92378通りで全探索でも問題ない処理量と考えられます。次に全探索のdfs関数についてですが、全探索を考えるときのポイントは以下の2つです。 一回のステップでどんな処理をすることで次につなげられるか 終了条件をどうするか 今回の実装では、一回の実行ではリストの最後の値をリストに追加する処理を行います。終了条件はリストの長さがNとなると時で、そこでそのリストでの値を計算してmaxをとります。 実装

SalesforceにおけるOAuth2.0/OpenID Connect

  • 2020.05.20

概要 本記事では、業界標準であるOAuth2.0とOpenID Connectの概要を紹介した後に、Salesforceではそれらをどのように実装することができるのかを簡単に記載していきたいと思います。 本記事のベースとなるOAuth2.0やOpenID Connectの技術的な事項はこちらの本で学習しました。クライアント、認可サーバー、保護対象リソースのそれぞれについてサンプルのソースコードでどのように動作するかが詳細に記載されており理解するのに非常に役に立ちました。おすすめです。 認証・認可とは それぞれ詳細を説明すると非常に長くなるのですが、あえて一言で言うと下記で表せます。 認証 通信の相手が誰(何)であるかを確認すること 認可 とある特定の条件に対して、リソースアクセスの権限を与えること Salesforceにおける認証・認可とは Salesforceで実現可能な認証・認可の仕組みは下記が上げられます。 # 名称 概要 機能名 1 フォーム認証 Webブラウザでユーザ名とパスワードを入力する最も基本的な認証方式 標準ログイン画面 2 2要素認証 認証に2つ目の要素を追加することでセキュリティを強化する Salesforce Authenticator 3 SSO 一回の認証で複数のサービスを利用できる仕組みSalesforceは、IdpとSPのどちらになることもできる SAMLシングルサインオン 4 証明書認証 PCもしくはモバイルデバイスに配布されたクライアント証明書でログイン認証を行う 証明書認証 5 OAuth/OpenID Connect ←本記事ではこれを解説 外部アプリケーションにSalesforceのデータへのアクセスする際にその認可を与える仕組み 接続アプリケーション 6 Social Sign on ソーシャルアカウントで認証を行う 認証プロバイダ 7 代理認証 ユーザの認証を外部サービスで行う外部サービスはSalesforceが指定するWSDLに合わせたインターフェースを実装する必要がある 代理認証 OAuth2.0とは 概要 OAuth2.0は、業界標準でありRFCに下記のように定義されております。RFC6794(The OAuth 2.0 Authorization Framework) https://tools.ietf.org/html/rfc6749 ‘OAuth 2.0 は, サードパーティーアプリケーションによるHTTPサービスへの限定的なアクセスを可能にする認可フレームワークである. サードパーティーアプリケーションによるアクセス権の取得には, リソースオーナーとHTTPサービスの間で同意のためのインタラクションを伴う場合もあるが, サードパーティーアプリケーション自身が自らの権限においてアクセスを許可する場合もある. 本仕様書はRFC 5849に記載されているOAuth 1.0 プロトコルを廃止し, その代替となるものである.’ 言い換えると、下記のように表せます。 リソース所有者の代わりとして対象のリソースへのアクセスを許可するための手段 サード・パーティー製のアプリケーションがHTTPサービスへの制限されたアクセス権を取得できるするようにするためのもの OAuthとはシステムを構成しているある要素から別の構成要素にアクセス権を渡すためのもの では、なんのためにOAuthを使用して認可をするかというと サード・パーティ製のアプリケーションにユーザーの ID & パスワードを渡さない となります。 概要イメージ 0. まずユーザであるリソース所有者がクライアントのアプリケーションを使用します。1. クライアントは、保護対象リソースへアクセスするために一旦認可サーバーへリクエストを行います。2. 認可サーバーはリソース所有者との間でユーザ認証および認可を行います。3. 認可サーバーはユーザとの認証・認可が完了しているので、クライアントへアクセストークンを返却します。4. クライアントは、保護対象リソースへアクセストークンを利用してAPIアクセスを行います。 各構成要素 クライアント ・・・ ソフトウェアであり、リソース所有者の代わりとして保護対象リソースへのアクセスを行うもの 認可サーバー ・・・ OAuthの仕組みの中心的な役割を担うHTTPサーバーのこと. リソース所有者にクライアントを認可するための仕組みを提供し、トークンをクライアントに発行するもの リソース所有者 ・・・ クライアントにアクセス権を委譲する権限を持つ存在. ソフトウェアでなくユーザー. 保護対象リソース ・・・ HTTPサーバーから提供されており、そのリソースにアクセスするにはOAuthのトークンが必要となる. 保護対象リソースは提示されたトークンを検証して、リクエストに応えるかを判定する アクセストークン ・・・ 認可サーバーによってクライアントへ発行され、クライアントに権限が委譲されたことを示すもの スコープ ・・・ 保護対象リソースでの権限を表すものであり、クライアントに付与されるアクセス権限を制限するための仕組み リフレッシュトークン ・・・ 新しいアクセストークンを発行するために使用する 認可コードフロー(Authrorization Code Grant Type) OAuthのいくつかあるフローの中で最も標準的なフローである認可コードフローは下記のようになります。 認可リクエスト/認可レスポンスのイメージ response_type=codeで認可コードフローを指定 codeの値が発行された認可コード トークンリクエスト/トークンレスポンスのイメージ grant_type ・・・ authorization_codeで認可コードフローを指定。 その他のフロー # フロー名 概要 1 認可コードフロー(Authorization Code Type) 最も標準系のフロー。クライアントが認可コードを経由してアクセストークンを取得する。 2 インプリシットフロー(Implicit Grant Type) JavaScriptアプリケーション等で完全にブラウザ内で動作している場合に使用する。クライアントは認可エンドポイントから直接アクセストークンを取得する。 3 クライアント・クレデンシャルフロー(Client Credentials Grant Type) ユーザに関係なくクライアントアプリへ直接アクセストークンを発行する。 4 リソースオーナー・パスワード・クレデンシャルズフロー(Resource Owner Password Credentials Grant Type) 基本的に非推奨。(アンチパターン)アプリケーション側でID、PWを入力させて、それをトークンエンドポイントへ送り直接アクセストークンを取得する。 5 リフレッシュトークンフロー(Refresh Token Grant Type) リフレッシュトークンを使用して、アクセストークンの再発行を行う。 OpenID Connectとは 概要 OpenID Connect Core1.0https://openid.net/connect/ OpenID Connect 1.0 は, OAuth 2.0 プロトコルの上にシンプルなアイデンティティレイヤーを付与したものである. このプロトコルは Client が Authorization Server の認証結果に基づいて End-User のアイデンティティを検証可能にする. また同時に End-User の必要最低限のプロフィール情報を, 相互運用可能かつ RESTful な形で取得することも可能にする. これらをわかりやすく言い換えると下記のように表せます。 OAuth 2.0 + Identity Layer = OpenID Connect Identity Layer = ID Token + UserInfo […]

ABC163 D問題(2020.04.19)

  • 2020.05.06

概要 コンテストの日から少し時間が空いてしまいましたが、2週間前?くらいに参加したABC163(2020/4/19)で相変わらずD問題がクリアすることができなかったので、復習のために解説を確認しながら、概念を理解してACするプログラムを実装しました。 問題 https://atcoder.jp/contests/abc163/tasks/abc163_d 解説 PDF https://img.atcoder.jp/abc163/editorial.pdf 動画(Youtube) 理解 まずM個の数である10^100の部分は非常に大きい数であるため、選択する数が変わると合計の値は他の数の組み合わせとは重複しないので、各選択した数の組み合わせによる合計値を求めれば算出可能となります。本問題でキーとなる部分は、M個からK個選ぶ場合の最大値は大きい方からK個選ぶ場合であり、最小値は小さい方からK個選ぶ場合となり、これらの最大値と最小値の間の値は全てを組み合わせで生成できるという点となります。したがって、作成できる数の総和は最大値-最小値で算出できます。次に、2つの連続するrからlまでの数の合計は、(l+r)*(r-l+1)/2で求めることができます。というポイントを抑えて実装すると下記のようになりました。 実装

Pythonista3でGithubにPushする方法

  • 2020.05.06

Pythonista3とは Pythonista3とは、iPadやiPhoneでPythonのプログラムを書いたり、実行したりすることができるiOSのアプリです。https://apps.apple.com/jp/app/pythonista-3/id1085978097 概要 本記事では、Pythonista3で書いたプログラムをアプリから直接Githubの自分のリポジトリにPushする方法を記載します。iOSのアプリケーションでは基本的にShellスクリプトを実行することができないのですが、Pythonistaのユーザが作成したstashというスクリプトを実行することでShellが擬似的に使用できるにしてGithubへのアクセスをCUIベースで行います。 手順 stashのインストール Pythonistaのアプリケーションで左にスワイプするとコマンドが表示されるので、そこで下記のコマンドを実行してstashをインストールします。 Pythonistaを再起動 インストールが完了したら、Pythonistaを一度タスクリストから削除して、再度アプリの立ち上げを行うことで再起動します。 stashをPythonのバージョン2.7で起動 アプリ内のフォルダ直下(This iPad,This iPhone)にlaunc_stash.pyというプログラムが作成されているので、そのファイルを開いて右上のRun(再生ボタンみたいなやつ)を長押しすると「Run with Python 2.7」が表示されるのでそちらを押下します。すると、unix風のコンソールに切り替わると思うのでそこでコマンドを実行可能となります。ちなみに、Pythonバージョン2.7で起動している理由は、この後で実行するGitコマンドがバージョン3.6で起動すると動作しなかったからとなります。 公開鍵を作成 Githubとの接続に必要となる公開鍵をstash上で作成します。rsaはデフォルトでは1024bitとなりますが、セキュリティを考えて2048bitを指定しています。 作成した公開鍵をGithubへ登録します。GithubのSetting->SSH keysから下記のコマンドで表示される文字列(ssh-rsa から始まる)をコピーして設定します。 Gitコマンド 下記のコマンドでGithubへのPushまでを行います。 参考 stashhttps://github.com/ywangd/stash