uri validator

Validate an URL address

Options

Using 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`

Using the ES6 module

// You might need to change the importing path
import { uri } from '/vendors/@form-validation/cjs/validator-uri';

const result = uri().validate({
    value: ...,
    options: {
        allowLocal: ...,
        message: ...,
        protocol: ...,
        allowEmptyProtocol: ...,
    },
});
/*
result is an object of
{
    valid: true or false,
    message: The error message
}
*/

Using the npm package

Install the validator package:

$ npm install @form-validation/validator-uri

Use the uri validator:

import { uri } from '@form-validation/validator-uri';

const result = uri().validate({
    value: ...,
    options: {
        allowLocal: ...,
        message: ...,
        protocol: ...,
        allowEmptyProtocol: ...,
    },
});

Basic example

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.

HTML5 example

NPM package example

The following snippet shows how to use the uri validator with the npm package:

import { uri } from '@form-validation/validator-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

Changelog

v2.1.0

The validator doesn't work properly if the message property isn't defined

v2.0.0

Add the npm package

stringLength validator uuid validator