お知らせ

現在サイトのリニューアル作業中のため、全体的にページの表示が乱れています。

ChromeのDevTools ConsoleでFirebase Realtime Databaseを読み取る

投稿日：
ソフトウェア::ブラウザ::ChromeWebサービス::Firebase

具体的にはref('SomeReference').once('value')の結果を取得する

確認環境

Env Ver
Chrome 91.0.4472.77
Firebase SDK 8.6.2

サンプルコード

top level awaitが使える

// apps[]から使いたいのを取る
const dbInstance = firebase.apps[0]
// DB参照を取る
const dbRef = firebase.database(dbInstance)
// 読み取る場合、書き込みは.set()とかする
(await dbRef.ref('/foo/bar').once('value')).val()
コメント（0件）

iOS Safariでのinputの実装注意点

投稿日：
言語::JavaScript言語::HTMLOS::iOSソフトウェア::ブラウザ

maxlength

  • iOS Safariでは効かない
  • onInput()でstring.slice(0, maxlength)するとIMEの挙動が可笑しくなる
    • type="tel"など日本語が入力できない場合であれば有効
  • オートコンプリートやコピペ入力での字切れなどもあるため、根本的に使わないことが望ましい

type="number"

  • iOS Safariでは期待した動作にはならない
    • IMEが有効になり、全角入力が発生する
  • 使うならtype="tel"を使い、JSで数字以外の入力を弾くのが無難
  • 恐らく普及ブラウザの全てで半角入力を強制出来、スマホなどではNumPadが出てくる
    • アルファベットやハイフンなどの記号も打てるので必要に応じた入力制御が必要
コメント（0件）