カテゴリー: プログラミング

【JS】FormDataと戯れる

こんにちは、しきゆらです。

今日は、JavaScriptでフォームのデータを簡単に取得したり、XMLHttpRequestなどで送信しやすいFormDataオブジェクトに触れたら便利だったので、メモしておきます。

 

formタグのデータをJSで取得し、それに追加して他のデータを送りたい場合などはよくあると思います。

そんな時は、formの中にhiddenでinput要素を配置するとか、方法はいくつかあると思います。

でも、HTML的にはhiddenの要素は意味がないので、データの扱いはJSだけで完結していたいですよね。(個人的な意見です)

 

そこで使えるのがFormDataというもの。

formタグの中身をそのままkey, valueの組み合わせで表現できる魔法のようなオブジェクトです。

参考:FormData – MDN

簡単な使い方をまとめておきます。

 

Continue reading “【JS】FormDataと戯れる”

【HTML/JS】NodeListはArrayにあらず

こんにちは、しきゆらです。

今回は、NodeListなどのArrayっぽいオブジェクトの扱いについてメモしておきます。

 

DOMを扱うとよく現れるNodeListなど、Arrayっぽくあるものがちょくちょくあります。

Arrayに似ているけど、concatとかArrayの便利メソッドは使えません。

このArrayっぽいものをArrayに直す方法です。

[].sliceはどのブラウザでも動くようです。

IEを無視すれば、以下のものでも良さそうです。

 

今回のことは、ほとんどMDNに書いてあることでした。

意外と見えていないんだなぁと。

以下のあたりを見ました。

参考

 

 

今回はここまで。

おわり

【Rust】チュートリアルをやって見た

こんにちは、しきゆらです。

今回はタイトル通りRustという言語のチュートリアルをやってみたのでその記録として残しておきます。

 

Rustさんは、FirefoxでおなじみMozilla製のプログラミング言語です。

コンパイル言語であり、速度はそれなり、メモリリークなどを極力排除することができるような言語だそうな。

詳しいことは、ググっていただけるとありがたいです。

 

それでは、見ていきます。

内容に関しては、以下のものをそのまま実行していくだけです。

はじめる – Rust

 

Continue reading “【Rust】チュートリアルをやって見た”

【Raspberry Pi】RubyのコンパイルからSSHまでを設定

こんにちは、しきゆらです。

今回は、前回にセットアップしたRaspberry PiにRubyをコンパイルし、SSH接続ができるようにします。

 

先回の記事はこちら

【Raspberry Pi】OSのインストールから日本語化まで

 

Continue reading “【Raspberry Pi】RubyのコンパイルからSSHまでを設定”

【Ruby】CSVをデータベースのように扱う

こんにちは、しきゆらです。

今回は、タイトルにある通りCSVに関するメモです。

 

時々触ることになるCSVですが、普通のDBでいいじゃん、って思いませんか?

私はそう思ってあまり触ってこなかったんですが、DBを適当に作ると後々変更しにくくなるということにようやく気付きました。

そこで、今回は忘れないうちに基本的なCSVの触り方をメモしておきます。

 

Continue reading “【Ruby】CSVをデータベースのように扱う”

【Ruby】メールを送信する

こんにちは、しきゆらです。

昨年に投稿した「【Ruby】メールを送受信する」のプログラムを書き直す機会があったので、改めて書いておきます。

 

上記の投稿に載せたスクリプトをクラスに直して、いくつかのバグを修正しました。

その結果はこれ

 

極力外部のライブラリを使わずにメール機能を実装してみました。

使っているのは、標準添付ライブラリのみ。

 

基本的な使い方

SendMailクラスのインスタンスを作るときに送信先、送信者のメールアドレスとオプションを渡します。

オプションでは、smtpサーバ名・ポート番号・SSLを使うかどうかなどを連想配列で渡します。

 

認証情報をsecret.jsonというファイルにJSON形式で書きます。

例えば以下のような感じ。

これを読み込んで使うようになっています。

 

デフォルトでは、Gmailのsmtpサーバを利用するようになっています。

Googleで2段階認証を設定している場合は、ログインするためのパスワードでは認証できません。

これに対しては、アプリケーション用のパスワードを作成して、secret.jsonに書きます。

作成方法は以下あたりから。

 

