OmniAICreator/Qiita-1.07M huggingface dataset:
8946 Take#１３


# 問題

http://www.hackerschool.jp/hack/take13.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/a15d1e96-6992-9876-77c5-802a70838116.png)

# 解いてみた

- ということで、ファイルをダウンロードします。
- ダウンロードするとzipファイルでした。
- zipファイルを解凍するとtake13.jpgというファイルが入ってました。
- ダブルクリックしました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/88255a29-cba9-f44d-ce91-f9f12e1d302f.png)

- jpgファイルではないようです。
- ファイルヘッダが見たいですね。
- ここでLinuxならfileコマンドを使いたいところですが、あいにくwindowsです。
- なので、バイナリエディタを使います。
	- 今回は入れておきました。Stirlingです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/877674e3-1b78-86e2-186b-03a07c824e02.png)

- 先頭は「8BPS」だそうです。
- PSDファイルというフォトショップの画像ファイルだそうです。
- フォトショップ持ってません。
- もしやフォトショップを買わないと解けない激ムズ問題じゃないかと思いましたが、いまどきフリーのビューワくらいあるだろうと。
- 調べるとGIMPで見れるそうなのでやむなくインストール。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/d3ed857f-7d3c-6ba2-9f82-a763315626cb.png)

- よくわからんが、この画面が延々続く。。。
- なんとか耐えました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/d99054eb-b822-c241-586f-964a5e9434a2.png)

- 使い方がよくわかりませんが、とりあえずこんな赤い画像だそうです。
- これでは全く答えがわからないなと思っていたら右側に意味深な感じのものを見つけました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/52098148-8b65-22f4-68a8-6004f064d44b.png)

- なるほど、画像を2枚重ねたりできるんですね。
- ということで赤い画像を消します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/97dd2f29-5171-f69f-c538-6bc484bba231.png)

- だそうです。
- RDPのポート番号は覚えていないので、google検索します。
- 正解は3389です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/2713fdcf-c7c2-b5c9-fb49-d189b9fc0745.png)
8946 Take#３１


# 問題

http://www.hackerschool.jp/hack/take31.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/735b65b4-e35a-fe48-9437-2c6650d99188.png)

# 解いてみた

- 画像をダウンロードして、拡大してみます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/d907ba59-53c3-44b2-a99f-1ab7991d5c21.png)

- にじんでよく見えませんね。
- プロパティを見ても特にexif情報はありませんでした。
- ということはステガノグラフィですかね。
- バイナリエディタがなかったのでサクラエディタで開いてみた。
	- 本当はバイナリエディタで開いた方がいいです。。。良い子はマネしないように。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/65f25e9a-a2e9-1735-2f02-4bac2bde4d41.png)

- ということでThunder burst fire!!!が正解。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/e8c6dea4-d91e-6e73-f0be-9d9a6bc9a598.png)
8946 Take#１５


# 問題

http://www.hackerschool.jp/hack/take15.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/b2747e82-e74c-0441-4c58-be8ea430f3a6.png)

# 解いてみた

- リンクが貼られているのでクリックしてみます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/5f7678dc-e82e-0c8b-bdbd-24d316d257c2.png)

- ということなので、一瞬だけ表示される系のやつですかね。
- wiresharkでパケットを見てみましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/3bb8cbe5-1a02-be74-3296-b7367077aeb6.png)

- レスポンスの8946tanosinderuomoshiroimondaiarebagorenrakukudasaiが答え。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/1dcab270-f1de-e6dc-dcb8-a59190a3e96d.png)
macOS MojaveでApacheを起動しようとしたらPermission denied: AH00099: could not create /usr/local/var/run/httpd/httpd.pidとなったときの対応方法

# 事象 : Apacheを起動しようとしたら起動しなくてログを見たらなんか出てた
```bash
# 起動した？
$ apachectl start
# 起動していない
$ apachectl stop
httpd (pid 16705?) not running
# 設定間違い？
$ httpd -t
Syntax OK
# logファイルどこだっけ？
$ cat /usr/local/etc/httpd/httpd.conf | grep ErrorLog
# ErrorLog: The location of the error log file.
# If you do not specify an ErrorLog directive within a <VirtualHost>
ErrorLog "/usr/local/var/log/httpd/error_log"

$ cat /usr/local/var/log/httpd/error_log
[Wed Dec 19 23:53:59.892903 2018] [core:warn] [pid 73462] AH00098: pid file /usr/local/var/run/httpd/httpd.pid overwritten -- Unclean shutdown of previous Apache run?
[Wed Dec 19 23:53:59.893658 2018] [core:error] [pid 73462] (13)Permission denied: AH00099: could not create /usr/local/var/run/httpd/httpd.pid
[Wed Dec 19 23:53:59.893697 2018] [core:error] [pid 73462] AH00100: httpd: could not log pid to file /usr/local/var/run/httpd/httpd.pid
```
# 原因 : 前回起動時の `httpd.pid`が残っているが上書きする権限がないから
httpd.pidってなんだろう？
> PIDは、waitpid()やkill()、あるいはsigsend()といったシステムコールの引数であり、ある特定のプロセスに対して何らかの処理を要求する場合、そのプロセスの特定のために使われる。
> 但し、あるプロセスから特定の他のプロセスのPIDを得る方法はなく、このためプロセスは、必要に応じてプロセスIDを書いたファイルを用意する。例えば、syslogdなら「/var/run/syslogd.pid」、httpdなら「/var/run/httpd.pid」、といった具合である。なお、このパス名は環境依存であり、OSによっては異なる場所に置かれる場合がある。
> [プロセスID ‐ 通信用語の基礎知識](https://www.wdic.org/w/TECH/%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9ID)


```bash
$ ls -l /usr/local/var/run/httpd
total 8
-rw-r--r--  1 root  admin  6 12 10 23:53 httpd.pid
```

- [エラーメッセージとその対処あれこれ - think-t の晴耕雨読](http://think-t.hatenablog.com/entry/20101003/1286091649)
- [pidファイルが残ってしまっている場合の起動時の挙動 - Qiita](https://qiita.com/devneko/items/6a5e69086de3053d9abah)
- [PIDファイル保存場所にroot権限が必要 - Qiita](https://qiita.com/tomluck/items/0ad6737131a829411845#1pid%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E4%BF%9D%E5%AD%98%E5%A0%B4%E6%89%80%E3%81%ABroot%E6%A8%A9%E9%99%90%E3%81%8C%E5%BF%85%E8%A6%81)

## 対応 : `httpd.pid` を削除する
今回は削除します。様子を見てよく発生するようであれば `httpd.pid` のあるディレクトリの権限変更を検討します。

```bash
$ sudo rm /usr/local/var/run/httpd/httpd.pid 
Password:
$ ls -l /usr/local/var/run/httpd
$ apachectl start
$ apachectl stop
$ cat /usr/local/var/log/httpd/error_log | grep Dec\ 20
[Thu Dec 20 21:11:09.377340 2018] [mpm_prefork:notice] [pid 74369] AH00163: Apache/2.4.37 (Unix) configured -- resuming normal operations
[Thu Dec 20 21:11:09.377765 2018] [core:notice] [pid 74369] AH00094: Command line: '/usr/local/opt/httpd/bin/httpd'
[Thu Dec 20 21:11:26.251257 2018] [mpm_prefork:notice] [pid 74369] AH00169: caught SIGTERM, shutting down
```

[`error_log` に上記のような出力があっても単なる情報だから気にしなくて:ok:らしい。](https://serverfault.com/questions/607873/apache-is-ok-but-what-is-this-in-error-log-mpm-preforknotice)
8946 Take#３３


# 問題

http://www.hackerschool.jp/hack/take33.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/c0d0d729-3049-fa0f-e3f2-e74275e0bbee.png)

# 解いてみた

- ついにWeb以外の問題が出ました。
- 画像のexifですかね。
- ということで画像を保存して、プロパティを見ます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/537a394a-f201-00a0-72d5-466d118a1cbb.png)

- カメラのモデルはiPhoneでよさそうです。
- 次にGPS。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/a6b9c1b6-2f9c-c565-0e1b-34825ebdbf5e.png)

- コピペできないのがつらいところですが、以下です。
	- 48; 12; 41.3
	- 16; 21; 55.8

- GoogleMAPに入力する方法がわからなかったので検索。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/56c01a46-5b5c-70e8-f9ea-fad18f582d3e.png)

- とのこと。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/bfd59dc0-daca-2634-5ccb-b29a7775af54.png)

- ウィーンです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/5f1fa602-5b23-a073-d101-044cb8ac2531.png)

- ウィーンではなくWienです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/94b9d526-2f13-03a9-fcca-7c60f2a490b4.png)
8946 Take#２２


# 問題

