AADの非管理者がアプリケーションを登録できないようにする

はじめに

Azure Active Directoryで組織内の非管理者がアプリケーションを登録できないようにします。

手順

Azure Portalにサインインし、Azure Active Directoryを選択します。

[ユーザー設定]を選択します。
[アプリの登録]で、[ユーザーはアプリケーションを登録できる]を[いいえ]に切り替えます。
[保存]をクリックして変更を保存します。

保存後に非管理者のユーザーでアプリの登録をしようとすると、
[アクセス権がありません]の画面が表示され、無事登録できなくなりました。

管理者であればちゃんと登録画面が出ます。

Azure Active Directoryの動的グループの作成

はじめに

Azure Active Directoryのグループに動的メンバーシップの条件を設定して、
その条件に一致するユーザーは自動的にグループに追加するようにします。
動的に設定されるグループ メンバーシップのルール - Azure AD | Microsoft Docs

今回は利用場所が日本のユーザーを自動で追加するグループを新規作成します。

手順

Azure Active Directory admin centerにサインインします。
Azure Active Directory admin center

ダッシュボードにアクセスしたら、
左側のナビゲーションペインの[すべてのサービス]をクリックします。

[グループ]をクリックします。

[新しいグループ]をクリックします。

各項目を入力します。
今回の作成に必要な項目としては、[メンバーシップの種類]を[動的ユーザー]にします。

[動的クエリの追加]をクリックします。
ここでいろんな条件を設定します。
今回は利用場所が日本のユーザーが対象になりますので下記の設定を入れます。
プロパティ：usageLocation
演算子：Equals
値：JP

[ルールの検証]で設定した条件の検証ができます。
既に対象ユーザーが存在するのであれば検証できるのはいいですね。

[保存]をクリックします。
[作成]をクリックします。

グループが作成され、しばらくすると自動で対象のユーザーが追加されるようになります。

メールの自動応答をオフにするリモートドメイン設定

はじめに

組織内のすべてのユーザーが、外部ユーザーに対して不在時の自動応答を送信しないようにするためにリモートドメインの設定をします。
不在時の自動応答設定は個別のOutlook上から設定できますが、それよりも優先される設定になります。
Exchange Online のリモート ドメイン | Microsoft Docs
Exchange Online におけるリモート ドメインの管理 | Microsoft Docs

各設定項目については下記サイト様が詳細で分かりやすいです。
【Office365参考書】リモートドメインの各項目について解説 - 社畜の所業

手順

Microsoft365管理センターにアクセスします。
https://go.microsoft.com/fwlink/p/?linkid=2024339

左側のナビゲーションペインから[管理センター]>[Exchange]に移動します。
[Exchange]の項目がない場合、簡易表示になっていることがありますので、
[すべてを表示]をクリックします。

[Exchange管理センター]が開いたら、
左側のナビゲーションペインから[メールフロー]をクリックします。

[リモートドメイン]をクリックし、
対象のリモートドメイン名をクリックします。

右側に現在の設定が表示されます。
[返信の種類を編集]をクリックします。

[不在時の自動応答の種類]を[なし]に変更し、[保存]をクリックします。
デフォルト値は[外部の不在時返信のみを許可する]です。

保存されると、設定表示部分で変更されていることが確認できます。

変更後、反映までには5分ほどかかるようです。
試しにOutlook側で自動応答の設定をし、
組織内外両方からメールを送信してみましたが、外部ドメインに対しては自動応答メールは送信されませんでした。

自動応答自体は、文言をはじめ有効無効も組織内外向けかも個人のOutlookで設定できますが、
外部向けの自動応答などは誤送信を防ぐなどの目的で、組織として一律管理したい場合にはリモートドメインから設定してしまうのがよさそうです。

IMAPを使用してメールボックスを移行する

はじめに

Internet Message Access Protocol(IMAP)対応サーバーの電子メールはMicrosoft 365またはOffice 365に移行することができるようなのでやってみます。
Microsoft 365 管理センターでの IMAP 移行 | Microsoft Docs

実行前の確認事項

・移行対象はメールボックスの中のものだけ。(予定表やタスクは含まれない)
・移行できる最大項目数は500,000。新しいものから移行される。
・移行対象のメールボックスへのアクセス権が必要(メールアドレス、パスワード)

