https://github.com/yamachu/kancolleviewertemplate
Electronで艦これの専ブラを作りたくなった時のテンプレートプロジェクト
https://github.com/yamachu/kancolleviewertemplate
Last synced: about 1 year ago
JSON representation
Electronで艦これの専ブラを作りたくなった時のテンプレートプロジェクト
- Host: GitHub
- URL: https://github.com/yamachu/kancolleviewertemplate
- Owner: yamachu
- Created: 2018-08-17T16:17:39.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-08-18T06:02:29.000Z (almost 8 years ago)
- Last Synced: 2025-03-13T12:32:33.650Z (over 1 year ago)
- Language: JavaScript
- Size: 6.84 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# KanColleViewerTemplate
Electronで艦これの専ブラを作りたくなった時のテンプレートプロジェクト
## 使い方
### セットアップ
```shell
$ npm install
# or
$ yarn install
```
### 起動
```shell
$ npm run start
# or
$ yarn run start
```
### レスポンスの受け取り方
`window.game.jsonResponse` が _RxJS_ の _Subject_ になっているので、いい感じにsubscribeする。
流れてくるObjectは
```json
{
URL: string,
Body: string
}
```
の形式になっている。
APIによってはBodyがundefinedの場合もあるため、`response.Body.slice(7)` みたいな形で受け取ろうとするとundefinedを踏んでしまい問題が生じる。
適宜Bodyがundefinedか値があるかの確認を行うこと。
適当に試したい場合はDeveloper Toolsを開いて
```js
window.game.jsonResponse.subscribe((v) => {
if (v.Body !=== undefined) {
// 文字列だけだとわからんな
// console.log(`URL: ${v.URL}, Body: ${v.Body.slice(7)}`);
console.log(`URL: ${v.URL}`);
console.log(JSON.parse(v.Body.slice(7)));
}
});
```
とかを叩いてみるといいかもしれない。
## ちょっとした説明
本アプリケーションではChrome Debugging Protocolを使用して、Networkの監視を行っている。
コードとしては[こんな感じ](https://github.com/yamachu/KanColleViewerTemplate/blob/master/src/js/requestHandler.js#L18)でいい感じに受け取ることが出来る。
Chrome Debugging Protocolのドキュメントについては各自参照されたし。
そこで得られたイベントをレンダラプロセスのWindowオブジェクトに定義したSubjectに流し込んでいる。
そのためレンダラプロセスでそのイベントに応じていい感じのUIが作れる __かも__ しれない。