【2019/8/20】 多くの方に見ていただいている記事なので、改めてまとめ直しました。 https://www.mahirokazuko.com/entry/2019/08/20/133713 よくある画像アップロード機能を作ってみた😋 ◆ 要件 ・ フォルダにある画像を選択すると、小さくリサイズされたサムネが表示される ・ 送信ボタンを押すとリサイズ済みの画像がフォームデータとして送信される ◆ サンプル ↓ ファイル選択するとサムネを表示 上の画像、生データだと横幅6000pxくらいあります。最近のスマホで撮った写真はサイズが大きすぎるので、通信量を抑えるためにもリサイズしてアップロードは必須ですね。 ◆ コード ファイル取得→canvas描画→base64取得→Blob作成→Blob送信 という流れ <!-- ファイル選択ボタン --> <div style="width: 50
We’re getting things ready Loading your experience… This won’t take long.
はじめに フォームの入力の際に、入力に間違いがないかプレビュー表示する この機能を実現するためにFileAPIを利用する JavaScriptのFileAPIは2016年3月現在ほぼすべてのブラウザに対応している(IEさえも) 本サンプルコードはjQueryで動作します。 jQueryを使っていないのが知りたい人はこちらのフォームからファイルを選択した際に、submitする前にプレビュー表示する方法(jQuery"無し"版) を参照のこと Demo 動作を確認できるデモはこちら Demo 対象のコード $(function(){ //画像ファイルプレビュー表示のイベント追加 fileを選択時に発火するイベントを登録 $('form').on('change', 'input[type="file"]', function(e) { var file = e.target.files[0],
ファイルの圧縮／展開は頻繁に行う操作の1つだ。お気に入りのソフトを使っている人が多いとは思うが、外出先やいつもと異なるPCで仕事をする場合、オンラインで圧縮／展開ができることを知っておくと何かと役立つだろう。あわせてファイル形式の変換ができるサイトもご紹介する。 ファイルの圧縮／展開は頻繁に行う操作の1つ。Biz.ID読者であれば、お気に入りの圧縮／展開ソフトを日常的に利用していることだろう。とはいえ、これからの季節、実家に帰省する方や旅行に出かける方も多いはず。いつもと違う環境でPCを利用するなら、オンラインでファイルの圧縮／展開ができるサービスを知っていて損はない。後半では、ファイルの形式を変換するサービスもご紹介する。 シンプルに使いたいなら「Krunch」 シンプルにファイルを圧縮／展開するなら「Krunch」だ。圧縮／展開が行えるのはZIP、RAR、QZIP。まず、圧縮したいファ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