その他詳しい仕組みは下記参照
IMAP メールボックスを Microsoft 365 または Office 365 に移行するために必要なこと | Microsoft Docs

手順

Microsoft365管理センターにアクセスします。
https://go.microsoft.com/fwlink/p/?linkid=2024339

左のメニューバーより[セットアップ]をクリックします。
[ユーザーのデータの移行]をクリックします。

[移行を表示]をクリックします。

移行対象のサービスをクリックします。
今回はOutlookのアカウントのメールボックスを移行します。

ソースメールとパスワードに移行対象の情報を入力します。

移行対象のアカウントに、アクセス確認のメールが来るので、自分の操作であることを確認します。

Microsoft365管理センターの方で同期が完了するのを待ちます。

移行が完了すると移行先のメールボックスで移行対象のメールが確認できるようになりました。

Form Recognizerの領収書処理機能を体験してみた

はじめに

本記事は下記アドベントカレンダーの12/20分の記事になります。
Microsoft Azure Cognitive Services Advent Calendar 2020 - Qiita

今回の目的

MS Learnのモジュールを使って、Form Recognizerを使うとどんなデータが得られるのか知る！
docs.microsoft.com

Form Recognizerとは？

Azure Cognitive Servicesのひとつで、
ドキュメントからテキスト、キーと値のペア、テーブル、構造などを特定して抽出してくれるWeb APIです。
領収書や名刺などの写真からデータを抽出できます。
Form Recognizer とは - Azure Cognitive Services | Microsoft Docs

[アップデート情報]
2020年11月に日本語対応になりました。
（今回の記事ではそこまで試せてません…すみません。
What's new in Form Recognizer? - Azure Cognitive Services | Microsoft Docs

「Form Recognizer を使用した領収書の分析」演習

必要なもの

・Microsoft Azure サブスクリプション

Azure Machine Learning ワークスペースの作成

Azure上でMachine Learningリソースを作ります。

Azure Machine Learning Studioでの操作

Machine Learningのリソースができると、Azure Machine Learning Studioへ移動できます。

Azure Machine Learning Studioとは
データ サイエンティスト開発者向けの Web ポータルです。
Azure Machine Learningの中の一つのサービスです。
プロジェクト作成とアセット管理のための少量コードおよびコードなしのオプションが用意されています。
Azure Machine Learning スタジオとは | Microsoft Docs

初回接続時にはワークスペースの設定があります。

無事にAzure Machine Learning Studioが開けると、ホーム画面が出ます。
これだけでもできることが多そうに見えますね。

コンピューティングインスタンスの作成

演習内容を実行するための仮想マシンを作ります。

Azure Machine Learning コンピューティング インスタンスとは
データ サイエンティスト向けのマネージド クラウドベース ワークステーションです。
機械学習のための仮想マシンのような感じでしょうかね。
Azure Machine Learning コンピューティング インスタンスとは - Azure Machine Learning | Microsoft Docs

このコンピューティングインスタンスを作るときに少し狼狽えました。
なぜなら作れるVMがひとつもなかったのです！

別途ライセンスが必要なのかしらと不安になりましたが、よく見てみるとこんな表記が。

まさかこんなところでCOVID-19の影響を感じることになるとは思いませんでした。
クォータ制限引き上げのリクエストを送ると使えるようになるとのことなので、送りました。
モジュールに書いてある指定のStandard_DS11_v2はDv2シリーズなので指定をします。
メモリを最適化した Dv2 と DSv2 シリーズ VM - Azure Virtual Machines | Microsoft Docs

リクエストを送って、1~2分後くらいにリクエスト承認のメールが飛んできます。
そのメールを受け取った直後はまだ制限引き上げされませんでしたが、その日のうちくらいには使えるようになりました。
これで無事にコンピューティングインスタンスが作成できました。

演習用ファイルを用意する

スタジオ上の[Notebooks]に新しいファイルを作成します。

GitHubから演習ファイルをクローンします。
大量のファイルが作成されます。
これを使うためにはAzure上のForm Recogniserリソースにあるキーとエンドポイントが必要になります。

Form Recogniserのリソース作成

AzureポータルでForm Recogniserリソースを作ります。

キーとエンドポイントを使用しますので、メモしておきます。

演習ファイルの実行

