멋진 커뮤니티 모듈

유효성 검사기

빌드 상태

validatorjs 라이브러리를 사용하면 브라우저와 Node.js 모두에서 JavaScript의 데이터 유효성 검사를 매우 쉽게 수행할 수 있습니다. 이 라이브러리는 Laravel 프레임워크의 Validator 에서 영감을 받았습니다 .

왜 validatorjs를 사용합니까?

  • 어떤 라이브러리에도 의존하지 않습니다.
  • 브라우저와 노드 모두에서 작동합니다.
  • 읽을 수 있고 선언적인 유효성 검사 규칙.
  • 다국어 지원 오류 메시지.
  • AMD/Require.js 및 CommonJS/Browserify 지원.

설치

Bower, NPM 또는 Github의 /dist 디렉토리에서 validatorjs를 가져옵니다.

1
bower install validatorjs
1
npm install validatorjs

Browser

1
<script src="validator.js"></script>

Node.js / Browserify

1
let Validator = require('validatorjs');

Basic Usage

1
let validation = new Validator(data, rules [, customErrorMessages]);

data {Object}-검증하려는 데이터

규칙 {Object}-검증 규칙

customErrorMessages {Object}-반환할 선택적 사용자 지정 오류 메시지

예 1 - 검증 통과

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
let data = { name: 'John', email: 'johndoe@gmail.com', age: 28 }; let rules = { name: 'required', email: 'required|email', age: 'min:18' }; let validation = new Validator(data, rules); validation.passes(); // true validation.fails(); // false

받는 사람 유효성 검사 규칙을 적용하려면 데이터 객체는 동일한 객체 키 이름을 사용 규칙 객체입니다.

예 2 - 검증 실패

1 2 3 4 5 6 7 8 9 10 11 12 13 14
let validation = new Validator({ name: 'D', email: 'not an email address.com' }, { name: 'size:3', email: 'required|email' }); validation.fails(); // true validation.passes(); // false // Error messages validation.errors.first('email'); // 'The email format is invalid.' validation.errors.get('email'); // returns an array of all email error messages

Nested Rules

중첩된 객체도 검증할 수 있습니다. 중첩된 객체에 대한 검증 규칙을 선언하는 두 가지 방법이 있습니다. 첫 번째 방법은 데이터를 반영하는 해당 중첩 객체 구조로 검증 규칙을 선언하는 것입니다. 두 번째 방법은 평면 키를 사용하여 검증 규칙을 선언하는 것입니다. 예를 들어 다음 데이터의 유효성을 검사하려면:

1 2 3 4 5 6 7 8 9 10
let data = { name: 'John', bio: { age: 28, education: { primary: 'Elementary School', secondary: 'Secondary School' } } };

다음과 같이 유효성 검사 규칙을 선언할 수 있습니다.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
let nested = { name: 'required', bio: { age: 'min:18', education: { primary: 'string', secondary: 'string' } } }; // OR let flattened = { 'name': 'required', 'bio.age': 'min:18' 'bio.education.primary': 'string', 'bio.education.secondary': 'string' };

WildCards Rules

와일드카드도 검증할 수 있습니다.

1 2 3 4 5 6 7 8 9 10 11 12
let data = { users: [{ name: 'John', bio: { age: 28, education: { primary: 'Elementary School', secondary: 'Secondary School' } } }] };

다음과 같이 유효성 검사 규칙을 선언할 수 있습니다.

1 2 3 4 5 6
let rules = { 'users.*.name': 'required', 'users.*.bio.age': 'min:18' 'users.*.bio.education.primary': 'string', 'users.*.bio.education.secondary': 'string' };

Available Rules

검증 규칙에는 암시적 ' 필수 ' 가 없습니다. 필드가 정의되지 않았 거나 빈 문자열인 경우 검증을 통과합니다. 정의되지 않은 또는 ''에 대해 검증이 실패하도록 하려면 필수 규칙을 사용하십시오 .

수락

검증 중인 필드는 yes, on, 1 또는 true여야 합니다. 이는 "서비스 약관" 수락을 검증하는 데 유용합니다.