送信するときは、そのままsendメソッドを使います。

引数として、subjectとbodyを文字列として渡してやります。

これだけでメールを送ることができます。

一定のタイミングで通知を送るとか、使い方はそれなりにありそう。

 

件名の文字化け対策

また、以前のスクリプトでは件名が文字化けしてしまいます。

これをなんとかするために、create_subjectでいい感じに変換しています。

参考としたのは、以下のサイトたち。

charsetを指定しただけでは件名が化けてしまうようです。

どうも、アスキー文字のみしか使えないようです。

これをなんとかするためには、

という形で書かないといけないようです。

UTF-8で場合は

とします。

エンコードはBase64というものを使ってエンコードしています。

 

また、一定の文字数で区切らないといけないようです。

これに関しては、Base64でエンコードするといい感じのところで区切り文字を入れてくれます。

そこでsplitして、それぞれの文字列を上記のフォーマットで囲ってやっています。

 

 

ブログを見ると、メールを書くプログラムをいつかいたのかと思ったら約1年前だったとは。

久々にこの遺産が役に立ったので、驚きました。

思いついたら書いて、保持しておくのは大事なんだなと思いました。

 

おわり

[Ruby]k-means法を実装してみた

こんにちは、しきゆらです。

今回はクラスタリング手法の一つであるk-means法を実装してみたのでまとめてみます。

使用言語は、もちろんRubyです。

なお、ライブラリ等は使わずに実装してみました。

Continue reading “[Ruby]k-means法を実装してみた”

[HTML]formをエンターで送信したい

こんにちは、しきゆらです。

急に暑くなってきた今日この頃、いかがお過ごしでしょうか。

 

今回は、HTMLのお話です。

 

HTMLのformタグで、エンターを押した時に送信したい、という場面になりました。

しかも、送信する部分に関してはJSでコードを書いていました。

例としては、以下のような感じ。

ユーザ名IDを入力してもらい、ボタンを押すと入力された情報をサーバへ送りログイン処理を行う、というもの。

これを、エンターを押した時も同じように処理してほしい、というのが今回の話。

 

サーバサイドのスクリプトも自分で書いていたので、HTMLのsubmitに合わせてデータを取得できるようにすればいいんですが、面倒だったのでlogin関数でなんとかできないかな、と思っていました。

結論としては、formタグに「onsubmit=”return login();”」と書き込んで、

login関数で 「return false;」とすれば解決でした。

onsubmitは、onclickのように関数名を渡せばいいんだと思っていましたが、違うようですね。

onsubmitは、関数等の処理を返す必要があるようです。

 

ただ関数がreturnすればいいのではなく、その値をさらにリターンするイメージですかね。

参考:onsubmitの戻り値をfalseにしてsubmitを実行しない(中断させる)方法 – 小粋空間

 

また、テキストボックスの数によっても挙動が異なるようです。

参考:【HTML】入力欄が1つだけのフォームはEnterキー押下でsubmitされる。submitボタンがなくても。 – SOFTELメモ

 

知らないことがたくさんありますね。

今回はここまで。

おわり。

【HTML/JS】要素のテンプレートを作る

こんにちは、しきゆらです

タイトル通り要素のテンプレートを作るためのタグの存在を知ったためメモしていきます

 

これまでは、特定のタグをテンプレートとして利用するときは

CSSでdisplay:noneとかをかけて見えなくしておいた要素をelement.cloneNode()で複製していくスタイルでした

 

そんな中、HTML5から追加された(?)templateタグというものを見つけました

これの使い方や、他の方法との速度の差などをまとめていきます

 

Continue reading “【HTML/JS】要素のテンプレートを作る”

【JS/Electron】MacにElectronを導入する

こんにちは、しきゆらです

今回はMac上にElectronを導入していきます

Electronとは、簡単に言えばChromeの中身であるChromiumを使ってデスクトップアプリを作ることができるフレームワークのことで
Webの技術(HTML/CSS,JavaScript)を使ってアプリを作ることができます
テキストエディタのAtomのために作られたもので、現在はみんなが使えるように公開されています
Atomもちろん、VS CodeやPC版のSlackなどもElectronを使って作られているようです
手順等は続きから

Continue reading “【JS/Electron】MacにElectronを導入する”