スクリプトのお勉強 技術

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

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

執筆者:

関連記事

@nifty auひかり タイプVからタイプGに変えてみた

家のインターネットはいままで、光回線ではありましたが、昔のVSDLのままでした。auひかりでいう、マンション タイプVというやつです。 それを近年、リモートワークが増えていることや、半導体需要がなんと …

顔画像のモザイク方法(python + OpenCV + face_recognition)

Python3での顔画像モザイク方法 python3での顔画像モザイクの方法を調べてみました。 仕事とは関係なく、単なる趣味だったりしますが。。 この内容で、Djangoと統合する予定です。 Open …

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

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

Pythonのmock.patchを使ってみる

単体テストによく使われるMockライブラリ Pythonで単体テストを行う際、実際のライブラリを使用してしまうと、実際の環境を用意しなければいけません。 例えば、データベースのテストをする際に、データ …

Mojolicious XML-RPC Pluginの開発(1)

はじめに 最近、お仕事関連で、perlとWebアプリケーションを触っています。 両方一度にお勉強、ということで、perlのWAF(Webアプリケーションフレームワーク)を調べてみようと思いました。 こ …

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