# 20231224_ILIASに自動でログインしたい *日常生活を便利に*
(例：20210901_LT会を開催しました)
###### tags: `ブログ記事`

- [ ] 公開（ブログ公開担当者がいじるやつ）

太字斜体で書いてある内容を埋めて行ってください．
文章，画像は太字斜体の下の行に入れてください．
最初に書く時はREADMEを読んだら読むといいと思います．

<br>

## 表示されない情報
***書いた人の名前(自己紹介文と同じ名前)***
{
i2・よーちゃん
}

***記事の簡単な説明(検索した時にタイトルの下に出てくる文章)***
{
NUTMEGに加入して活動を初めて，8ヶ月ほど経とうとしている．
クリスマスが近づく中，レポートに追われる日々．
ふと，思いました．「ILIAS，毎回ログインするの面倒だなぁ.」
}

<br>

## 表示される部分
***サムネイル画像***
{

}

***カテゴリ***
以下の中から該当しそうなカテゴリを選択してください
※一つだけ選択してください
- [ ] 対外活動
- [ ] 活動の様子
- [ ] メンバーの趣味
- [x] NUTMEG Advent Calendar 2023

***タグ***
以下の中から該当しそうなカテゴリを選択してください．当てはまる物がない場合は適宜追加してください.
言語
- [x] HTML
- [ ] CSS
- [ ] Python
- [ ] Go
- [ ] Ruby
- [x] JavaScript
- [ ] TypeScript
- [ ] Dart
- [ ] Rust
- [ ] Kotlin
- [ ] Swift

フレームワーク・ライブラリ
- [ ] Ruby on rails
- [ ] Vue.js
- [ ] Nuxt.js
- [ ] React.js
- [ ] Next.js
- [ ] Gin
- [ ] Flluter

ツール
- [ ] GitHub
- [ ] ターミナル
- [ ] WSL
- [ ] Ubuntu
- [ ] Docker
- [ ] Raspberry Pi
- [ ] Figma

分野
- [ ] チームづくり
- [ ] フロントエンド
- [ ] バックエンド
- [ ] インフラ
- [ ] Web-design
- [ ] API関係

---

***以下に本文を記載してください***

## 日常生活を便利に

NUTMEGに加入して活動を初めて，8ヶ月ほど経とうとしている．
クリスマスが近づく中，レポートに追われる日々．

ふと，思いました．

> ILIAS，毎回ログインするの面倒だなぁ

## eラーニングシステム

ILIASとは長岡技術科学大学で使われている，学習管理システム．
授業資料の閲覧・ダウンロード，課題のアップロード，アップロードされた講義動画の閲覧ができる．

## ILIASのログイン面倒だなあ

ILIASのログインは，トグルボタンと，テキストボックスと，送信ボタンがある．
テキストボックスは，ブラウザのパスワード自動入力でなんとかなる．
そして，ログインボタンもEnterキーでなんとかなる．
しかし，トグルボタンはどうにもできなかった…


よし，もっと楽にしよう!!

じゃあ，まずはブラウザのDeveloper Mode でコードを見てみる．


<div class="col-sm-9">
	<div id="auth_mode">	
		<div class="radio">
			<label class="radio-inline"><input type="radio" onclick="il.Form.showSubForm('subform_auth_mode_1', 'auth_mode', null);" name="auth_mode" id="auth_mode_1" value="1" checked="checked">
			ILIAS Native認証</label>
		</div>
			
		<div class="radio">
			<label class="radio-inline"><input type="radio" onclick="il.Form.showSubForm('subform_auth_mode_2_1', 'auth_mode', null);" name="auth_mode" id="auth_mode_2_1" value="2_1">
			LDAP認証（統合アカウント）</label>
				
		</div>
	</div>
</div>

こんな感じ．

GPTの提案で，URLを書き換えてみる．

https://cera-e1.nagaokaut.ac.jp/ilias/login.php?client_id=contents1&cmd=force_login&lang=ja&auth_mode=ldap

結果はダメです．

“ILIAS Native認証” のところにすでに “checked属性”がついている．
Webページがサーバからロードされるとき，すでにHTMLが生成されているため，URLパラメータによってコードが動的に変更されることはない．

→ URLで変更することは厳しそうとみた．

さて，どうするか．
JavaScriptを使用して，ページロード後に変更しよう！！
つまり，自分が操作したことと同じことをプログラムにさせよう！
そこで，“ブックマークレット” というものがある．

## ブックマークレットを使おう

> **ブックマークレット**
>
>
> ブラウザのブックマークから簡単なJavaScriptのコードが実行できるもの
>

できたこと

ILIASのログインページを開いた状態で，
JavaScriptのコードを書いたブックマークレットを作成する．
“ILIAS ブックマーク…” を ポチッ と押す．

トグルボタンの選択を `LDAP認証 (統合アカウント)` の方につけることができた．



作り方

これとか参考になるかも
[ブックマークレットでブラウザに便利機能を追加してみよう - Qiita](https://qiita.com/yusuke113/items/48afc10899287b169105)

ブラウザはGoogle Chrome

1. ブックマークバーを右クリックする
2. `ページを追加…` をクリックする
3. 名前はお好みで
4. URLのところに，javaScriptのコードを貼る

    javascript:(function() {
      var radioButton = document.getElementById('auth_mode_2_1');
      if (radioButton) {
        radioButton.click();
      } else {
        alert('ラジオボタンが見つかりません。');
      }
    })();

今回は↑のコードを貼った．

5. 完成

## 今後に続く…

ILIASのログイン画面は，このほかに，`ユーザ名`　と`パスワード`の入力がある．

さらに，`ログインボタン`をクリックするという行程が残っている．
さらにさらに，上の項目が全部できたとしても，ログイン画面でブックマークレットをクリックする必要がある．
もっと **日常生活を便利** にという道のりは，続編*に続く．

---

*続編投稿時期未定(近いうちに書きます...)