앱이나 웹 프로그래밍에서 JSON 데이터의 유효성을 검사하는 기능은 매우 중요합니다. 이는 특히 서버와 클라이언트 간에 데이터를 주고받을 때, 또는 API 호출을 통해 데이터를 처리할 때 필수적입니다. 유효하지 않은 JSON 데이터는 애플리케이션의 비정상적인 동작을 유발하거나 오류를 발생시킬 수 있기 때문에, 이러한 데이터를 사전에 검사하고 검증하는 과정이 필요합니다.
JSON 데이터의 유효성을 검사하는 작업은 문제 정의, 구현, 테스트, 검증 등의 단계를 포함하며, 이는 개발 과정에서 비용과 시간을 소모하는 작업입니다. 그러나 JavaScript와 다양한 외부 라이브러리를 활용하면 JSON 데이터의 유효성을 쉽게 검사할 수 있습니다. 다음에서는 JSON 데이터 유효성 검사의 일반적인 접근 방법을 설명하고, 이를 활용하는 방법을 구체적으로 살펴보겠습니다.
1. JSON.parse 메서드 사용
JSON.parse는 JavaScript에서 JSON 문자열을 JavaScript 객체로 변환하는 기본 메서드입니다. 이는 유효한 JSON인지 확인하는 가장 간단한 방법 중 하나입니다. JSON.parse를 사용하면 JSON 데이터가 올바른 형식으로 작성되었는지 확인할 수 있으며, 유효하지 않은 JSON일 경우 예외를 발생시켜 오류를 처리할 수 있습니다.
try {
const data = JSON.parse(jsonString);
// JSON 문자열이 유효합니다.
} catch (error) {
console.error("Invalid JSON", error);
}
위의 코드에서 jsonString은 검사하려는 JSON 문자열입니다. JSON.parse 메서드는 JSON이 올바른 형식일 경우 해당 문자열을 JavaScript 객체로 변환하고, 그렇지 않으면 catch 블록에서 오류를 처리합니다. 이 방법은 JSON 문자열의 형식 유효성만 검사할 수 있으며, 데이터의 구조나 내용에 대한 검증은 하지 않습니다.
2. JSON Schema 검증
JSON 형식만 유효한지 확인하는 것으로는 충분하지 않을 때가 많습니다. 실제로 JSON 데이터는 특정한 구조와 속성을 가져야 하며, 이러한 구조가 데이터가 정확히 어떤 형태여야 하는지 규정하는 역할을 합니다. 이를 위해 JSON Schema를 사용하여 데이터를 더 정밀하게 검증할 수 있습니다. JSON Schema는 JSON 문서의 구조를 설명하는 일종의 메타데이터로, JSON 데이터의 구조를 정의하고 유효성을 검사할 수 있습니다.
JSON Schema란?
JSON Schema는 JSON 문서가 가져야 할 속성과 데이터 타입을 정의하는 데 사용됩니다. JSON Schema를 이용하면 데이터의 형태, 필수 속성, 속성의 데이터 타입 등을 명시할 수 있으며, 이를 통해 데이터가 주어진 스키마와 일치하는지 여부를 쉽게 확인할 수 있습니다.
ajv 라이브러리 사용:
AJV(Another JSON Schema Validator)는 JSON Schema를 사용하여 JSON 데이터를 유효성 검사하는 인기 있는 JavaScript 라이브러리입니다. AJV를 통해 데이터가 스키마와 일치하는지 검증하고, 유효하지 않은 경우 오류 메시지를 제공합니다.
ajv 라이브러리의 대해 구체적인 내용을 아래 링크를 참고하시기 바랍니다.
위의 예제에서, schema는 JSON 데이터가 따라야 할 규칙을 정의하는 스키마입니다. 여기에서는 name은 문자열이어야 하고, age는 숫자여야 하며, 두 속성 모두 필수임을 명시하고 있습니다. 또한, 스키마는 추가적인 속성이 허용되지 않도록 설정되었습니다(additionalProperties: false). ajv.compile 메서드를 사용해 스키마에 따라 데이터를 검증하는 함수를 생성하고, 그 결과가 유효한지 여부에 따라 적절한 오류 처리를 합니다.
AJV는 매우 강력한 라이브러리로, 대규모 애플리케이션에서도 JSON 데이터 검증을 손쉽게 수행할 수 있습니다. 또한 AJV는 JSON Schema 표준을 준수하며, 복잡한 데이터 구조도 처리할 수 있는 유연한 기능을 제공합니다.
import Ajv from "ajv";
const ajv = new Ajv();
const schema = {
type: "object",
properties: {
name: { type: "string" },
age: { type: "number" },
},
required: ["name", "age"],
additionalProperties: false,
};
const validate = ajv.compile(schema);
const valid = validate(data);
if (!valid) {
console.error(validate.errors);
}
3. Type Checking(TypeScript 또는 PropTypes)
TypeScript와 같은 정적 타입 시스템을 사용하는 방법도 있습니다. TypeScript는 자바스크립트에 정적 타입을 추가하여 컴파일 단계에서 타입 오류를 방지하는 기능을 제공합니다. TypeScript를 사용하면 JSON 데이터의 타입과 구조를 미리 정의하고, 해당 데이터가 코드에서 올바르게 사용되는지 검사할 수 있습니다.
interface User {
name: string;
age: number;
}
const validateUser = (data: any): data is User => {
return typeof data.name === 'string' && typeof data.age === 'number';
};
const data = { name: "John", age: 30 };
if (validateUser(data)) {
console.log("Valid user");
} else {
console.error("Invalid user");
}
위의 예제에서, User라는 인터페이스를 정의하고, 데이터가 해당 인터페이스와 일치하는지 검사하는 함수를 작성했습니다. 이는 타입에 따라 데이터의 유효성을 검사하는 방식으로, 컴파일러가 코드 내에서 타입 관련 오류를 미리 감지할 수 있습니다.
React에서 컴포넌트의 속성을 검사할 때는 PropTypes를 사용할 수 있습니다. PropTypes는 React에서 제공하는 속성 타입 검증 도구로, 컴포넌트에 전달되는 props가 예상된 타입과 일치하는지 확인할 수 있습니다.
import PropTypes from 'prop-types';
function UserComponent({ name, age }) {
return (
<div>
<h1>{name}</h1>
<p>{age}</p>
</div>
);
}
UserComponent.propTypes = {
name: PropTypes.string.isRequired,
age: PropTypes.number.isRequired,
};
위의 예시에서 PropTypes는 UserComponent에 전달되는 name과 age 속성이 각각 문자열과 숫자 타입이어야 하며, 필수 속성임을 명시하고 있습니다. 이를 통해 컴포넌트에 잘못된 props가 전달될 경우 경고 메시지를 출력할 수 있습니다.
4. 유효성 검사의 유형
JSON 데이터의 유효성을 검사할 때 중요한 것은 검사하려는 "유효성"의 유형을 이해하는 것입니다. 앞서 설명한 방법들은 각각 다른 차원의 유효성을 검증합니다.
- JSON.parse는 데이터가 올바른 JSON 형식인지 여부를 검사합니다. JSON의 형식적 유효성을 확인하는 데 유용하지만, 데이터의 구조나 내용에 대한 검증은 하지 않습니다.
- JSON Schema(및 ajv)는 데이터의 구조와 속성을 검사합니다. 이는 데이터가 특정 스키마를 충족하는지 확인하는 방식으로, 보다 심층적인 유효성 검사를 제공합니다.
- TypeScript나 PropTypes는 타입 기반의 검사를 통해 데이터가 코드에서 어떻게 사용되는지 검증할 수 있습니다.
이러한 방법들을 상황에 맞게 조합하여 사용하면, JSON 데이터의 형식적 유효성뿐만 아니라 내용과 구조까지 정확히 검증할 수 있습니다.