スクリプトのお勉強 技術

小ネタ: 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エンコードしていることと、デコードできていることが分かります。

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

執筆者:

関連記事

Ruby(Rails)で最小限にREST APIを立ち上げる

簡単にREST APIを立ち上げたいなーと思うときが仕事であります。別にRubyでなくてもいいのですが、一応前提がRubyであることにします。 仕事で必要になるには 現在の仕事を鑑みると、最低限以下の …

Go 言語で作る!単一バイナリで動くモダンな Web UI アプリケーション

はじめに Web アプリケーションを開発する際、アーキテクチャの選択は常に悩ましい問題です。「巨大なモノリスは開発が進むにつれて複雑化し、マイクロサービスは管理が煩雑になる…。」そんなジレンマを抱えて …

CSSで注釈を自動ナンバリングする

お仕事で、注釈をつける事がありました。 一瞬で回答できなかったので、ブログネタとして調べてみました。 注釈、とは この意味の注釈とは 「難しい単語]※1 ※1 こういう意味です で「※1」にリンクが張 …

故障物(8インチタブレットからBMAX MaxPad l11に)

ついに故障 ついに8インチタブレットがほぼ故障しました。「ほぼ」というのは、バッテリーが使えずずっと電源線に繋げてないと使えないからです。 それではタブレットの意味がありません。 つぎは10インチタブ …

コンピュータ系の人のためのCoinhive最高裁の読み方(なぜ無罪だったか)

以下ですべて断定してますが、そもそもからしてすべて想定です。私は法律家ではないので。 前回の記事で、Coinhiveの高裁判決について書きました。 今回は、無罪と決まったCoinhiveの最高裁判決を …

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