Azure Machine Learning Studioに戻り、[01f - Receipts with Form Recognizer.ipynb]を開きます。
4種類の実行できるセルが含まれたドキュメントのようなものが開きます。
２つめのセルに先ほどメモしたキーとエンドポイントを入力します。

[すべてのセルの計算と実行を開始する]を実行します。
1つ目のセルに読み取り対象のレシート画像が表示されます。

4つ目のセルに読み取ったレシートの情報が出力されます。

別のレシート画像を[ai-fundamentals]>[data]>[form-receipt]のフォルダにアップロードして
ソースコードを編集すれば、別のレシート画像で試せます。

コスト

MS Learn の最後にもコンピューティング インスタンスは使ってないときは停止するように書いてあります。
止めなかったらどれだけ恐ろしいことになっちゃうの…？とびくびくしていましたが、
今回設定したコンピューティングインスタンスは$0.23/時間でしたので、
動作確認に何回か動かした程度であれば、問題ありませんでした。
（それでもちりつもなので、使っていないときは停止させます。

おわりに

今回は出来上がっているものをちょっと触っただけですが、画像からそれなりにちゃんとデータを取り出してくれることがわかっただけでも面白かったです。
このモジュールでは日本語レシートはあまりちゃんと読み取ってもらえなかったので、日本語対応を試すには別の方法をやってみようと思います。

Power Automate×Windowsイベントログで働きすぎをチェックする

はじめに

テレワークになってから半年くらい経ちました。
ふたを開けてみると、サボりよりも働きすぎなどの体調管理が問題視されていたりします。
実際に私も残業の境目がなくなってしまう時があります。
ということで、働きすぎを感知するようなフローを考えてみました。

目的

テレワークにより実稼働時間が見えにくい中で、働きすぎている人がいた場合、マネージャー的な人のTeamsに通知が来るようにする。

流れ

• PowerShellのコマンドでWindowsのイベントログを収集する。

• 取得したcsvファイルを何らかの形でxlsxにする。

• xlsxファイルを対象のOneDriveフォルダにアップロードする。

• PowerAutomate、Office Scriptsが動く。

• Office Scriptsで稼働時間が定時時間を超えていないかチェックする。

• 稼働時間が多い場合に、Teamsに警告メッセージが来る

使うもの

• PowerShellスクリプト

• Power Automate

• Office Scripts

作成

1.Windowsのイベントログ収集