이후:날짜

검증 중인 필드는 지정된 날짜 이후여야 합니다.

after_or_equal:날짜

유효성 검사 중인 필드는 지정된 필드 이후이거나 같아야 합니다.

알파

검증 중인 필드는 완전히 알파벳 문자여야 합니다.

alpha_dash

검증 중인 필드에는 대시 및 밑줄뿐만 아니라 영숫자 문자가 포함될 수 있습니다.

alpha_num

검증 중인 필드는 완전히 영숫자 문자여야 합니다.

정렬

검증 중인 필드는 배열이어야 합니다.

이전:날짜

검증 중인 필드는 지정된 날짜 이전이어야 합니다.

before_or_equal:날짜

검증 중인 필드는 지정된 날짜 이전이거나 같아야 합니다.

사이:최소,최대

검증 중인 필드의 크기는 지정된 최소값과 최대값 사이여야 합니다. 문자열, 숫자 및 파일은 크기 규칙과 동일한 방식으로 평가됩니다.

부울

아래 A 부울 값의 필드 유효성 검사 true, false, 0, 1, 'true', 'false', '0', '1',

확인

검증 중인 필드는 foo_confirmation과 일치하는 필드가 있어야 합니다. 예를 들어 검증 중인 필드가 password인 경우 일치하는 password_confirmation 필드가 입력에 있어야 합니다.

데이트

유효성 검사 중인 필드는 Javascript의 Date개체에서 허용되는 유효한 날짜 형식이어야 합니다.

숫자:값

검증 중인 필드는 숫자여야 하며 정확한 길이의 값을 가져야 합니다.

다름:속성

지정된 필드는 검증 중인 필드와 달라야 합니다.

이메일

유효성 검사 필드는 전자 메일 주소 형식이어야 합니다.

마녀

유효성 검사 필드는 16진수 형식이어야 합니다. 16 hex|size:6진수 색상 코드 유효성 검사 와 같은 다른 규칙과 함께 사용하면 유용 합니다.

인:푸,바,...

검증 중인 필드는 지정된 값 목록에 포함되어야 합니다. 필드는 배열 또는 문자열일 수 있습니다.

정수

검증 중인 필드에는 정수 값이 있어야 합니다.

최대:값

속성이 주어진 크기보다 크지 않은지 확인

참고: 최대 수표는 포함됩니다.

최소값:값

속성이 최소한 주어진 크기인지 확인하십시오.

참고: 최소 수표는 포함됩니다.

not_in:푸,바,...

검증 중인 필드는 주어진 값 목록에 포함되어서는 안 됩니다.

숫자

속성이 숫자인지 확인합니다. 숫자의 문자열 표현은 통과합니다.

필수의

값의 String 표현의 길이가>인지 확인합니다.

required_if:다른 필드, 값

검증 중인 필드는 존재해야 하며 otherfield 필드가 임의의 값과 같으면 비어 있지 않아야 합니다.

required_unless:다른 필드, 값

유효성 검사 중인 필드는 존재해야 하며 otherfield 필드가 값과 같지 않은 경우 비어 있지 않아야 합니다.

required_with:foo,bar,...

유효성 검사 중인 필드가 있어야 하며 다른 지정된 필드가 있는 경우에만 비어 있으면 안 됩니다.

required_with_all:foo,bar,...

유효성 검사 중인 필드가 있어야 하며 다른 지정된 필드가 모두 있는 경우에만 비어 있으면 안 됩니다.

required_without:foo,bar,...

유효성 검사 중인 필드가 있어야 하며 지정된 다른 필드가 없는 경우에만 비어 있으면 안 됩니다.

required_without_all: foo,bar,...

유효성 검사 중인 필드가 있어야 하며 다른 지정된 필드가 모두 없는 경우에만 비어 있으면 안 됩니다.

동일:속성

주어진 필드는 검증 중인 필드와 일치해야 합니다.

크기:값

