どういうわけか、パスワードのリストを管理パネルに追加する必要がありました。データベースはKeePass形式（kdbx v2）でサーバーに保存され、サーバーはノードにありました-考え直さずに、最初に受け取ったパケットを受け取って実行しました。そして、同じことをしましたが、サーバーなしでユーザーのブラウザで実行しました。何も見つかりませんでした。最初の欲求はlibをフォークし、ノードAPIの使用を置き換えることでしたが、その欲求は最初のコードレビューから消えていたので、自分でやることに決めました。

猫の下で、私が遭遇した問題とその解決方法についてお話します

ブラウザでkdbx形式を読み取る

残念ながら、ソースコードとこの短い記事を除いて、kdbx形式については説明しませんでした。しかし、それは非常に簡単です。 kdbxを読むには、次のことが必要です。

バイナリヘッダーを読み取ります（その内容は？）
暗号化アルゴリズムとランダム値ジェネレーターを初期化します（salsa-20）
パスワードとキーハッシュを計算し、資格情報ハッシュを取得する
マスターキーを受け取って、ハッシュをN回暗号化します（ヘッダーからの値）-これは最も計算時間のかかる操作です
データを解読する
データブロックとヘッダーのブロックを比較して、復号化を検証します
GZIPアップロードデータ
xmlを解析
保護フィールドのソルトを生成
オンデマンドで、必要なときに、保護フィールドを拡張できるようになりました
xmlメタデータを読み取ります（内容は何ですか？）
グループとメモを読む

アルゴリズムのうち、対称暗号化用のAESとハッシュ用のSHA256が使用されます。私が見つけたウェブの最速の実装はasmCryptoで、asm.jsで書かれており、他のブラウザの代替よりも高速に動作します。すべての主要な変換サイクルが追加のデータコピーなしでasm.js内で行われるようにパッチを適用したので、ネイティブ実装の速度の4..7倍の速度を達成することができました（KeePassに1秒の遅延を入れると、secondsファイルが開きます6）。デフォルト設定では、ファイルの平均オープン時間は約200ミリ秒です。 WebAssemblyは私たち全員を救いますが、今のところ、このように。

UPD：彼らがWebCryptoを提案したコメントでは、サポート付きのブラウザでのオープン時間はKeePassとほとんど同じです。

gzipを使用するために、私はpakoを使いました。それは小さく、高速で、MITです。暗号化と比較して、大幅な解凍コストに気付きませんでした。

結果はkdbxwebで、node.jsおよび最新のブラウザーで動作します。バイナリ形式で作業する必要があるため、サポートされているブラウザのリストに古いバージョンはありません。ライブラリ+依存関係は150 KBでした。

アプリ

だから、あります。彼女のために今すぐWebインターフェースを書いてみませんか？ Webに適したパスワードマネージャーは次のとおりです。

単一のファイルにして、ドロップボックス、ホスティング、またはディスクに自分自身を置くことができます
サーバーをまったく必要としない、どこにも転送しない、ブラウザで作業する
1MB未満を占有します（条件付き。順序は本当に重要です）
ファイルからオフラインで作業できる
速くロードする
すべてのブラウザで動作します
パスワードを平文で保存しないでください
Dropboxの混乱
既存の形式を使用し、車輪を再発明しないでください
形式のすべての機能を何らかの形でサポートする
複数のファイル/データベースを同時に操作する
元のアプリケーションとの後方互換性がある
オープンソートである

これのほとんどは達成されました。

アプリケーションはバックボーン+ zeptoで作成されました（最初はAngular2を試してみたかったのですが、どういうわけか機能しませんでした。フレームワーク自体の生成コードはまだ1MBを超えています。

この形式のリーダーをサポートするブラウザーのバージョンは後者からそれほど遠くないため、実際にはクロスブラウザーの松葉杖はありません。

入力タイプ=パスワード

入力にテキストを入力すると、入力履歴を含めて、入力されたすべての値がブラウザのメモリに無期限に保存されます。また、デスクトップアプリケーションでメモリをクリーンアップできる場合、ブラウザでは、文字列が占有するメモリを制御できません。GCが必要とする場合、GCはクリーンアップしますが、メモリは無効化される場合とされない場合があります。

一部のアプリケーションは、ファイルを閉じた後でもメモリを消去できないと考えていますが、アプリケーションの場合、これはもちろんWebほど重要ではありません。

アプリケーションが他の場所に行かなければ、ブラウザのそのような入力にマスターパスワードを入力しないので、機能しません。したがって、自転車を作成する必要がありました。文字を入力すると、XOR文字がランダムなシーケンスで表示され、出力が文字を取得します未使用のユニコードブロック。入力はそれらを示し、この値（とにかくアスタリスクがある）を考えて、値自体はバッファに記号的に格納されます。もちろん、キーに値を追加して、メモリに完全にアクセスできますが、これは異なるレベルの複雑さです。

ファイルを保存する

ブラウザで生成されたファイルを保存するのはそれほど簡単ではありませんが、以下が必要です。

FileSaver.jsがありますが、Safariには待ち伏せがあります。ここに興味深いコメント付きのスレッドがあり、著者は彼にMacbookを購入するように求めています。ほとんどすべてのブラウザがサポートするようになりました

<a href="" download="file-name.ext">

. download ( webkit.org), Blob, , . base64, . , FileSaver , Unknown. - — , .

, , , electron. , API , :

- , . node-webkit, electron-builder electron-packager, .

, dmg mac os x exe installer windows ( deb linux ):

{
  "osx" : {
    "title": "KeeWeb",
    "background": "../graphics/dmg-bg.png",
    "icon": "../graphics/app.icns",
    "icon-size": 80,
    "contents": [
      { "x": 438, "y": 344, "type": "link", "path": "/Applications" },
      { "x": 192, "y": 344, "type": "file" }
    ]
  },
  "win" : {
    "title": "KeeWeb",
    "icon": "graphics/app.ico"
  }
}