[ServiceNow]Service PortalのUser Criteriaについて

# 概要
ServiceNowにはService Portalというポータルが標準で利用できますが、
ドメセパに対応しておらず、ドメインごとに表示内容を制御することができません。
そこでService PortalのUser Criteriaプラグインを利用して会社やユーザごとに表示を制御していきます。
今回はUser Criteriaの設定方法と小ネタについて書いていきます。

動作確認環境：Paris

# User Criteriaとは
ロール、部門、グループ、場所、または会社に基づいてユーザーへのアクセスを許可することができ、
Service Portalではポータル内のページ、ウィジェット、ウィジェットインスタンスに対してアクセスを制御することができる。

※本記事ではウィジェットインスタンスに対するUser Criteriaの設定方法、小ネタを紹介する。

# 詳細
### ①プラグインの有効化
com.glide.service-portal.user-criteriaをアクティブにする。

　1.System Definition>Pluginsを開く。
　2.「com.glide.service-portal.user-criteria」を選択し有効化する。

### ②User Criteriaを設定
　1.Service Portal>Pagesを開く。
　2.設定を行いたいページを開く。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/db075061-c97c-e670-ef7d-1f721be2bb16.png)
　3.Page Contentから編集を行いたいインスタンスを選択する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/9e481f1b-cedc-b700-8548-7cbd6f0cda1a.png)
　4.画面下部のCan ViewタブのNewを押下する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/4da3fd17-e36c-195f-f77c-e84693d1ca37.png)
　5.Nameを入力、インスタンスを表示する条件を設定しSubmitを押下する。
　　※例はユーザがsample1 userの場合という条件になっている
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/af6198b2-8ecc-5d61-1567-2a157e515727.png)
　6.Can Viewタブに5で設定したUser Criteriaが表示されていることを確認する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/d5579add-7e61-7075-67fb-f5a0af2c1acc.png)
　7.sample1 userとそれ以外のユーザでログインしページを確認する。
　・sample1 user
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/ed2dec03-1912-87d2-8b2e-349ff305b032.png)
　・sample2 user
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/03ea9461-2744-9fb5-f4c7-3672a73e087c.png)
　User Criteriaが有効になっていることが確認できる。

# 小ネタ
User Criteriaを設定してもこのままでは歯抜けになってしまい正直ダサい。
左詰めにする方法を紹介する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/8eb02382-7262-7197-ab9c-ab7dbc5cf8ee.png)

### ページを設定
　1.Service Portal>Pagesを開く。
　2.設定を行いたいページを開く。
　3.Related LinksからOpen in Deginerを押下する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/f4532e09-3da3-e918-86a3-f584e3159d38.png)
　4.Layoutsから[ 12 ]となっているものをドラッグアンドドロップでレイアウトを追加する。
　・Before
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/b3a86355-bc4a-eb5a-8c10-84cdf942796f.png)
　・After
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/88fb5b3c-6b0a-eb50-1fd2-cfb5b6ea01ef.png)
　5.サンプル1~3を追加したカラムに移動させる。
　・Before
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/88fb5b3c-6b0a-eb50-1fd2-cfb5b6ea01ef.png)
　・After
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/9ba1e785-6439-471d-ac76-4a8983bdece5.png)
　6.サンプル1~3の編集画面を開き、Bootstrap class nameに「col-md-4」と設定する。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/56779e13-7a3c-de82-966b-847621e02238.png)
　7.デザイナの表示が崩れているがこれでOK。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/3035b6dc-b277-434d-793d-c1aa0dcbe8b5.png)
　8.sample1 userとそれ以外のユーザでログインしページを確認する。
　・sample1 user
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/d1181108-9d8f-d73e-8839-f4ecdab90935.png)
　・sample2 user
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/946893/bbe0bb67-63a9-a1ac-6662-e3150d5a2f70.png)

# 最後に
ServicePortalのUser Criteriaについていかがだったでしょうか？
非常に便利な機能なので利用してみてください。
また、今回設定した「col-md-4」についてわからない方はBootstrapの[Grid System](https://getbootstrap.jp/docs/4.2/layout/grid/)について調べてみてください。