검증 중인 필드의 크기는 지정된 값과 일치해야 합니다. 문자열 데이터의 경우 값은 문자 수에 해당하고, 숫자 데이터의 경우 값은 지정된 정수 값에 해당합니다.

검증 중인 필드는 문자열이어야 합니다.

URL

속성에 유효한 URL 형식이 있는지 확인

정규식:패턴

검증 중인 필드는 지정된 정규식과 일치해야 합니다.

참고 : regex패턴을 사용할 때 특히 정규 표현식에 파이프 문자가 포함된 경우 파이프 구분 기호를 사용하는 대신 배열에 규칙을 지정해야 할 수 있습니다. 다른 백슬래시로.

예 3-정규식 유효성 검사

1 2 3 4 5 6 7 8 9 10 11 12 13
let validation = new Validator({ name: 'Doe', salary: '10,000.00', yearOfBirth: '1980' }, { name: 'required|size:3', salary: ['required', 'regex:/^(?!0\\.00)\\d{1,3}(,\\d{3})*(\\.\\d\\d)?$/'], yearOfBirth: ['required', 'regex:/^(19|20)[\\d]{2,2}$/'] }); validation.fails(); // false validation.passes(); // true

예 4-유형 확인 유효성 검사

1 2 3 4 5 6 7 8 9 10 11
let validation = new Validator({ age: 30, name: '' }, { age: ['required', { 'in': [29, 30] }], name: [{ required_if: ['age', 30] }] }); validation.fails(); // true validation.passes(); // false

Register Custom Validation Rules

1
Validator.register(name, callbackFn, errorMessage);

name {String}-규칙의 이름입니다.

callbackFn {Function}-성공 또는 실패한 유효성 검사를 나타내는 부울을 반환합니다.

errorMessage {String}-사용자 정의 오류 메시지를 지정할 수 있는 선택적 문자열입니다 . errorMessage 내의 :attribute 는 속성 이름으로 대체됩니다.

