GitHub APIのusersに成功した。
ブツ
インストール&実行
NAME='Electron.net.request.ok.20220814143228'
git clone https://github.com/ytyaru/$NAME
cd $NAME
npm install
npm start
db/setting.json
にusers
スコープ権限をもったアクセストークンをtoken
プロパティの値としてセットする- 再起動する
- 端末に以下標準出力が出る(リクエスト成功)
STATUS: 200
HEADERS: ...
BODY: {
"login": "ytyaru",
"id": 19922005,
...
}
ちなみに前回はブラウザの開発ツールのコンソールで以下のようなエラーが出たが、今回は成功した。
Uncaught (in promise) Error: An object could not be cloned.
プロジェクト作成
独自にプロジェクトを作成したいとき。
NAME=electron-github-api
mkdir $NAME
cd $NAME
npm init -y
npm i electron -D
コード抜粋
main.js
const { app, BrowserWindow, ipcMain, dialog, net } = require('electron')
ipcMain.handle('request', async(event, params, onData=null, onEnd=null)=>{
console.log('----- request -----')
console.log(params)
const request = net.request(params.params)
if (params.hasOwnProperty('body')) { request.write(params.body) }
console.log(request)
request.on('response', (response) => {
console.debug(`STATUS: ${response.statusCode}`)
console.debug(`HEADERS: ${JSON.stringify(response.headers)}`)
response.on('data', (chunk) => {
console.debug(`BODY: ${chunk}`)
if (onData) {
onData(JSON.parse(chunk), response)
}
})
response.on('end', () => {
console.debug('No more data in response.')
if (onEnd) {
onEnd(response)
}
})
})
// リクエストの送信
request.end()
})
ElectronのAPI net.request を使ってWebAPIを実行する。
preload.js
const {remote,contextBridge,ipcRenderer} = require('electron');
contextBridge.exposeInMainWorld('myApi', {
request:async(params)=>await ipcRenderer.invoke('request', params, onData=null, onEnd=null),
})
IPC通信でElectronとブラウザの文脈を仲介する。
renderer.js
window.addEventListener('DOMContentLoaded', async(event) => {
console.log('DOMContentLoaded!!');
const setting = await Setting.load()
if (setting?.github?.token) {
document.getElementById('github-token').value = setting.github.token
await window.myApi.request({
params: {
method: 'GET',
url: 'https://api.github.com/user',
headers: {
'Authorization': `token ${setting.github.token}`,
},
},
},(json, res)=>{
console.debug(res)
console.debug(json)
},(res)=>{
console.debug(res)
})
}
})
色々試した結果、オブジェクトにコールバック関数を含めなければ成功するっぽい。
オブジェクトにコールバック関数があると、前回のように以下エラーが出る。
Uncaught (in promise) Error: An object could not be cloned.
よくわからないが、とにかくそうなる。たぶんIPC通信かElectronの文脈かのどちらかにおいて、オブジェクトの中に関数を入れることはできないのだろう。
なんだかElectronを触るたびに制約が出てきてHTML,CSS,JSで作成できるというお題目が形骸化してゆく感じがする。モヤモヤする。騙された気分。
とりあえず動作したから一旦これで良しとする。
あとはこれでリモートリポジトリを作成するGitHub APIを叩いてみたい。それができたらHTML化したつぶやきページをアップロードできるのではないかと期待している。