スクリプトのお勉強 技術

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

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

執筆者:

関連記事

Nuxt.jsのFormで入力/確認/完了フォームを作成してみた(その1)

背景 今回は、Webアプリケーションの、フロントエンド系のお話です。ほとんどの場合、バックエンドなのですが、時々フロントエンドもするんですよね。。 私の派遣先では、入力フォームを以下のように分ける要望 …

SNMPTrap を Kafka に転送するツール:snmptrap-kafka-forwarder の紹介

はじめに こんにちは!今回は、ネットワーク監視の世界で古くから使われている SNMPTrap を、モダンなデータ基盤である Apache Kafka に連携するための便利なツール「snmptrap-k …

Pipenv vs Poetry

1. はじめに Pythonでお仕事していると、どうしても、環境設定を行う必要があります。 本番環境で動作するように、設定しなければいけないからです。 いろんな状況はあるでしょうが、私がかかわるプロジ …

JSON/YAMLファイル読み込み用ライブラリ比較(Python3)

はじめに Python3でプログラムを作る際、YAML/JSONを読みだす処理を多く作成します。そうすると、データが長く、そして複雑になる時があります。 ネストしてるデータを読みだすと以下のように a …

Python(prophet)で体重予測

最近ダイエットしていて、少しだけ成果が出たので、グラフ表示しようと思ってました。そのついでにこれからの予測もしてみようということで、過去のデータを集め、グラフ表示してみます。 google Colab …

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