http://www.hackerschool.jp/hack/take22.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/69000cca-3bf3-8fcc-cc87-a93bdf677825.png)

# 解いてみた

- 答え書いてあるやん。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/c0085bf0-b492-d2fe-f474-a8b7becfac4d.png)

- と思ったらなぜか3文字しか入らない。maxlengthか？

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/369651aa-af7a-67f2-0612-f1db9e5c4b41.png)

- ですね。
- ということで適当に数字を増やして入力できるようにする。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/e7dabb20-25ed-eb97-46b6-1656e15db55c.png)

- 答えはtake22passwordです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/6e087eaf-2aa6-78ca-fbc1-2aaf73f04638.png)
8946 Take#１２


# 問題

http://www.hackerschool.jp/hack/svn/index.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/580fc0ad-50d0-a404-824a-ef4c72c0c063.png)

# 解いてみた

- ソースを見ましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/e2a1cb61-6df7-ac60-384e-64a22a9c9ff7.png)

- 特に何もないですね。
- SQLインジェクション的なエラーが出ないか、確認してみます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/cd6e9986-bc56-1808-44aa-9f88db610f91.png)

- IDとパスワードどちらも入力チェックを行っているようで、英数字しか入力できません。ということで、SQLインジェクションもなさそう。
- パケットを見てみましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/196e48d0-4e07-320f-43d0-c1622e431512.png)

- パケットにも怪しいところはありません。
- そういやURLがいつもと少し違うことに気づく。
- SVNってGitが流行る前によく使ってたバージョン管理のやつかなと。
- svnの管理ファイルって各フォルダに必ずできてる.svnですよね。
- ということでアクセスしてみる。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/75bd7dff-012c-ef8e-52ee-0b5d05b12866.png)

- 来ましたね。
- ここから先のフォルダ構成が分からなかったので上から順にフォルダを開いていくと、/.svn/text-base/index.php.svn-base に答えがありました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/3f878730-649c-6b00-9665-28b7a8762bbd.png)

- 文字化け起きてるけど正解は以下です。
	- ID: take12id 
	- pass: take12password1234

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/7430a9a1-1203-68c4-f066-efa633ca5786.png)

- ちなみにFireFoxで開くと文字化けせずに表示されました。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/3f431483-1e8b-fde9-823c-d4d04ddf8834.png)
8946 Take#７


# 問題

http://www.hackerschool.jp/hack/take7.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/512256e2-94d1-174c-4f55-cf406eb0f905.png)

# 解いてみた

- ついに入力欄がなくなりましたね。
- ソースを見てみましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/354b5af3-3b47-4a0d-9098-e170ae5ff55a.png)

- ヒントのなるようなところは何もありません。
- 次にWiresharkを使ってパケットを見てみます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/92b96aca-455a-86b2-8ce6-b56ef66218cb.png)

- 送信側（ピンク）の最後の「login=」が怪しいけどここに何を入れたらいいのかさっぱりわからない。しかし最後の手段としてはあてずっぽで。。。
- と思ったらCookieのところに「take7_login_status=0」とかいう怪しすぎるものを発見した。
- これをtake7_login_status=1にすればいけるんじゃないかと。
- Chromeを使ってCookieを編集します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/67b9422d-dfb6-a712-d16b-748d849ab17d.png)

- こんな感じで1にしてボタンをクリックすると正解でした。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/61fa1c1d-0610-16dc-134b-eef4ee310ea4.png)
git addで新規ファイルのみ追加する

今仕事で行なっているシステム移行でやったこと。
gitのバージョンは1.7.11.1。

```sh
$ git --version
git version 1.7.11.1
```

例えばこういうケース。

```sh
$ git status
# On branch master
# Changes not staged for commit:
#   (use "git add <file>..." to update what will be committed)
#   (use "git checkout -- <file>..." to discard changes in working directory)
#
#	modified:   add1.txt
#
# Untracked files:
#   (use "git add <file>..." to include in what will be committed)
#
#	add2.txt
#	add3.txt
#	add4.txt
#	add5.txt
#	add6.txt
#	add7.txt
#	add8.txt
#	add9.txt
no changes added to commit (use "git add" and/or "git commit -a")
```

gitで管理しているファイルを変更するときに、追加する分と更新する分を分けてコミットしたい。

新規ファイルのみ追加するときは、`git add`に`-i`オプションをつけて対話モードを実行する。

```sh
$ git add -i
           staged     unstaged path
  1:    unchanged        +1/-0 add1.txt

*** Commands ***
  1: status	  2: update	  3: revert	  4: add untracked
  5: patch	  6: diff	  7: quit	  8: help
```

ここで`4: add untracked`を選び、対象ファイルを選択する。

```sh
What now> a
  1: add2.txt
  2: add3.txt
  3: add4.txt
  4: add5.txt
  5: add6.txt
  6: add7.txt
  7: add8.txt
  8: add9.txt
Add untracked>> *
added 8 paths
```

`*`ですべてを選択する。選択したら対話モードを終了する。

```sh
*** Commands ***
  1: status	  2: update	  3: revert	  4: add untracked
  5: patch	  6: diff	  7: quit	  8: help
What now> q
Bye.
```

こうすると、対話モードで選択したファイルのみをステージに追加できる。

```sh
$ git status
# On branch master
# Changes to be committed:
#   (use "git reset HEAD <file>..." to unstage)
#
#	new file:   add2.txt
#	new file:   add3.txt
#	new file:   add4.txt
#	new file:   add5.txt
#	new file:   add6.txt
#	new file:   add7.txt
#	new file:   add8.txt
#	new file:   add9.txt
#
# Changes not staged for commit:
#   (use "git add <file>..." to update what will be committed)
#   (use "git checkout -- <file>..." to discard changes in working directory)
#
#	modified:   add1.txt
#
```

ちなみに、更新したいファイルのみを追加するときは

```sh
$ git add -u .
```

`git add`に`-u`オプションをつけて実行すると

```sh
$ git status
# On branch master
# Changes to be committed:
#   (use "git reset HEAD <file>..." to unstage)
#
#	modified:   add1.txt
#
# Untracked files:
#   (use "git add <file>..." to include in what will be committed)
#
#	add2.txt
#	add3.txt
#	add4.txt
#	add5.txt
#	add6.txt
#	add7.txt
#	add8.txt
#	add9.txt
```

更新分のみステージに追加できる。

## 参考

- [git - Adding Only Untracked Files - Stack Overflow](https://stackoverflow.com/questions/7446640/adding-only-untracked-files)
- [Git - 対話的なステージング](https://git-scm.com/book/ja/v1/Git-%E3%81%AE%E3%81%95%E3%81%BE%E3%81%96%E3%81%BE%E3%81%AA%E3%83%84%E3%83%BC%E3%83%AB-%E5%AF%BE%E8%A9%B1%E7%9A%84%E3%81%AA%E3%82%B9%E3%83%86%E3%83%BC%E3%82%B8%E3%83%B3%E3%82%B0)
8946 Take#６


# 問題

http://www.hackerschool.jp/hack/take6/index.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/b19f18c6-f8ab-994d-57b7-9de7c5c3d288.png)

# 解いてみた

- まさかの画面表示前の認証です。
- basic認証ってやつですかね？
- パケットでも見てみますか。
- ということでwiresharkで見てみます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/89c51805-afa1-5544-ab30-d15a07baf22f.png)

- 送信パケットです。
- 送信したユーザとパスワードはadminと8946。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/160fba63-2654-1e89-1503-f03ffcad0d33.png)

- 戻りパケットです。
- WWW-Authenticate: Basic realm=というのがあったらBasic認証らしいです。
- ただBasic認証だとわかったところでどうするのか。。。
- Basic認証があまりセキュアではないといわれるのは通信が暗号化されていないという話で、今回でいうと送信したユーザとパスワードがパケットからわかってしまう。ということだけ。
- つまり認証成功しているパケットもなく、無から認証情報を導くことはできないのです。
- Basic認証を深く理解する必要があると判断し、Google検索します。
- そうするとどうやら.htpasswdというファイルにユーザとパスワードを保存していることがわかりました。
	- Wikipediaには書かれてなかったけど、いろんな人がブログ等に書いていたから、きっとあってる。
- ということで少し前の問題にもあったファイルに直接アクセスする作戦かなと。
	- .htpasswd
	- htpasswd
- どちらもないですね。
- 前回同様htpasswd.txtかなとやってみたらあってました。。。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/c76a7206-c273-c0c9-449f-3fded3ed0da0.png)

- パスワードはbase64で暗号化されているのでCyberChef「https://gchq.github.io/CyberChef/ 」を使う。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/f5ffb1d7-6959-137b-b1fc-9a469570cc37.png)

