uri validator
Validate an URL address
Options
Use with form field
The HTML attributes are used to set the validator options via the Declarative plugin
| Name | HTML attribute | Type | Description |
|---|---|---|---|
allowLocal |
data-fv-uri___allow-local |
Boolean | Allow the private and local network IP. It is false, by default. |
message |
data-fv-uri___message |
String | The error message |
protocol |
data-fv-uri___protocol |
String | The protocols, separated by a comma. By default, it is set to http, https, ftp |
allowEmptyProtocol |
data-fv-uri___allow-empty-protocol |
Boolean | Allow the URI without protocol. Default to false |
Use with JavaScript module
// You might need to change the importing path
import uri from 'formvalidation/validators/uri';
const result = uri().validate({
value: ...,
options: {
allowLocal: ...,
message: ...,
protocol: ...,
allowEmptyProtocol: ...,
},
});
/*
result is an object of
{
valid: true or false,
message: The error message
}
*/
Basic Example
You can click on sample to see if it's a valid or invalid URL.
| Sample | Is valid? |
|---|---|
| http://foo.com/blah_blah | |
| http://foo.com/blah_blah/ | |
| http://foo.com/blah_blah_(wikipedia) | |
| http://foo.com/blah_blah_(wikipedia)_(again) | |
| http://www.example.com/wpstyle/?p=364 | |
| https://www.example.com/foo/?bar=baz&inga=42&quux | |
| http://✪df.ws/123 | |
| http://userid:password@example.com:8080 | |
| http://userid:password@example.com:8080/ | |
| http://userid@example.com | |
| http://userid@example.com/ | |
| http://userid@example.com:8080 | |
| http://userid@example.com:8080/ | |
| http://userid:password@example.com | |
| http://userid:password@example.com/ | |
| http://142.42.1.1/ | |
| http://142.42.1.1:8080/ | |
| http://➡.ws/䨹 | |
| http://⌘.ws | |
| http://⌘.ws/ | |
| http://foo.com/blah_(wikipedia)#cite-1 | |
| http://foo.com/blah_(wikipedia)_blah#cite-1 | |
| http://foo.com/unicode_(✪)_in_parens | |
| http://foo.com/(something)?after=parens | |
| http://☺.damowmow.com/ | |
| http://code.google.com/events/#&product=browser | |
| http://j.mp | |
| ftp://foo.bar/baz | |
| http://foo.bar/?q=Test%20URL-encoded%20stuff | |
| http://مثال.إختبار | |
| http://例子.测试 | |
| http://उदाहरण.परीक्षा | |
| http://-.~_!%sapper.html%amp;()*+,;=:%40:80%2f::::::@example.com | |
| http://1337.net | |
| http://a.b-c.de | |
| http://223.255.255.254 | |
| http:// | |
| http://. | |
| http://.. | |
| http://../ | |
| http://? | |
| http://?? | |
| http://??/ | |
| http://# | |
| http://## | |
| http://##/ | |
| http://foo.bar?q=Spaces should be encoded | |
| // | |
| //a | |
| ///a | |
| /// | |
| http:///a | |
| foo.com | |
| rdar://1234 | |
| h://test | |
| http:// shouldfail.com | |
| :// should fail | |
| http://foo.bar/foo(bar)baz quux | |
| ftps://foo.bar/ | |
| http://-error-.invalid/ | |
| http://a.b--c.de/ | |
| http://-a.b.co | |
| http://a.b-.co | |
| http://0.0.0.0 | |
| http://10.1.1.0 | |
| http://10.1.1.255 | |
| http://224.1.1.1 | |
| http://1.1.1.1.1 | |
| http://123.123.123 | |
| http://3628126748 | |
| http://.www.foo.bar/ | |
| http://www.foo.bar./ | |
| http://.www.foo.bar./ | |
| http://10.1.1.1 | |
| http://10.1.1.254 |
HTML5 Example
When the Declarative plugin is used, the uri validator will be turned on automatically if the input uses HTML 5 type="url" attribute.
Using with regexp validator example
The following example is a combination usage of the uri and regexp validators. It asks user to enter a valid URL which ends with .jpg, .jpeg, or .png.
Module Example
The following snippet shows how to use the uri validator with JavaScript module:
// You might need to change the importing path
import uri from 'formvalidation/validators/uri';
const res1 = uri().validate({
value: 'http://foo.com/blah_blah_(wikipedia)',
options: {
message: 'The input is not a valid URL',
},
});
// res1.valid === true
const res2 = uri().validate({
value: 'http://foo.bar?q=Spaces should be encoded',
options: {
allowLocal: true,
message: 'The input is not a valid URL',
},
});
// res2.valid === false
const res3 = uri().validate({
value: 'news://foo.com/blah_blah',
options: {
allowEmptyProtocol: true,
message: 'The input is not a valid URL',
},
});
// res3.valid === true