WindowsのイベントログからPCの稼働時間を取得します。
Windowsのイベントログはコマンドでcsvファイルなどに取り出すことができます。
稼働時間の計算に使えるのは下記のIDあたりかと思います。
　6005(7001)：起動
　6006(7002)：シャットダウン(正常
　6008：シャットダウン(異常
　42：スリープ状態の開始
　1：スリープ状態からの復帰

今回はスリープの開始と復帰にだけ焦点を当てて情報を取得します。
保存の時のファイル名を取得日時にする目的もあり、スクリプトファイルの形にしました。
PowerShellスクリプトは下記githubにおいてます。
GitHub - kgnk-hkr/getWindowsEventinfo

csvファイルの中身はこんな感じです。

これをOffice Scriptsで処理できるように、何らかの手段でxlsxファイルの形にします。
私はだいたいExcelの機能で変換しなおしてます。

2.Office Scripts作成

次に、上記で収集したイベントログから、稼働時間を計算します。
ついでに、定時時間を超えているかどうかも確認します。
これらをOffice Scriptsで実施します。

Office Scriptsとは？
Excel on the webで使えるExcelの自動化機能です。
Excel で行う操作を操作レコーダーで記録すると、スクリプトが作成されてとても便利です。
docs.microsoft.com

操作レコーダーで記録した部分のスクリプト
ここでは、主に見た目を整えています。
操作レコーダーで記録すると何をしているのかのコメントも自動で入れてくれます。

稼働時間を計算する部分のスクリプト
スクリプトはTypeScriptまたはJavaScriptで編集することができます。
稼働時間を計算する部分は手動で書き加えました。
やっていることとしては、スリープ開始時間と復帰時間の差分を取り、Timeに格納します。
稼働時間の総時間をSunTimeに格納します。
SumTimeが定時想定の稼働時間を超えていたらAnswerに1を格納するようになっています。
しかし、見てわかる通り、エラーが出ています…
動くは動くのですが、書き方が正しくないようなので要改善です…

スクリプト実行前

スクリプト実行後

3.Power Automate作成

ファイルのアップロードをトリガーに、
稼働時間計算のOffice Scriptsを実行し、
稼働時間によってTeamsにメッセージを送るというフローを作ります。

フロー全体

トリガーの設定
今回は社員が取得したWindowsのイベントログを特定のOneDriveフォルダにアップロードすることをトリガーとします。

ファイルのデータを取得する
Office Scriptsを開始するための条件に使う用の情報を取得します。

値の初期値の設定
定時時間以上の稼働があるか判定するために使う判定基準と判定対象をセットします。
最終的な判定の時にExcel上のデータを抜き出して判定するため、文字列で設定します。

条件の設定
Office Scriptsを実行するために条件分けを入れます。
ファイルコンテンツの種類がexcelであることを判定します。

はいの場合
スクリプトを実行します。
実行するスクリプトと対象のファイルを設定します。
対象のファイルは、アップロードされたファイルを指定しています。

行の取得
稼働時間が定時時間を超えているかを確認するために、スクリプト実行後のファイルから対象のデータを取得します。
一行目を取得してきます。

判定対象に値を格納
取得したデータを設定しておいた「判定対象」に格納します。
Answerの枠に入っている値が判定対象になるため格納します。
outputs('行の取得')?['body/Answer']

条件の設定
判定対象が判定基準と一致している場合は定時時間以上に働いている疑いがあるので、注意喚起するようなTeamsメッセージを送ります。
ファイルのアップロードした人の名前を入れることができるので、どの社員が働きすぎているのかも伝えられます。

4.動作確認

フローが正常に動くと、こんな感じでメッセージが来ます。

改善点

• Office Scriptsでエラーが出ているので、これは改善の必要があります。

• Windowsイベントログの取得とアップロードが手動になっていて手間なので、ここも自動化できたらいいなと思います。

参考サイト様

Power Automate | 誰でもできる業務改善講座

Office Scriptsってどんな機能？ | 初心者備忘録

https://forsenergy.com/ja-jp/windowspowershellhelp/html/62e7642c-51d4-47d1-97fe-62b08197896a.htm

その他資料(2020/12/05更新)

発表資料のほうがOffice Scriptsまわりの説明は詳細かもしれません。

20201128 Power Automate from ひかり 影中

www.slideshare.net

終わりに

今回はスリープ状態での稼働時間しか集計していませんが、シャットダウンなども含んだら、もっと正確な勤務時間が出せるような気がします。
在宅勤務が続くことで、人の目につかないところでオーバーワークをして辛くなる人が出てくるのが恐ろしいので、そのあたりをカバーできるようなフローを考えられるといいなぁと思っています。
今回初めてOffice Scriptsを触りましたが、便利でおもしろかったです！Power Automateで実行できるのもさらにおもしろいですね！

【JavaScript】サンプルボタン作成 - その4(React利用 - クラスコンポーネントver.)

はじめに

JavaScriptを勉強し始めました。
Reactのありがたみを知るために、簡単なサンプルボタンを下記パターンで書いて比較してみます。
それぞれの書き方の差を確認するために書いたので、実装としては良い書き方じゃないところもあります。

比較パターン

クラス利用無し
【JavaScript】サンプルボタン作成 - その１ - オンプレ系インフラエンジニアがAzureを勉強する
クラス利用有り
【JavaScript】サンプルボタン作成 - その2(クラス利用) - オンプレ系インフラエンジニアがAzureを勉強する
React利用有り-関数コンポーネント使用ver.
【JavaScript】サンプルボタン作成 - その3(React利用 - 関数コンポーネントver.) - オンプレ系インフラエンジニアがAzureを勉強する
React利用有り-クラスコンポーネント使用ver.(この記事)
【JavaScript】サンプルボタン作成 - その4(React利用 - クラスコンポーネントver.) - オンプレ系インフラエンジニアがAzureを勉強する

題材

下記のようなボタンをサンプルにします。
【要件】
OKボタンをクリックするとNGボタンに変わる
OKボタン、NGボタンともにマウスオーバーで色が変わる
ボタンにカーソルを合わせるとマウスカーソルが変化する

 

共通部分(CSS)

CSSは一律共通にしています。

/* ボタンの基本にするスタイル */
/* OKの時 */
.sampleButton-ok {
    width: 128px;
    height: 40px;
    margin: 8px;
    background-color: #ff3535;
    border: solid 1px #ff3535;
    border-radius: 4px;
    color: #fff;
    font-size:12px;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
}

/* OKの時のマウスオーバー */
.sampleButton-ok:hover {
    background-color: #da3232;
}

/* NGの時の基本スタイル(※OKボタンからの差分のみ) */
.sampleButton-ng {
    background-color: #fff;
    border: solid 1px #3553ff;
    color: #3553ff;
}

/* NGの時のマウスオーバー */
.sampleButton-ng:hover{
    background-color: #eee;
}

HTML/CSS/JavaScript-React利用有り-クラスコンポーネント使用ver.

HTML/CSS/JavaScriptに加えてReactを使います。
Reactのコンポーネントにも関数コンポーネントとクラスコンポーネントがあるので、今回はクラスコンポーネントを使います。
ja.reactjs.org

プロジェクトの作成

Reactのプロジェクトを作成するところは備忘録として記載します。
Reactを使うための初期構築についてはいろいろわかりやすい記事があるのでそちらをご覧ください。
[手順]

• Visual Studio Codeを開く。
• 新しいターミナルを開く。
• npx create-react-app [プロジェクト名]でプロジェクトを新規作成。
• cdでプロジェクトのディレクトリに移動。
• yarn startで実行。

不要なファイルもたくさんあるため、必要に応じて削除します。

index.html

タイトルの部分だけ変更します。
不要な部分も削除します。(残しておいてもボタンの挙動には影響ないです。)

index.js

App.jsというメインになるページを呼び出しています。
ここで直接ボタンのコンポーネントを呼ぶこともできますが、複雑なUIを作っていくことを考えると、ここでボタンのような一機能のコンポーネントを直接呼び出すことはあんまりないかなと思います。

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

App.js

ここでSampleButtonというボタンのコンポーネントを呼び出します。
クラスを適用するためのidの指定をしておきます。

import React from 'react';
import SampleButton from './SampleButton';

function App() {
  return (
    <div >
      <SampleButton id="samplebutton"/>
    </div>
  );
}

export default App;//他の関数から呼び出せるように

SampleButton.js

ボタンの本体部分になります。
ここからが関数コンポーネントと異なる部分になります。

import './SampleButton.css';
import React from 'react';

class SampleButton extends React.Component {
  // コンストラクター
  constructor(props) {
    super(props);
    // テキストの初期値設定
    this.state = {
      text: 'OK',
    };
  }

  // クリックイベントで実行する処理
  handleClick() {
    const samplebutton = document.getElementById(this.props.id);

    if (!samplebutton.classList.contains('sampleButton-ng')) {
      // テキストの変更
      this.setState(state => ({
        text: 'NG'
      }));
      // クラスの追加
      samplebutton.classList.add('sampleButton-ng');
    } else {
      // テキストの変更
      this.setState(state => ({
        text: 'OK'
      }));
      // クラスの追加
      samplebutton.classList.remove('sampleButton-ng');
    }
  }

  render() {
    // ボタンを複数個使用する場合はidで判別するため、決め打ちではなく上位から受け取ったもの指定にする
    return (
      <div onClick={this.handleClick.bind(this)} className="sampleButton-ok" id={this.props.id}>
        {this.state.text}
      </div >
    )
  }
}

export default SampleButton;

ボタンを増やす場合

コンポーネント呼び出し時のidを分けるだけで同じボタンが量産できます。

App.js

import React from 'react';
import SampleButton from './SampleButton';

function App() {
  return (
    <div>
      <SampleButton id="samplebutton1"/>
      <SampleButton id="samplebutton2"/>
      <SampleButton id="samplebutton3"/>
    </div>
  );
}

export default App;//他の関数から呼び出せるように

SampleButton.js
変更なし。

コード全体

 コード全体は下記Githubにあげています。
github.com

おわりに

以上4パターンで書き比べてみました。
ここまでやってようやくReactのありがたみが少しわかったような気がします。
まだそれぞれの特性や細かい意味とかまでは使いこなせていないのでもっと精進します。
 stateとかhookとか値の保持が必要になってくるとまた複雑になってくると思うので、そのあたりもちゃんと書き分けを整理したいと思います。
JavaScriptとTypeScriptの書き方比較もやりたいです。