- ということで正解は以下です。
	- tanaka
	- tanaka777

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/a98c540b-c266-4ae4-a6cc-fa47110ba448.png)

- 結局この問題もファイル名を勘であてるというエスパーだったわけなんですが、実際はどうやって解けばよかったんでしょうか。
8946 Take#１１


# 問題

http://www.hackerschool.jp/hack/take11/index.php?file=index.html

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/4a4a9817-94b7-31ae-a8b9-2cf761f0f3d8.png)

# 解いてみた

- ソースを見ましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/16b023a4-b439-4782-1e97-811fff912871.png)

- 特に何もないですね。
- きっとSQLインジェクション系なんでしょう。
- 英数字を適当に入れてみたり、前回使った「' or 1 = 1 --」とかをやってみても何も起こらない。。。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/659a9e4b-229d-4660-a3b3-2f29030089dd.png)

- 万策尽きた感あったけど、もう一度ソースをみてみると、formのactionのところにパラメータが付いていることに気づく。
- action="./index.php?file=index.html" 
- このパラメータが何に使われるかはわからないが、とりあえず変えてみるしかない。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/29301c21-b211-d855-e5b6-fe6f3fc0e7e4.png)

- おお、まさかのエラーが上に出た。
- ファイルを開くのに失敗したらしい。
- ということはここで何か存在するファイルを指定することができれば正解に近づくはず。
- たぶんパスワードが書かれたファイルが存在するのではないか。
- が、何を入力したらいいのやら。
- が、他に何もできることがないので、あてずっぽで頑張るしかない。
	- password
	- passowrd.html
	- password.php
	- pass
	- pass.html
	- pass.php
- 全部だめですね。
- もしかしてsqliteのファイルとかが置かれていて、それの中身を開くコマンドをうまくやって。。。いやそこまでのことをここでやるのは厳しすぎる。
- みたいなことを考えつつ、それなら単純にテキストファイルに保存しているのかも。
- passowrd.txtとか？

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/8594ac18-0612-ca5e-56a1-42c256c7f543.png)

- 泣いて喜びましたよ。
- ということで正解は以下です。
	- ID:admintake11
	- pass:take11password

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/bceb3c54-893b-6671-5da1-bdbd3e0d6825.png)

- 解説読んでも結局よくわからなかったんですが、どうやって解くのがスマートだったんでしょう。
- 今回の私の解き方は完全に運が良かった、だけですし。
- もしかして運を狙ったエスパー問題だったりする？
Python で、非同期処理（コルーチン）と同期処理（スレッド）を併存させる

PythonのAsyncioを使ったコルーチンによる非同期処理を使いたい。
一方、同期処理で書いた既存のPythonコードがある。
仕組みが異なるので、併存は難しい？

例えば、以下で、できました。非同期処理のループを親にして、それに同期処理スレッドをぶら下げます。ちなみに、スレッドを分けてから、1スレッドで非同期処理をするというのは動きませんでした。

```py
import asyncio
import websockets
import concurrent.futures
import cv2

#同期処理
def th2():
    while True:
        print('-')
        time.sleep(0.1)
#同期処理
def th():
    #並列実行スレッド内部でさらに同期的なスレッド起動　　　　　　　　　　　　　　
　　asyncio.ensure_future(loop.run_in_executor(exec, th2))
　　#普通の処理...

#　非同期処理コルーチン
async def ws_handler(ws, path):
    async for msg in ws:
        print('ws_svr > Received from client:', msg)
        await ws.send('pong')

if __name__ == '__main__':
    # 同期処理の並列実行準備
　　exec = concurrent.futures.ThreadPoolExecutor(max_workers=4)
　　# 非同期処理設定
    ws_server = websockets.serve(ws_handler, '123.456.789.1', 8081)
    loop = asyncio.get_event_loop()
    # 同期処理の実行予約
　　asyncio.ensure_future(loop.run_in_executor(exec, th))
    #　非同期処理実行ループ
　　loop.run_until_complete(ws_server)
    loop.run_forever()

```
nginx+puma+sinatra サブディレクトリ、unixソケット構成（ポートなんぞ使わん）

# nginx+puma+sinatra サブディレクトリ、unixソケット構成（ポートなんぞ使わん）
railsアプリケーションでのサブディレクトリ構成は多々記事があったけど、sinatraの記事が少なかったので書きました。
参考になれば幸いです。

今回は下記構成をもとに記事を書きます。

###構成
```
/var/www/
app/
　├ config/puma.rb
　├ log/*.log
　├ tmp/
　│　├ pids/puma.pid
　│　└ sockets/puma.sock
　├ config.ru
　└ app.rb

※bundle系ファイル略
```


###url
http://localhost/app
※/appがサブディレクトリ部分


参考のソースはgithubに上がってます。
https://github.com/Gen-Arch/app


#インストール
installはgemでもbundleでも、今回はbundleでgemを管理します。

##アプリケーションディレクトリ作成
```shell-session:
mkdir app
cd app
```
※ディレクトリ名は何でも（大抵はアプリケーション名）

### Gemfile生成
```shell-session:
bundle init
```

生成されたGemfileに下記追記

```Ruby:Gemfile
gem "sinatra"
gem "puma"
```

###gem install
```
bundle install --path vendor/bundle
```


##sinatra　設定
```Ruby:app.rb
require "sinatra"

#Webサーバーを指定
set :server, :puma

#サブディレクトリを指定
before do
  request.script_name = "/app"
end

#root処理
get "/" do
  "hello world"
end

#redirect処理
#サブディレクトリ運用確認テスト用
get "/redirect" do
  redirect to("dest") 
end

#redirect先
get "/dest" do
  "yattaze"
end
```

#puma設定
```ruby:config.ru
#sinatraファイル名を指定
require_relative "app"

run Sinatra::Application
```

```ruby:config/puma.rb
require "fileutils"

#root path
app_path = File.expand_path("..", __dir__)
tmp_dirs = ["tmp/pids","tmp/sockets" ,"log"]

tmp_dirs.each do |path|
  mk_path = File.join(app_path, path)
  FileUtils.mkdir_p(mk_path) unless Dir.exist?(mk_path)
end

#default directory
directory app_path
#env mode
environment 'production'

#service daemon
daemonize

#process id file
pidfile "#{app_path}/tmp/pids/puma.pid"

#puma status file
state_path "#{app_path}/tmp/pids/puma.state"

#stdout, stderr put file
stdout_redirect "#{app_path}/log/app.log", "#{app_path}/log/app_err.log", true

#thread settting low, high
threads 0, 16

#socket type
#bind 'tcp://0.0.0.0:9292' #=> tcp socket
bind "unix:///#{app_path}/tmp/sockets/puma.sock"

#pumactl
activate_control_app
```

他設定については下記参照
https://github.com/puma/puma/blob/master/examples/config.rb


#nginx設定
下記をnginx.confに追記

```nginx
location /app/ {
  #rewrite url
  rewrite /app/(.*) /$1  break; 

  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header Host $http_host;

  #puma unix socket
  proxy_pass http://unix://var/www/app/tmp/sockets/puma.sock;
}
```

##サービス起動/停止
```shell-session:起動
bundle exec pumactl start
```

```shell-session:停止
bundle exec pumactl stop
```

#アクセス
##nginx rewite確認
http://localhost/app
hello worldが出れば成功

##sinatra サブディレクトリ指定確認
http://localhost/app//redirect
yattazeと表示されれば成功

#参考文献
[リバースプロキシ経由でSinatraアプリケーションを動かす](https://qiita.com/ken_kiku/items/587f806163711b969460)
[sinatraをサブディレクトリ（sub uri）で動かす](https://qiita.com/ken_kiku/items/587f806163711b969460)
8946 Take#２３


# 問題

http://www.hackerschool.jp/hack/take23.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/7e419ccd-729c-468e-c7d1-e4a2d2beac21.png)

# 解いてみた

- まずはソースコードを。。。と思ったら右クリックできない。
	- 「そういうときはlinuxを準備してwgetしたらいいんですよ。linuxの種類はまぁ初心者はubuntuでいいかな。まぁ私はkali使ってますけどね。」
	- というようなやばい輩が現れたときは無視しましょう。
- F12押しましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/689babde-14fc-1665-1d88-75a3641e2279.png)

- 突破するボタン周辺をみるとfnFormSubmit()があるのでここをみる。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/d4e3aca7-f1f9-3324-53d3-0fb88d84de9d.png)

- 普通に書いてますね。
- ということで正解はpasswordtake23です。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/2a37bfe4-8ead-a4bb-1200-696daec8368c.png)
ErgoDox EZを自分好みにカスタマイズ(物理)

# ErgoDox EZ CIY feature
 2018年からキースイッチを 取り替えられるモデルになり、自分で好きに取り替えられるように なったようです。
