6

私は HTML5 入力パターンのポリフィルに取り組んでおり、ブラウザー (Chrome) とまったく同じように JavaScript で input type=url を検証しようとしていますが、JavaScript または PERL 互換の正規表現に関するドキュメントが見つかりません。これはポリフィルであるため、すべての URL に正確に一致するかどうか (これは不可能です) は特に気にしませんが、ブラウザーの動作を模倣することはできます。

PERL構文で同じパターンを知っている人はいますか?

ありがとう

4

2 に答える 2

6

GitHub でいくつかの HTML5 shiv を検索して、他の誰かが理想的な表現に出くわしたかどうかを確認した後、非常に近いものを見つけたと思いますが、完全には一致しません。

Alexander Farkas ( https://github.com/aFarkas/webshim/blob/master/src/shims/form-shim-extend.js#L285 ) は、このパターンを使用して URL をテストします。

/^([a-z]([a-z]|\d|\+|-|\.)*):(\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?((\[(|(v[\da-f]{1,}\.(([a-z]|\d|-|\.|_|~)|[!\$&'\(\)\*\+,;=]|:)+))\])|((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=])*)(:\d*)?)(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*|(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)|((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)){0})(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i;

また、Google 経由でこれに出くわした人のために、パターンは必要ないが、JavaScript (おそらく onChange) を介して何かが有効かどうかを確認したいだけの場合は、formelement.checkValidity() メソッドを使用できます。明らかに、これはポリフィル (ネイティブの HTML5 検証サポートがないことを前提としています) には役に立ちませんが、それでも有用です。

于 2012-05-17T14:35:27.550 に答える
4

http://www.w3.org/TR/html5/forms.html#url-state-(type=url)で関連する仕様を読んでください。

ポリフィルは、入力のサニタイズ、つまり改行の削除と文字列のトリミングから開始する必要があります。「ユーザー エージェントは、ユーザーに "LF" (U+000A) または "CR" (U+000D) 文字の挿入を許可してはならない」という文も興味深いかもしれません。

結果は、有効な絶対URLである必要があります。そこで参照されている RFC 3986および3987では、URL の検証について説明されています。URL の解析に関するセクションも興味深いかもしれません。

ポリフィルは URI を検証するだけでなく、相対 URI を解決する場合もあります。少なくとも、URI の検証は、適切な正規表現を見つけるのではなく、アルゴリズムを使用することではるかに簡単になります。それでも、RFC でさえ、付録 Bですでに検証済みのURIを解析するための正規表現について言及しています。

于 2012-05-16T23:35:50.757 に答える