LoginSignup
1
0

More than 5 years have passed since last update.

DBのデータをコピーするためにasync clipboard APIを試す

Last updated at Posted at 2019-03-23

The Clipboard API crashcourse - Frontend News #2
https://frontendnews.io/editions/2018-08-01-copy-and-paste-clipboard-api

フォーカスがタブにないとうまくいかないのでdevtoolsでは遅延させてフォーカスを切り替える必要がある。

Async Clipboard APIでJavaScriptからクリップボードを操作する
https://sbfl.net/blog/2018/03/03/async-clipboard-api/

使い方の具体例

IndexedDBの使い方 - Qiita
https://qiita.com/butakoma/items/2c1c956b63fcf956a137

いまはlevelDBというやつなのね

ChromeのIndexedDBの場所 (Mac・Windows) | EasyRamble
https://easyramble.com/path-to-chrome-indexeddb.html

ファイルの場所、でもchromeのは仕様が違うので通常のcliとかではそのままでは扱えない的なコメントをどこかでみた

Promises + IndexedDB Test
https://gist.github.com/robertknight/462d16b46a438ab67e29301861f5d55f

非同期処理をどうするかがよくわからなくて悩んだ。
プロミスの理解をしてこの変換ができるような頭になっておくと便利なのかもだけどよくわからぬ。

hoge.js
openReq = await indexedDB.open("something");
openReq.onsuccess = async function (event) {
    //onupgradeneededの後に実行。更新がない場合はこれだけ実行
    console.log('db open success');
    //main
    // フォーカスをコンソールではなくタブにする必要がある
    const sleep = msec => new Promise(resolve => setTimeout(resolve, msec));
    console.log('スタート 3秒まつ');
    await sleep(3000);
    console.log('3秒経ってる!')
    function promiseReq(req) {
        return new Promise((resolve, reject) => {
            req.onsuccess = () => resolve(req.result);
            req.onerror = () => reject(req.error);
        });
    }
    let db = event.target.result;
    let objectStore = db.transaction('siteCache', 'readonly').objectStore('siteCache');
    let data = await promiseReq(objectStore.get('hoge'));
    console.log(data);
    await navigator.clipboard.writeText(JSON.stringify(data));
    console.log(JSON.stringify(data));
    // 接続を解除する
    db.close();
};
openReq.onupgradeneeded = function (event) {
    //onupgradeneededは、DBのバージョン更新(DBの新規作成も含む)時のみ実行
    console.log('db upgrade');
};
openReq.onerror = function (event) {
    // 接続に失敗
    console.log('db open error');
};
1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0