1 2 3
Validator.register('telephone', function(value, requirement, attribute) { // requirement parameter defaults to null return value.match(/^\d{3}-\d{3}-\d{4}$/); }, 'The :attribute phone number is not in the format XXX-XXX-XXXX.');

Asynchronous Validation

passes콜백 을 허용하는 비동기 규칙을 등록합니다 .

1 2 3 4 5 6
Validator.registerAsync('username_available', function(username, attribute, req, passes) { // do your database/api checks here etc // then call the `passes` method where appropriate: passes(); // if username is available passes(false, 'Username has already been taken.'); // if username is not available });

그런 다음 콜백을 전달 fails하거나 다음 passes과 같이 유효성 검사기를 호출합니다 .

1 2 3 4 5 6 7 8 9 10 11 12 13
let validator = new Validator({ username: 'test123' }, { username: 'required|min:3|username_available' }); validator.passes(function() { // Validation passed }); validator.fails(function() { validator.errors.first('username'); });

참고: 호출을 시도 passes하거나 fails콜백 및 유효성 검사기 없이 비동기 유효성 검사 규칙이 있는지 감지 하면 예외가 발생합니다.

Error Messages

이 생성자는 실패한 유효성 검사 규칙에 대한 오류 메시지를 자동으로 생성합니다.

오류가있는 경우 검사기 인스턴스가있을 것이다 오류 . 속성 객체가 모두 실패 속성에 대한 오류 메시지와 함께 채워의 메서드와 속성 오류 속성 객체는 다음과 같습니다

.first(속성)

속성에 대한 첫 번째 오류 메시지를 반환하고 그렇지 않으면 false를 반환합니다.

.get(속성)

속성에 대한 오류 메시지 배열을 반환하거나 오류가 없으면 빈 배열을 반환합니다.

.모두()

모든 실패한 속성에 대한 모든 오류 메시지가 포함된 개체를 반환합니다.

.has(속성)

속성에 대한 오류 메시지가 있으면 true를 반환하고 그렇지 않으면 false를 반환합니다.

.errorCount

검증 오류의 수

1 2 3
let validation = new Validator(input, rules); validation.errors.first('email'); // returns first error message for email attribute validator.errors.get('email'); // returns an array of error messages for the email attribute

Custom Error Messages

특정 오류 메시지가 필요하고 기본 오류 메시지를 재정의하지 않으려면 Laravel 과 마찬가지로 재정의를 Validator 객체의 세 번째 인수로 전달할 수 있습니다 .

1 2 3 4 5 6 7 8 9 10
let input = { name: '' }; let rules = { name : 'required' }; let validation = new Validator(input, rules, { required: 'You forgot to give a :attribute' }); validation.errors.first('name'); // returns 'You forgot to give a name'

일부 유효성 검사기에는 문자열 및 숫자 버전이 있으며 변경할 수도 있습니다.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
let input = { username: 'myusernameistoolong' }; let rules = { username : 'max:16' }; let validation = new Validator(input, rules, { max: { string: 'The :attribute is too long. Max length is :max.' } }); validation.errors.first('username'); // returns 'The username is too long. Max length is 16.'

속성별로 오류 메시지를 제공할 수도 있습니다! 메시지의 키를 'validator.attribute'로 설정하기만 하면 됩니다.

1 2 3 4 5 6 7 8 9
let input = { name: '', email: '' }; let rules = { name : 'required', email : 'required' }; let validation = new Validator(input, rules, { "required.email": "Without an :attribute we can't reach you!" }); validation.errors.first('name'); // returns 'The name field is required.' validation.errors.first('email'); // returns 'Without an email we can\'t reach you!'

Custom Attribute Names

오류 메시지에 사용자 정의 "친숙한" 속성 이름을 표시하려면 다음을 사용하십시오. .setAttributeNames()

1 2 3 4 5
let validator = new Validator({ name: '' }, { name: 'required' }); validator.setAttributeNames({ name: 'custom_name' }); if (validator.fails()) { validator.errors.first('name'); // "The custom_name field is required." }

또는 속성을 사용하여 lang에 전역 사용자 정의 속성 이름을 제공할 수 있습니다 attributes.

사용자 정의 속성 포맷터를 구성할 수도 있습니다.

1 2 3 4 5 6 7 8 9 10 11 12 13
// Configure global formatter. Validator.setAttributeFormatter(function(attribute) { return attribute.replace(/_/g, ' '); }); // Or configure formatter for particular instance. let validator = new Validator({ first_name: '' }, { first_name: 'required' }); validator.setAttributeFormatter(function(attribute) { return attribute.replace(/_/g, ' '); }); if (validator.fails()) { console.log(validator.errors.first('first_name')); // The first name field is required. }

참고: 기본적으로 모든 _ 문자는 공백으로 대체됩니다.

Language Support

오류 메시지는 기본적으로 영어로 표시됩니다. 브라우저에 다른 언어를 포함하려면 스크립트 태그에서 언어 파일을 참조하고 를 호출하십시오 Validator.useLang('lang_code').

1 2 3 4 5
<script src="dist/validator.js"></script> <script src="dist/lang/ru.js"></script> <script> Validator.useLang('es'); </script>

Node에서는 언어 소스 파일을 자동으로 선택합니다.

1 2
let Validator = require('validatorjs'); Validator.useLang('ru');

귀하의 언어에 대한 지원이 표시되지 않으면 에 추가하십시오 src/lang.

다음을 호출하여 사용자 정의 언어를 추가할 수도 있습니다 setMessages.

1 2 3
Validator.setMessages('lang_code', { required: 'The :attribute field is required.' });

주어진 언어에 대한 메시지의 원시 객체를 가져옵니다.

1
Validator.getMessages('lang_code');

유효성 검사기에서 사용하는 기본 언어를 전환합니다.

1
Validator.useLang('lang_code');

사용 중인 기본 언어 가져오기:

1
Validator.getDefaultLang(); // returns e.g. 'en'

언어에 대한 기본 메시지 무시:

1 2 3
let messages = Validator.getMessages('en'); messages.required = 'Whoops, :attribute field is required.'; Validator.setMessages('en', messages);