koulab

技術系のメモ

autocompleteを強制的にオフにする(2019年Chromeのみ)

f:id:dmca:20190913160015p:plain

例として管理画面とかで下記のようなコードがあって

<form class="form-horizontal">
                            <div class="box-body">
                                <div class="form-group">
                                    <label for="a1" class="col-sm-2 control-label">Email</label>
                                    <div class="col-sm-10">
                                        <input autocomplete="address-line3" type="text" class="form-control"  name="credit-card1" id="a1">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="a2" class="col-sm-2 control-label">Password</label>

                                    <div class="col-sm-10">
                                        <input autocomplete="address-line3" type="password" class="form-control" id="a2"  name="credit-card2">
                                    </div>
                                </div>

                            </div>
                            <!-- /.box-body -->
                            <div class="box-footer">

                                <button type="submit" class="btn btn-info pull-right">新規ユーザ作成</button>
                            </div>
                            <!-- /.box-footer -->
                        </form>

この例では管理者がユーザを作成できる画面ですがここでautocompleteが効いて鬱陶しいったらありゃしない。

autocomplete="new-password"

をinput要素に付けることで回避できます。

他人のパスワードを指定するようなユーザー管理ページを定義していて、パスワード欄のオートフィルを抑止したい場合は、 autocomplete="new-password" を使用することができます。ただし、この機能はまだ Firefox に実装されていません。 https://developer.mozilla.org/ja/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#The_autocomplete_attribute_and_login_fields