なので、 公式にはない好きなキースイッチを使おうとしたらちょいとハマったので、書いておこうと思います。

## CIY feature
簡単にいえば、キースイッチが半田付けされておらず、工具を使ってキースイッチを取り外せるというものです。
![IMG_5442.png](https://qiita-image-store.s3.amazonaws.com/0/211221/c2f03627-c0b2-ed18-9983-fcec8f2a186e.png)
このようにキースイッチを簡単に外すことが可能です。
これでGateronだろうが、Cherryだろうが、Kailhだろうが好きな重さのキースイッチ選び放題です。

## ErgoDox EZ CIY featureで使えるキースイッチ種類
キースイッチなんて重いか、静かかくらいの種類しかないかと思ってら、実はマウント方式が違うというのでハマりました。  

### PCBマウント
基盤に半田付けして固定するキースイッチ 
2本爪が出てるのが特徴ですね。  
![IMG_5443.png](https://qiita-image-store.s3.amazonaws.com/0/211221/cc93ed7b-1e9f-8058-bd22-fb96545eed67.png)

### プレートマウント
爪がなくてさらりとしてて、基盤側ではなく、ケースなどで固定して使うもの。
今回のErgoDox EZではこちらを選ぶことになります。
![IMG_5444.png](https://qiita-image-store.s3.amazonaws.com/0/211221/609870b0-6546-552d-a78b-2507662a2f49.png)

### ErgoDox EZ CIY featureにPCBマウントを使った場合
こういうの知らないで、とりあえず刺せたしキーも押せたので気にせず使ってました。
が、使って行くうちに異変が……
    
仕事中にMキーが飛びました  
  
PCBだと奥まで刺さらず、甘い状態になっており、自分のタイピングした後戻りの力で、キーが飛びました。
これくらいならまだいいのですが、optionキーも微妙に浮いて通電せず、optionを押せないというので、20分くらいマシンに異常がないかどうか調べてしました……
ちゃんと調べないとダメですね😊

## 自分の好きなキースイッチを使う
自分が好きなのは、軽くて、静かなキースイッチです。
重さは35g、そして静か！
今これを満たせるものがないので、合成します！
###材料
- Gateron clear plate mount ([FalbaTech](https://falba.tech/product/atreus-key-switch-pack-gateron-mx-clear-pcb-mount/))
- Gateron silent red PCB mount ([KBDfans](https://kbdfans.cn/products/pre-orderkbdfans-exclusive-gateron-silent-switch-red-brown-blak?variant=7297594589242))

Gateron clearはバネの重さが35gですが、ErgoDox EZにつけると結構カタカタ音がします。
このうるさいのを静かにさせるために、このスイッチにGateron siletn redの軸を移植します。
まずはGateron clearを分解
![IMG_4545.png](https://qiita-image-store.s3.amazonaws.com/0/211221/010bf68e-390d-a445-dd78-b7ae6b88f213.png)
分解するために、クリップを分解して専用工具を作り出してます。
次はGateron silent redを分解
![IMG_5440.png](https://qiita-image-store.s3.amazonaws.com/0/211221/add5efd9-4632-1fe1-dd64-102cd6585374.png)
この赤い軸が接触箇所に特殊加工して音が静かになるようにしてるので、これをGateron clearの軸と取り替えます
![IMG_5446.png](https://qiita-image-store.s3.amazonaws.com/0/211221/898003fc-c53a-6d0a-43f3-4af1e1a309aa.png)
これで完成です。

## まとめ
ErgoDox EZ CIY featureはCherry MX互換スイッチのプレートマウントであればなんでも使えるので、好きなキースイッチを選べばいいですし、
気にいるものがなければこのように中身を分割してあれこれすることができます。
さぁ、楽しいキースイッチカスタマイズ生活をどうぞ！
UnityでGameObjectをSerializedPropertyへ設定する

# UnityでGameObjectをSerializedPropertyへ設定する

エディタ拡張を書こうとして、SerializeFieldのプロパティを更新する方法を調べたらプリミティブ型のやり方ばかりだったので、オブジェクトでのやり方を書いてみました。
調べながら書いたのでもっとスマートなやり方あったら知りたい。

## 実際のコード

```C#:MyObject.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class MyObject : MonoBehaviour {

	[SerializeField]
	private GameObject go;
}
```

```C#:MyEditor.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEditor;

[CustomEditor (typeof(MyObject))]
public class MyEditor : Editor {
    public override void OnInspectorGUI ()
    {
        this.serializedObject.Update();

        var serializedPropertyGo = this.serializedObject.FindProperty("go");
        var child = GameObject.Find("Child");

        // GameObjectだからか安直にこうすれば良かった
        serializedPropertyGo.objectReferenceValue = child;
        // 参照するときはキャストすると良し
        // var child = serializedPropertyGo.objectReferenceValue as System.Object as GameObject;

        EditorGUILayout.PropertyField(serializedPropertyGo);

        this.serializedObject.ApplyModifiedProperties();
    }
}
```
8946 Take#５


# 問題

http://www.hackerschool.jp/hack/take5.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/6d728a02-4cd0-f4c8-bd0a-7788dda51d34.png)

# 解いてみた

- ソースをみてみる。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/0c8ceeeb-7d13-369b-4f4e-ded55dbf33d1.png)

- ついにきた感ある。
- とくに何も書かれてないのでSQLインジェクション系の頑張るやつや。
- とりあえずIDとパスワードを適当に入れてみる。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/68f5cce8-fd77-6d31-1753-a880b91e2eeb.png)

- 入力した結果、下の方にエラーが表示されていることがわかる。これはPHPか何かのエラーっぽいなということで、いい感じにやるしかない。
- 一番オーソドックスな「' or 1 =1 --」を入れてみる。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/bfb31be3-36be-8b3f-6721-12f386fb6201.png)

- おお、まさかの。
- ということでまだ退会していないのが正解。
	- 112
	- fasd

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/bef3ee7d-6e60-0823-fefe-ba54f6a4563c.png)
VCRで環境変数を扱いたい場合

##はじめに
VCRで環境変数を使いたいときにハマったので残しておきます。
なお、VCRなどの詳しい使い方については省きますのでご了承ください。
それと初投稿なので、記事の書き方も含めご指摘等ありましたらお願いします！!

##環境
・ruby 2.5.1
・Rails 5.2.2
・VCR
・webmock

#事前準備
今回使用するgem。

```ruby:Gemfile
  gem 'vcr'
  gem 'webmock'
```

使いたい環境変数を追加。

```bash:~/.bash_profile
export API_KEY='VALUE'
```

#本題
まずは、VCRで記録するための設定を追加します。

```ruby:spec/spec_helper.rb
VCR.configure do |c|
    c.cassette_library_dir = 'spec/vcr_cassettes'
    c.allow_http_connections_when_no_cassette = true
    c.hook_into :webmock 
    c.filter_sensitive_data('<API_KEY>') { ENV['API_KEY'] } #ここで環境変数を設定します
end
```

この状態で何らかのAPIを叩いてください。


```ruby:spec/sample_spec.rb
VCR.use_cassette("sample") do
    # ここでgetなりpostなりしてください
end
```

すると、下記のようなファイルが作られてると思います。仮にAPIを叩くときにAPIキーを含んだURLになっていた場合、下記のファイルにAPIキーが含まれてしまうため、この状態でgithubにアップロードするのは危険です。（レスポンスだけではなく、リクエスト時のデータも記録されてる）

```yml:spec/vcr_cassettes/sample.yml
---
http_interactions:
- request:
    method: get # or post
    uri: http://XXXXXX=VALUE  #ここにAPIキーが含まれる
...

end

```
そこでAPIキーを直接取得するのではなく、
環境変数経由で取得するように置き換えます。

```yml:spec/vcr_cassettes/sample.yml
---
http_interactions:
- request:
    method: get # or post
    uri: http://XXXXXX=<API_KEY> #APIキーを環境変数経由で取得
...

end

```

これでAPIキーがgithub上に晒されてしまうのを防ぐことができます。

#参考
[https://stackoverflow.com/questions/9042726/testing-a-web-api-using-rspec-and-vcr](https://stackoverflow.com/questions/9042726/testing-a-web-api-using-rspec-and-vcr)
[https://relishapp.com/vcr/vcr/docs/configuration/filter-sensitive-data]
(https://relishapp.com/vcr/vcr/docs/configuration/filter-sensitive-data)
8946 Take#１８


# 問題

http://www.hackerschool.jp/hack/take18.php

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/df57a459-35e6-9de7-eaeb-03138b8e00af.png)

# 解いてみた

- ソースをみましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/945b00b6-a040-3a36-8ca3-c454bdeef790.png)

- 送信ボタンを押したときの動作fnFormSubmit()を検索。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/26562cb6-52c7-ab2b-e452-c8bb8c5e6b5c.png)

- 中略しますが、下はさらに続いてます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/1971cf27-72e4-b165-1d4c-7efc55e7857d.png)

- なんと親切なんでしょう。
- 入力した文字列をさっきの文字変換してそれがangou_valueと一致したら正解らしいです。
- 変換の方法は一瞬ROT13かと思いましたが、そうでもなく自作っぽいので、あきらめて地道に1文字ずつ変換します。
- そうすると答えはzmtlf ezofvでした。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/17681/727743d5-cc28-99ba-002f-a0c69ee1b2c8.png)
Railsで tinyint(1) のカラムにenumを設定すると死ぬ💀

# 結論
カラムにenumを設定したいなら、データ型をtinyint(1)ではいけない。
そもそも2値しか取らないデータにenumを設定すること自体を見直す

# 環境 
Rails5.0からRails5.2.2でのアップグレード作業中に遭遇
※5.1, 5.2のどちらで発生するのかは未検証

# Rails5.0ではこう書いてた

Rails5.0で書いていたのはこんなコード

```ruby
# ユーザテーブル作成
class CreateUser < ActiveRecord::Migration[5.0]
  def change
    create_table :users do |t|
      t.boolean  :display_flg, null: false, default: false
      t.timestamps
    end
  end
end

```

```ruby
# ユーザモデル
class User < ApplicationRecord
  enum display_flg: { display: true, not_display: false }
end
```
ユーザデータに表示/非表示を管理するフラグのカラムを作り、`.dispay`スコープや、 `#display!` / `#not_display?` などのenumが自動生成するメソッドを使いたくてenumを設定していました。

```ruby
[1] pry(main)> User.create
=> <User:
 id: 1234,
 display_flg: "not_display">

[2] pry(main)> user = User.last
=> <User:
 id: 1234,
 display_flg: "not_display">

[3] pry(main)> user.not_display?
=> "not_display"

[4] pry(main)> user.display_flg_before_type_cast
=> 0
```

enumにのvalueにbooleanを使っていても問題なく扱えますね

# Rails5.2にアップグレードしたら

```ruby
[1] pry(main)> User.create
=> <User:
 id: 1234,
 display_flg: nil>

[2] pry(main)> user = User.last
=> <User:
 id: 1234,
 display_flg: nil>

[3] pry(main)> user.not_display?
=> false

[4] pry(main)> user.display_flg_before_type_cast
=> 0

[5] pry(main)> user.display!
DailyRecommendRecruitment Update (0.3ms)  UPDATE `users` SET `display_flg` = 1, `updated_at` = '2018-12-20 20:27:57' WHERE `users`.'id' = 1234
=> true

[6] pry(main)> user = User.last
=> <User:
 id: 1234,
 display_flg: nil>

[7] pry(main)> user.display?
=> false

[8] pry(main)> user.display_flg_before_type_cast
=> 1
```



DBに0で入ったレコードがActiverecordではnilになってしまいました。
かろうじて `_before_type_cast` を通すとDBの値が取れたり、値を更新する`display!`は正しく動いているようですが、`display?`のチェックメソッドは必ずfalseを返してきます。

# 対策
## その1 enumのvalueをbooleanではなくintegerにする
調べる中でこちらの記事にたどり着きました。
https://qiita.com/azyapa/items/1e272dbaef975183efc4

ふむふむ、enumにbooleanは使ってはいけないのか
修正したコードがこちら

```ruby
# ユーザモデル
class User < ApplicationRecord
  enum display_flg: { display: 1, not_display: 0 }
end
```

booleanじゃなくて、DBに値そのまま0/1を設定
これで動くはず

```ruby
[1] pry(main)> User.create
=> <User:
 id: 1234,
 display_flg: nil>

[2] pry(main)> user = User.last
=> <User:
 id: 1234,
 display_flg: nil>

[3] pry(main)> user.not_display?
=> false

[4] pry(main)> user.display_flg_before_type_cast
=> 0
```

なんでやねん！
どうやらモデルクラスでのenum設定をbooleanからintegerに変えただけではダメそうです

## その2 カラムのデータ型を変える

そうはいってもenum設定にintegerを使っていた箇所は多いし、そちらは正常に動いている。
ひょっとしてDBカラムのデータ型が関係している？
データ型をboolean(=tinyint(1))からintegerに変更してみます

```ruby
class ChangeDisplayFlgToUsers < ActiveRecord::Migration[5.2]
  def up
    change_column :users, :display_flg, :integer
  end
end
```

今度はどうでしょうか

```ruby
[1] pry(main)> User.create
=> <User:
 id: 1234,
 display_flg: "not_display">

[2] pry(main)> user = User.last
=> <User:
 id: 1234,
 display_flg: "not_display">

[3] pry(main)> user.not_display?
=> "not_display"

[4] pry(main)> user.display_flg_before_type_cast
=> 0
```

enumが正常に動くようになりました！
どうやらRailsはDBカラムのデータ型をみて挙動を変えているようです。

そもそも取りうる値が2値しかないデータに対してenumを使っても旨味は少ないので、booleanのカラムにはenumを使わないようにしましょう。
bitbucketにpushできない

## 事象
新しく作成したレポジトリにpushすると何故かエラーになる

```
git@bitbucket.org: Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
```
パーミッションが通らない、権限がないと言われてしまう。

## 解決策

色々と格闘した末、下記を打ち込むことで解決した。
（理由はよくわからない…）

※2つのaccountnameには自分のアカウント名、reponameにはレポジトリ名が入る。

```
$ git remote add origin https://accountname@bitbucket.org/accountname/reponame.git
```
```
$ git remote set-url origin https://accountname@bitbucket.org/accountname/reponame.git
```



参考記事（あとで読み込みたい）
https://stackoverflow.com/questions/16074832/cannot-push-to-git-repository-on-bitbucket/28034014
サイゼリヤの間違い探し手法の提案

# 背景

研究で忙しい大学生にとって, 食事の時間でさえ勿体無く感じてしまう. 
自炊する時間など到底ない.
365日外食をする貧乏大学生にとって, お財布に優しいサイゼリヤは非常にお世話になっている.
しかし, お財布に優しいサイゼリヤは, 時間には優しくない.
食事をするだけなら, 時間にも優しいが,   <font color="Red">間違い探し</font>に時間を取られてしまう.
そこで, 本提案システムを使用することにより, 間違い探しにかかる時間を短縮し, 人々の生活を豊かにすることを目的とする.


# 既存の手法

河本の研究[1] ではOpenCVを使い, 左面と右面の違う部分を色の差分から間違いを見つけている.
しかし, この手法は, 誤認識が3つあった上に, 食事待ちの時間に解答することができないことがわかる.

ぱそきいろの研究[2] では Python と OpenCV を用いて左右の画像の差分から間違いを見つけている.
しかし,　こちらも, 正解が6/10であり, 食事待ちの時間に解答することができないことがわかる.

日本一ヒマな大学生の研究[3] では, 重ね合わせを用いて, 間違いを見つけている.
こちらは, スマホアプリを使用し, 食事待ちの時間に解答できるスピード感はあるが, 色の違いが見つけることができないという欠点がある.

以上の3つの手法より, 要件を以下のように設定する.

- 注文してから食事がくるまでの時間に解答できるスピード感.
- 確実に10個の間違いを見つける.

# 提案システム

## 事前準備
まず, 本提案システムを使用するにあたって, 事前にInstagramのアカウントを登録および, アプリケーションのダウンロードが必要である.

## 写真撮影
注文してすぐに間違い探しの2枚を写真撮影をする. 
iPhoneの場合はスクエアで撮影すると良い.
以下の図のように撮影した画像をうまくトリミングする.


<img width="375" alt="IMG_5590 2.JPG" src="https://qiita-image-store.s3.amazonaws.com/0/171482/b88d0fd1-fc7d-0598-9af9-4bbab7360a6c.jpeg">

(デバイスによっては回転しちゃってます. ごめんなさい. )


<img width="375" alt="IMG_5592.JPG" src="https://qiita-image-store.s3.amazonaws.com/0/171482/88603d5b-6946-b2c8-b9d4-6872b1c490d7.jpeg">

(デバイスによっては回転しちゃってます. ごめんなさい. )

## ストーリーズにアップ
先ほどの2枚の写真をストーリーズにアップします.
以下の図のようになります. 


<img width="375" alt="IMG_5595.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/171482/986a6cb6-bb31-a522-d5b5-395d47a3f877.jpeg">

<img width="375" alt="IMG_5596.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/171482/251719a2-3adc-ca05-e968-d21a34f7152f.jpeg">

## 次へと戻るの連打

ストーリーズには次へと戻るの機能があります.
画像の右側を押すと次へに, 画像の左側を押すと戻るになります.


以下のように1枚目の右側をクリックし, 2枚目に移ります.

<img width="360" alt="IMG_5595_PNG.png" src="https://qiita-image-store.s3.amazonaws.com/0/171482/cfeb5c0c-7d2b-772c-dbca-9581d2ad57c9.png">

以下のように2枚目の左側をクリックし, 1枚目に戻ります.

<img width="360" alt="IMG_5596_jpg.png" src="https://qiita-image-store.s3.amazonaws.com/0/171482/e1612d3d-2531-9108-001e-fe88c6e2fa7d.png">

それを繰り返す. 


コードで書くとこんな感じです. 


```C
while(1) {
   if(1枚目) {
      右側を押す;
   } else {
      左側を押す;
   }
}
```

## 見つける
連打しながら間違いを見つけます.


# 実装

実際に実装したら以下の動画のようになります. 
[![Image from Gyazo](https://i.gyazo.com/de05e5fb93862482bff219af2afae49e.gif)](https://gyazo.com/de05e5fb93862482bff219af2afae49e)


# 結論
Instagramという誰もが使っているアプリケーションで, 素早く正確に間違いを探すことができた.
本提案システムを用いることで, 人々の生活が豊かになると言える.

# 謝辞
本研究を通じ、懇切丁寧な御指導、御鞭撻、及び多くの御支援を及び多くの御支援を賜りました, サイゼリヤ 文京区役所前店に深く感謝致します. また常に多くの御助言並びに御助力を頂きました, Team サイゼリヤ先輩方, よき同僚として御協力いただいた同輩諸氏に御礼申し上げます.


# 参考文献
[1] http://kawalabo.blogspot.com/2014/11/blog-post.html

[2] https://qiita.com/takacpu55/items/88e2e2fceb4e9fa22c91

[3] https://www.pororoca-egg.com/entry/saizeriya_matigaisagashi
Photon PUN2のOnPhotonSerializeView()で送受信できる型一覧

# はじめに

リファレンスに書いてある内容です。
[Serialization in Photon | Photon Engine](https://doc.photonengine.com/en-us/pun/v2/reference/serialization-in-photon)

# Photonがサポートしている型

- byte
- bool
- short
- int
- long
- float
- double
- String
- Object[]
- byte[]
- array
- Hashtable
- Dictionary

# PUNがサポートしている追加の型

- Vector2
- Vector3
- Quaternion
- PhotonPlayer

# それ以外の型を使いたい場合

`SerializeMethod`と`DeserializeMethod`を定義して`RegisterType`をすれば、どの型でも扱えるようになる。

参考: [【Unity】僕もPhotonを使いたい #09 RPC() シリアライズ編 - うら干物書き](https://www.urablog.xyz/entry/2016/09/21/223002)
Ada言語 9日目 FizzBuzz

#はじめに
if文とfor文が使えるようになったのでFizzBuzzができるようになりました。
やるしかありませんね。

#ソースと結果
```main.adb

with Ada.Text_IO;
with Ada.Integer_Text_IO;
use Ada.Text_IO;
use Ada.Integer_Text_IO;

procedure main is

    counter : Integer := 0;

begin

    for counter in 1 .. 32 loop

        Ada.Integer_Text_IO.Put(counter, 1);
        Ada.Text_IO.New_Line;

        if counter mod 3 = 0 then
            Ada.Text_IO.Put_Line("Fizz");
        end if;

        if counter mod 5 = 0 then
            Ada.Text_IO.Put_Line("Buzz");
        end if;

    end loop;

end main;

```

`実行結果 : ` FizzBuzzは成功しました。

#最後に
Fizz!Buzz!

#日記一覧へ
[Ada言語を習得する日記一覧](https://qiita.com/C_Assembly/items/50a0f9d8542679d92ea8)
VBAメモ 整数部「10の位」「100の位」で設定された丸め位置

StrReverse
文字列の並びを逆さにする。

丸めの桁位置を指定するのに応用。

Round(値,★桁数)

1の位　→　-1
10の位　→ -2
100の位　→　-3

設定値 = "100"
桁数 = Instr(StrReverse(strVal),"1",1,vbBinaryCompare)*-1
※ベタ打ちだから、ミスってるかも。


１）StrReserveで「100」が「001」
２）Instrで「001」の「1」の文字位置を取得
（この場合、「3」が戻り値）
３）整数部なので「-1」を掛ける
[問題] Ruby で (n.to_s < m.to_s) && (n + m == n / m) が真となるのは？

暇つぶし問題です。

Ruby で `(n.to_s < m.to_s) && (n + m == n / m)` が真となるのはどんなときか。

ただし，`n` と `m` はローカル変数であり，Ruby の標準添付ライブラリーのクラス（もしくは組込みクラス）のインスタンスが代入されていて，メソッドの再定義はされていないとする。

<details><summary>答えはここをめくってね</summary>
答えの例：`n, m = Pathname("a"), Pathname("b")` のとき。
</details>
printf のマイナーな機能の紹介

C言語アドベントカレンダー の 12/20 が空いていたので、ちょっと書いてみた。

`printf` の書式文字列について、私が知らなかったことをメモする。

動作確認は、macOS Mojave 上の clang と gcc-8 で行った。

# 桁区切り文字を出力するフラグ文字

具体的にはこんな感じ：

```c:c11
#include <stdio.h>
#include <locale.h>

int main(void)
{
  setlocale(LC_ALL, "sk_SK.ISO8859-2" ); // Slovak - SLOVAKIA
  printf("%'d\n", 12345678); //=> 12 345 678
  printf("%'f\n", 12345678.12345678); //=> 12 345 678,123457
  return 0;
}
```

ロケールによって出たり出なかったりする桁区切り文字。
スロバキアでは空白区切りらしい。

桁区切り文字とは関係ないけど、小数点がコンマになっているところにも注目。

なお。

デフォルトロケールだとシングルクオートなしと同じ結果になるので面白くない。

# intmax_t 用の長さ修飾子

C99 には `intmax_t`, `uintmax_t` という、`long long` よりも長いかもしれない整数型がある。
というわけで、それ用の長さ修飾子がある。
こんな感じ。

```c:c11
#include <stdio.h>
#include <stdint.h>

int main(void)
{
  uintmax_t u = UINTMAX_MAX;
  intmax_t i = INTMAX_MAX;

  printf("%ju\n", u ); // => 18446744073709551615
  printf("%jd\n", i ); // => 9223372036854775807
  return 0;
}
```

でも、手元の処理系では `intmax_t`, `uintmax_t` ともに 64bit なのであんまり面白くない。

# char であることを示す長さ修飾子

char はどうせ int に昇格するので、コンパイラに警告を出させる以外にはあまり意味がない。

こんな感じ。

```c:c11
#include <stdio.h>

int main(void)
{
  signed char sc = -128;
  unsigned char uc = 255;
  printf( "%hhd %d %hhu %u\n", sc, sc, uc, uc ); //=>-128 -128 255 255
  printf( "%hhd %d %hhu %u\n", -400, -400, 400, 400 ); //=> 112 -400 144 400
  return 0;
}
```

clang の場合、あとの方の printf は

```text
warning: format specifies type 'char' but the argument has type 'int' [-Wformat]
warning: format specifies type 'unsigned char' but the argument has type 'int' [-Wformat]
```

という警告が出る。
gcc-8 は警告出してくれない。

※ ここから、2022年1月加筆

……と書いておいたら、[ありがたいコメント](https://qiita.com/Nabetani/items/b18032a13359df22b50d#comment-5115dbc5f3b7995cc4a6) が。

なるほど。

私としては負の値を 16 進数で出すことは稀なので気づきませんでした。

と思った上で man を見てみると

```c:c11
printf( "foo %hhn", &x );
```

とすると、`&x` を char* だと思ってくれるという機能もあるらしい。不要。

※ ここまで、2022年1月加筆


# ptrdiff_t 用の長さ修飾子

`size_t` 用の `z` は知っていたけど、`ptrdiff_t` 用の `t` は知らなかった。

```c:c11
#include <stdio.h>

int a[1ULL<<44]; // 意外と行ける

int main(void)
{
  printf( "%td\n", a+sizeof(a)/sizeof(*a) - a ); // => 17592186044416
  return 0;
}
```

# 16進数の浮動小数点変換指定子

誤差なく浮動小数点を出力したい場合に必要になる、16進数浮動小数点。

```c:c11
#include <stdio.h>

int main(void)
{
  printf( "%a %f\n", 0.1, 0.1 ); //=> 0x1.999999999999ap-4 0.100000
  return 0;
}
```

とはいえ、出てきた値を読むのが面倒なのであまり使いみちがない。

# 脆弱性の原因となる `%n`

昔からあるらしいけど、知らなかった。
C11 から入る `printf_s` には含まれないらしい。

```c:c11
#include <stdio.h>

int main(void)
{
  int n0, n1, n2;
  printf( "foo %n bar %n baz\n%n", &n0, &n1, &n2 ); //=> foo  bar  baz
  printf( "%d %d %d\n", n0, n1, n2 ); //=> 4 9 14
  return 0;
}
```

引数に `int` へのポインタを置いておくと、`%n` までに出力した文字の数が入るらしい。
恐ろしい。
余計なことすんな、という感じ。

IPA にも [フォーマット文字列攻撃対策]( https://www.ipa.go.jp/security/awareness/vendor/programmingv2/contents/c906.html ) という記事が上がっている。こわいこわい。

# というわけで

というわけで、`printf` のマイナーな機能の紹介はこれでおしまい。

いずれも C11/C99 準拠だと思う。

あとそういえば。
関数へのポインタを `(void*)` に安全にキャストすることはできないことになっているけど、関数へのポインタ用の 変換指定子 ってないんだね。必要だと思うんだけどなぁ。
Ubuntu 18.0上、OpenCV 4.0 から Gstreamer 1.14 を使う

OpenCVは、最近 4.0に上がって、インストールフォルダーなど変えた【[参照](https://qiita.com/dandelion1124/items/eae435e601fba2adb0d1)】。

一方、元々、OpenCV の Binary　Packageは、GStreamerサポートをしていない。そのため、OpenCV で Gstreamer を使おうとしたら、Binary Package のインストールでなく、OpenCV のソースコードからのコンパイル・ビルドが必要。

~~[ BUG FIXが入ったらしい-> ] ところが、普通に、Gstreamer を OpenCV で有効にするための前提Package を入れた後で、Open CV　の cmake, make, make installしても【[参考１](https://docs.opencv.org/3.4/d2/de6/tutorial_py_setup_in_ubuntu.html)】、【[参考２](http://answers.opencv.org/question/95734/cmake-not-picking-gstreamer-on-ubuntu/)】、Python から使えない。おそらく、OpenCV が 改定された際、まだ、そのPython Binding のセットアップが追いついていないようです。~~

以下、うまくいったscriptを載せます。【[ここ](https://www.learnopencv.com/install-opencv-4-on-ubuntu-18-04/)】を参考にして、Pythonの仮想環境なしでのインストールにしています。（Python の仮想環境へのインストールもうまくいきます。大体、仮想マシンのスナップショット機能やDockerがあるので、Pythonまで仮想環境にする意味が分からないのですが、Python の仮想環境だと、指定のフォルダーに Binary を格納するので、OpenCV のインストールフォルダが変わるなどの変動要因に強いみたいです）。
~~Pythonの仮想環境なしのシステムインタープリタに効かせるには、【[ここ](https://www.pytorials.com/how-to-install-opencv340-on-ubuntu1604/)】のような so の設定が必要のようです。~~

Ubuntu 18.10 を使い、GStreamer 1.14.4 が入っている環境で、OpenCV 4.0 をビルドします。

~~soのコピー（ないしSymbolic Link）しないと、Python が Gstreamer 1.14 をサポートした OpenCV Build を見つけてくれない。~~

```
sudo apt -y update
sudo apt -y upgrade

sudo apt -y remove x264 libx264-dev
## Install dependencies
sudo apt -y install build-essential checkinstall cmake pkg-config yasm
sudo apt -y install git gfortran
sudo apt -y install libjpeg8-dev libpng-dev
sudo apt -y install software-properties-common
sudo add-apt-repository "deb http://security.ubuntu.com/ubuntu xenial-security main"
sudo apt -y update
sudo apt -y install libjasper1
sudo apt -y install libtiff-dev
sudo apt -y install libavcodec-dev libavformat-dev libswscale-dev libdc1394-22-dev
sudo apt -y install libxine2-dev libv4l-dev
cd /usr/include/linux
sudo ln -s -f ../libv4l1-videodev.h videodev.h
cd ~
sudo apt -y install libgstreamer1.0-dev libgstreamer-plugins-base1.0-dev
sudo apt -y install libgtk2.0-dev libtbb-dev qt5-default
sudo apt -y install libatlas-base-dev
sudo apt -y install libfaac-dev libmp3lame-dev libtheora-dev
sudo apt -y install libvorbis-dev libxvidcore-dev
sudo apt -y install libopencore-amrnb-dev libopencore-amrwb-dev
sudo apt -y install libavresample-dev
sudo apt -y install x264 v4l-utils
sudo apt -y install python3-dev python3-pip
sudo pip3 install wheel numpy scipy matplotlib scikit-image scikit-learn ipython dlib

git clone https://github.com/opencv/opencv.git
git clone https://github.com/opencv/opencv_contrib.git

cd opencv
mkdir build
cd build

cmake -D CMAKE_BUILD_TYPE=RELEASE \
        -D CMAKE_INSTALL_PREFIX=/usr/local -D WITH_GSTREAMER=ON \
        -D WITH_FFMPEG=ON -D WITH_TBB=ON -D WITH_V4L=ON -D WITH_QT=ON -D WITH_OPENGL=ON \
        -D OPENCV_EXTRA_MODULES_PATH=../../opencv_contrib/modules ..
make -j4
sudo make install

sudo ldconfig

# sudo cp /usr/local/python/cv2/python-3.6/cv2.cpython-36m-x86_64-linux-gnu.so /usr/local/lib/python3.6/dist-packages/cv2.so
```
IT系イベント実施の会場設営チェックリストを作った

ごきげんよう

この記事は
**「するめごはんのVUI・スマートスピーカー Advent Calendar 2018」**
の19日目の記事です。

風邪ひいて遅れました。。。

さて、もともとアドベントカレンダーである程度の人が見てくれるようになってきたら投稿したいと思っていた記事を今回は投稿します。


直接的にはVUIも技術も関係ないですが、**技術イベントを開催する際に会場設営で必要なチェックリスト** をまとめました。

今年、様々なVUI・スマートスピーカー系のイベントの運営スタッフや主催をやらせてもらいまして、そこで会場設営時のノウハウがたまってきたのでまとめました次第です。

VUI系なので音を気にすることも多いですが、他のイベントでも応用できるリストであると考えておりますので、ガンガン共有します。

Qiitaにいらっしゃる方々は各種イベントに参加なさる方も多いと思いますので何かしらの参考になりましたら幸いです。

技術系イベントを開催時の
**AWS Well-Architected Framework　みたいな感じのチェックリスト** として、よしなに参考にしてください。


https://github.com/surumegohan/event_know-how


様々なIT系のイベントでは運営している人たちは上記のようなことを気を配って実施しています。
なので慢性的にスタッフが足りてないと思いますので、この記事を読んだ方が、イベント実施者に「こんなリストがあるよ」とか「ここらへんは手伝える」とか、そういう流れになってくれると嬉しいです。


また、他にも自分はこんなことを気を付けてるぜ！とか、こんなことがあったぜ！とかありましたら、コメントをくれるかプルをリクってください。


以上
React Native Expo Snack にてFirebaseを使ったときのハマり　Device: (865:668) undefined is not an object (evaluating 't.stack.replace')

Device: (865:668) undefined is not an object (evaluating 't.stack.replace')

Expo Snack 特有のエラーでした。

```index.js
handleSubmit = () => {
  firebase
    .auth()
    .createUserWithEmailAndPassword(this.state.email, this.state.password)
    .then(user => {})
    .catch(error => {
     - console.log(error);
     + console.log(error.code);
     + console.log(error.message);
    });
};
```
webpack-dev-serverでCORS回避する

## とある社内ツールのSPA移行チャレンジをしていたときの話

ローカル環境下でAPIサーバーとwebpack-dev-serverを動かしつつ開発すると、portの違いでCORSリクエストに対応しなくてはなりません。


今回本番でCORS使うことは考えていなったので、開発環境だけ対応するのもめんどくさいです。
逆に商用のシステムなんかでCDN経由で配布してCORS前提なら開発環境も合わせたほうがいいと思います。
実際の回避方法ですが、APIサーバー側から静的ファイルを返すようにすれば回避できます。しかし、オートリフレッシュなどの便利機能が`webpack-dev-server`には入っているのでこっちを利用したいところです。
そこで、回避手段を探していたところ`webpack-dev-server`にproxy機能があったのでこれでなんとかします。  

`webpack.config.js`にこんなふうに書きます

```javascript
devServer: {
    contentBase: path.join(__dirname, 'dist'),
    port: 3000,
    proxy: {
        '/api': {
            target: 'http://localhost:5000', // local api server
            pathRewrite: {'^/api' : ''} // rewrite
        }
    }
},
```

これで`webpack-dev-server`の`/api`以下へのリクエストをapiサーバ(localhost:5000)へプロキシしてくれます。
パスもリライトしてくれるので、APIサーバー側は変更しなくていいです。

![cors.png](https://qiita-image-store.s3.amazonaws.com/0/9407/d73e0ff2-4e6e-b40a-520a-3a48c7119f17.png)
これが
![no_cors.png](https://qiita-image-store.s3.amazonaws.com/0/9407/c720b18f-2ac0-87b8-6aa8-ca7b2e059cc8.png)
こうなります。

### 便利!!
ボールがビリヤードのように跳ね回るアニメーションライブラリ

![a.png](https://qiita-image-store.s3.amazonaws.com/0/248832/6827c7c1-932d-d43f-6603-3a4c6ec96368.png)
Web ページ上で「ボールがビリヤードのように跳ね回るアニメーション」を簡単に実装できる JavaScript ライブラリを作りました。
_作ったものの、どこにも紹介せずに放置していたのでちょっと記憶がアレですが…。_

* [デモ](https://mimonelu.github.io/billiards-js/)
* [GitHub](https://github.com/mimonelu/billiards-js)

## 概要

単純な Canvas アニメーションです。
ライブラリを読み込んだら `new` して終わり。 API は停止／再開くらいです。

## 使用例

詳しくは GitHub かデモの HTML を覗いてみてください。

* デフォルト  
自動生成された canvas 要素が `document.body` に追加されます。

```
<script src="./billiards.min.js"></script>
<script>
new Billiards({});
</script>
```

* 既存の canvas 要素を指定する

```
<canvas class="canvas"></canvas>
<script>
new Billiards({
  'canvas': document.querySelector('.canvas')
});
</script>
```

* 親要素を指定して canvas 要素を自動生成する

```
<div class="canvas-container"></div>
<script>
new Billiards({
  'parent': document.querySelector('.canvas-container')
});
</script>
```

* Canvas のサイズと背景色を指定する

```
new Billiards({
  'width': '640',
  'height': '480',
  'fillStyle': 'rgba(0, 0, 0, 0.25)'
});
```

* Canvas を自動的にウィンドウサイズに合わせる

```
new Billiards({
  'fitToWindow': true
});
```

自動的に親要素のサイズに合わせる `fitToParentW` と `fitToParentH` もあります。

* スプライトの詳細設定  
詳しくは [こちら](https://github.com/mimonelu/billiards-js#option-description)。 RGBA 値・半径・速度は `[ 最小値, 最大値 ]` の範囲でランダムに決定されます。  
なお、半径 `r` はピクセル指定ではなく、 Canvas のサイズに対する割合を指定します。

```
new Billiards({
  'number': 8,
  'r': [ 0.1, 0.2 ],
  'color': {
    'r': [ 192, 255 ],
    'g': [ 128, 255 ],
    'b': [ 0, 255 ],
    'a': [ 1.0, 1.0 ]
  },
  'composite': 'lighter',
  'velocity': [ 1.0, 2.0 ]
});
```

* 跳ね返らせない

```
new Billiards({
  'rebound': false
});
```

* 衝突させない（すり抜ける）

```
new Billiards({
  'collide': false
});
```

* アニメーションループの手動設定  
既存の `requestAnimationFrame` に組み込みたい時に。

```
const billiards = new Billiards({
  'autoPlay': false
});
const update = () => {
  requestAnimationFrame(() => {
    billiards.update();
    update();
  });
};
```

* 手動レンダリング  
画像を描画したい時に。 `billiards` がインスタンス、 `billiards._` が設定、 `sprite` が現在のスプライトです。

```
new Billiards({
  'render': (billiards, sprite) => {
    billiards.context.fillStyle = sprite.color;
    billiards._.composite && (billiards.context.globalCompositeOperation = billiards._.composite);
    billiards.context.beginPath();
    billiards.context.arc(sprite.x, sprite.y, sprite.r, 0, Math.PI * 2);
    billiards.context.closePath();
    billiards.context.fill();
  }
});
```

## ところで

なんで私ドキュメントとかエセ英語で書いたんでしょうね。
関数の概念について

#はじめに

ラムダ式を勉強するにあたって関数だのStreamだの色々な用語が出てきてよくわからずに

若干パニックを起こしたので一旦整理するために記事を投稿しました。（自分を戒める意味を持つ（笑））

この記事では概念を書いていきます。ソースコードについては別記事にまとめます。

#関数（function）の概念について

#そもそも関数とは？

色々調べた結果、自分の中でこういう結果を導きました。

***「何らかの入力（Input）を受け取り、処理（Process）をおこない、何らかの出力（Output）を返すこと。」***

入力（Input）、処理（Process）、出力（Output）を持つものはざっくり言えば関数となる。

ではプログラミングの世界の関数とはどのようなものか？

Javaにおける関数とは。。。
>何らかの情報を引数として受け取り（Input）、何らかの処理を行い（Process）、
>何らかの結果を戻り値として返す（Output）、ひとかたまりの処理のロジック
※引数がないものや戻り値を返さないものも広義の意味では関数と呼びます。

_これってメソッドを指すのでは？_

最初そう思いましたが、厳密にいうと違うようです。

##メソッドと関数の違いは？

関数とメソッドはどう違うのかまとめてみました。

①　メソッドはクラスに属する一種の関数

関数には**「I（入力）・P（処理）・O（出力）構造を伴う処理ロジック」**程度の意味合いしかないようです。

一方でメソッドはもともとオブジェクト指向のための用語として登場したものです。

メソッドとは。。。

***「外部からの呼び出しに応えるためにクラスのメンバとして記述された、I（入力）・P（処理）・O（入力）構造を伴う処理ロジック」***

メソッドと関数は横並びの関係ではなく、**「メソッドは関数の一種である。」**といったis-aの関係になります。

②　関数にとって名前は重要ではなく、必須ではない。
    
メソッドは必ず名前を持ち、呼び出す際には名前を記述しますが、関数では名前はさほど重要でないようです。

関数にとって重要なことはつまり。。。

***「何を入力として受け取り（Input）、どんな処理をし（Process）、どんな出力をするか（Output）」***

実際に名前を持たない関数も存在するようで。。。（無知で申し訳ありません。）

##まとめ

・関数は「何らかの入力（Input）を受け取り、処理（Process）をして出力（Output）を返す」こと。

・関数とJavaにおけるメソッドは似た存在である。（メソッド　is a　関数（メソッドは関数の一種である））

#さいごに

調べていると関数型プログラミングは「コード自体が簡潔に収まる」や「コードの可読性が上がる」など

メリットがたくさんあることがわかりました。そんなにメリットあるならその技術、キャッチアップしたいと思いました。

しっかり勉強して自分の頭の中の引き出しとしてラムダ式を入れておきたいです！

---
**追記：これからまとめていく中で間違えていることがあったり、追記すべき点がございましたらコメントをよろしくお願いいたします。**
エラトステネスの篩

素数を求めるアルゴリズム「[エラトステネスの篩](https://ja.wikipedia.org/wiki/%E3%82%A8%E3%83%A9%E3%83%88%E3%82%B9%E3%83%86%E3%83%8D%E3%82%B9%E3%81%AE%E7%AF%A9)」をJavaScriptで書いてみたので投稿してみる。

```javascript
function GetPrimeNumbers (m) {
	//配列をつくって 0 と 1 にはあらかじめ null としておく。
	var t = (new Array(m)).fill(0).map((v, i) => i);
	t[0] = null;
	t[1] = null;

	//エラトステネスの篩 で素数の添字に null セット
	for (var i = 2; (i * i) < m; i++) {
		var p = i << 1;
		while (p < m) {
			t[p] = null;
			p += i;
		}
	}

	//nullを配列から除去して返す
	return t.filter(v => v);
}

//100までの素数を出力
console.log( GetPrimeNumbers (100) );
// [2, 3, 5, 7, 11, 13, 17, 19, 23, 29, 31, 37, 41, 43, 47, 53, 59, 61, 67, 71, 73, 79, 83, 89, 97]
```

以上！
[自分用メモ]最近のObjectDetectionに関するメモ




######YOLOv3
・Object detection: speed and accuracy comparison (Faster R-CNN, R-FCN, SSD, FPN, RetinaNet and YOLOv3)
https://medium.com/@jonathan_hui/object-detection-speed-and-accuracy-comparison-faster-r-cnn-r-fcn-ssd-and-yolo-5425656ae359



・Implementing YOLO v3 in Tensorflow (TF-Slim)
https://itnext.io/implementing-yolo-v3-in-tensorflow-tf-slim-c3c55ff59dbe

・.h5ファイルから.tfliteファイルへのコンバート方法
https://github.com/benjamintanweihao/YOLOv3