スクリプトのお勉強 技術

小ネタ: JavaScriptにてBase64エンコード/デコードする方法

投稿日:

小ネタです。JavaScriptにてBase64エンコード/デコードをしようとして、意外と詰まったので、メモ的に方法を書いておきます。

結論: js-base64ライブラリを使用する

これだけです。。検索するとbtoa/atobを使う方法が多いですが、日本語を使うとエラーになったりしたので、これに落ち着きました。

$ npm install --save js-base64

Svelteで具体的に作ってみる

Svelteで書いてみると以下の感じになります。

base64.svelte

<script lang="ts">
    import { Base64 } from 'js-base64';
    var b64content = Base64.encode("content");
    var asciicontent = Base64.decode(b64content);
</script>

Content: {asciicontent} <br>

Base64: {b64content} <br>

root.svelte(抜粋)

<script>
  import Base64Test from './base64.svelte';
</script>
  <Base64Test />

画面

画面は以下になります。”content”という文字列をBase64エンコードしていることと、デコードできていることが分かります。

-スクリプトのお勉強, 技術

執筆者:

関連記事

Doltを起動して、PythonからMySQL的アクセスしてみる

はじめに お仕事で、運用データをどのようにプログラム的に保持するかは意外に難しいです。 この意味の運用データとは、例えば、接続先ホストとか、パスワードとか、運用の人が日常に使うデータを指します。 シス …

Svelte(Carbon Components Svelte) + Python(FastAPI)でWebアプリを作る

Svelte用のサンプルとして、Carbon Components SvelteのTreeViewを試用してファイルツリーを表示し、各データはAPIとして読み出し、編集するWebアプリケーションを実装 …

良いタブレットない問題

BMAX maxpad I11が故障した この記事で新しいタブレット買ったのですが、2ヶ月程度で故障しました。。 正確には、指に何も反応しなくなってしまいました。 ダメだったので修理依頼 いろいろして …

CentOS7をRocky Linux 9に移行する

このVMのOSをCentOS7にした関係上、そろそろupdateする必要があります。そもそもCentOS7を選択した理由は、仕事で使用するからでした。 で、仕事ではRocky Linux 9なので、こ …

Webフレームワーク「Django 3.2」を使ってみる

LTSリリースなので、現状でアップデートしてないDjangoプロジェクトをDjango 3.2にしていこうかと思いました。例として、自分のDjango 2.0のプロジェクトをDjango 3.2にしま …

    google オプトアウト Click here to opt-out.