source

JavaScript: 클라이언트 측과 서버 측 검증

factcode 2022. 11. 15. 21:28
반응형

JavaScript: 클라이언트 측과 서버 측 검증

클라이언트측과 서버측 중 어느 쪽이 검증하는 것이 좋습니까?

현재 사용하고 있는 상황에서는

  • jQuery와 MVC
  • JSON 데이터는 View와 컨트롤러 간에 전달됩니다.

대부분의 검증은 사용자가 데이터를 입력할 때 데이터를 검증하는 것입니다.를 들면, 「」를하고 있습니다.keypress 않도록 하는 , 최대 수 및 내에 합니다.event : 스트 、 event event 、 event event event event 。

클라이언트 측보다 서버 측 검증을 실시하면 어떤 이점이 있는가 하는 것이 더 좋은 질문이라고 생각합니다.


멋지다, 모든 사람에게 대답한다.당사의 웹사이트는 패스워드로 보호되고 있으며 소규모 사용자(50 미만)를 대상으로 하고 있습니다.만약 그들이 JavaScript를 실행하고 있지 않다면 닌자를 보내드리겠습니다.하지만 만약 우리가 모두를 위한 사이트를 설계한다면, 나는 양쪽에서 검증을 하는 것에 동의할 것이다.

남들이 말한 것처럼 둘 다 해야 해요.이유는 다음과 같습니다.

클라이언트 측

평균 사용자에게 나은 피드백을 제공할 수 있기 때문에 먼저 클라이언트 측 입력의 유효성을 확인해야 합니다.예를 들어 잘못된 전자 메일 주소를 입력하고 다음 필드로 이동한 경우 오류 메시지를 즉시 표시할 수 있습니다.그러면 사용자가 양식을 제출하기 전에 모든 필드를 수정할 수 있습니다.

서버에서만 검증할 경우 폼을 전송하고 오류 메시지를 받은 후 문제를 추적해야 합니다.

(이 문제는 서버에서 사용자의 원래 입력을 사용하여 폼을 다시 렌더링함으로써 완화되지만 클라이언트 측 검증은 여전히 더 빠릅니다.)

서버측

서버측에서 검증하는 것은 JavaScript를 쉽게 무시하고 위험한 입력을 서버에 제출할 수 있는 악의적인 사용자로부터 보호할 수 있기 때문입니다.

UI를 신뢰하는 것은 매우 위험합니다.사용자 UI를 악용할 수 있을 뿐만 아니라 사용자 UI나 브라우저를 전혀 사용하지 않을 도 있습니다.사용자가 URL을 수동으로 편집하거나 자체 Javascript를 실행하거나 다른 도구로 HTTP 요청을 수정하면 어떻게 됩니까?커스텀 HTTP 요구를 송신하는 경우는,curl를를들 ?어 본? ???

(이것은 이론적인 것이 아닙니다.를 들어, 저는 여러 협력 항공사, 버스 회사 등에 사용자가 검색한 내용을 사용자가 각 회사의 검색 양식에 기입한 것처럼 전송하여 다시 전송하고, 모든 결과를 수집하여 분류하는 여행 검색 엔진을 개발했습니다. 회사의 폼 JS는 실행되지 않았고, 반환된 HTML로 에러 메시지를 제공하는 것이 매우 중요했습니다.물론 API도 좋았지만, 이것이 우리가 해야일이었습니다.)

이를 허용하지 않는 것은 보안의 관점에서 순진할 뿐만 아니라 비표준적입니다.클라이언트는 원하는 수단을 사용하여HTTP를 송신할 수 있어야 하며, 사용자는 올바르게 응답해야 합니다.여기에는 검증도 포함됩니다.

서버측 검증은 호환성에 있어서도 중요합니다.브라우저를 사용하고 있어도, 모든 유저가 JavaScript 를 유효하게 하는 것은 아닙니다.

부록 - 2016년 12월

검증은 서버측 어플리케이션코드에서도 제대로 수 없고, 데이터베이스의 현재 상태에 따라 다르기 때문에 클라이언트측 코드에서는 전혀 할 수 없는 도 있습니다.예를 들어 "다른 사용자가 해당 사용자 이름을 등록하지 않은 경우", "코멘트하고 있는 블로그 게시물이 아직 존재합니다", "요청한 날짜에 중복되는 기존 예약이 없습니다", "고객님의 계정 잔액은 아직 해당 구매를 처리할 수 있습니다." 등입니다.데이터베이스만이 관련 데이터에 의존하는 데이터를 신뢰성 있게 검증할 수 있습니다.개발자들은 정기적으로 이것을 망치지만, Postgre는SQL은 몇 가지 뛰어난 솔루션을 제공합니다.

네, 클라이언트 측 검증은 항상 완전히 우회할 수 있습니다.보다 나은 사용자 경험을 제공하기 위해서는 클라이언트 측과 서버 측을 모두 수행해야 합니다.또한 입력이 클라이언트에 의해서만 검증되는 것이 아니라 실제로 검증되는 것을 확인할 수 있습니다.

다시 한 번 말씀드리지만, 매우 중요하기 때문입니다.

서버에서 항상 검증

사용자 응답성을 위해 JavaScript를 추가합니다.

클라이언트측 검증보다 서버측 검증을 실시하는 이점은 클라이언트측 검증을 바이패스/조작할 수 있다는 것입니다.

  • 최종 사용자가 javascript를 끌 수 있습니다.
  • 사용자 지정 앱을 사용하여 사용자 사이트를 사용하지 않는 사용자가 직접 서버로 데이터를 전송할 수 있습니다.
  • 페이지의 Javascript 오류(여러 가지 원인으로 인해 발생)로 인해 유효성 검사가 일부(전부는 아님) 실행될 수 있습니다.

즉, 항상 서버측을 검증한 후 클라이언트측 검증을 추가 "추가"로 간주하여 최종 사용자 경험을 향상시킵니다.

서버상에서 항상 검증할 필요가 있습니다.

또, 클라이언트상에서 검증을 실시하는 것은 유저에게 있어서 좋은 일이지만, 전혀 안전하지 않습니다.

아직 대답할 여지가 좀 있어요

Rob과 Nathan의 답변과 더불어 클라이언트 측의 검증이 중요하다고 덧붙입니다.웹 양식에 유효성 검사를 적용할 때는 다음 지침을 따라야 합니다.

클라이언트 측

  1. 웹 사이트의 정품 사용자로부터 수신된 진짜 요청을 필터링하려면 클라이언트 측 검증을 사용해야 합니다.
  2. 서버측 처리중에 발생할 가능성이 있는 에러를 줄이려면 , 클라이언트측의 검증을 사용할 필요가 있습니다.
  3. 대역폭과 사용자별 요구를 절약하기 위해 서버 측 라운드 트립을 최소화하기 위해 클라이언트 측 검증을 사용해야 합니다.

서버측

  1. 클라이언트 측에서 정상적으로 수행된 검증이 100% 완벽하다고 가정해서는 안 됩니다.사용자 수가 50명 미만이어도 상관없습니다.어떤 사용자/구성원이 '악당'으로 변질되어 적절한 검증이 이루어지지 않은 상태에서 유해한 활동을 하는지 알 수 없습니다.
  2. 이메일 주소, 전화번호 또는 유효한 입력을 확인하는 데 있어 완벽하다고 해도 매우 유해한 데이터가 포함되어 있을 수 있습니다.올바른지 아닌지에 관계없이, 서버측에서 필터링 할 필요가 있습니다.
  3. 클라이언트측 검증이 바이패스 되어 있는 경우, 서버측 검증은 서버측 처리의 잠재적인 손상으로부터 보호합니다.최근 SQL Injections와 다른 종류의 기술에 대한 많은 이야기를 들었습니다. 이러한 기술들은 몇 가지 나쁜 이점을 얻기 위해 적용될 수 있습니다.

두 유형의 검증 모두 각각의 범위에서 중요한 역할을 하지만 가장 강력한 검증은 서버 측입니다.한 번에 10,000명의 사용자를 수신할 경우 웹 서버에 들어오는 요청 수를 필터링할 수 있습니다.잘못된 이메일 주소와 같은 오류가 하나라도 발견되면 다시 양식을 게시하고 사용자에게 수정하도록 요청합니다. 그러면 서버 리소스와 대역폭이 확실히 소모됩니다.javascript validation을 적용하는 것이 좋습니다.javascript가 비활성화되면 서버측 검증이 복구됩니다.웹사이트의 99.99%가 javascript를 사용하고 있으며 최신 브라우저에서는 이미 활성화 되어 있기 때문에 실수로 비활성화된 사용자는 거의 없을 것입니다.

서버측 검증을 실시해, 각 필드의 검증 결과를 포함한 JSON 오브젝트를 반송할 수 있습니다.클라이언트 Javascript를 최소한으로 억제(결과만 표시)해, 클라이언트와 서버 양쪽에서 반복할 필요는 없습니다.

클라이언트 측에서는 HTML5 입력 유형 및 패턴 속성사용하여 기본적인 검증을 실시해야 합니다.이는 보다 나은 사용자 경험을 얻기 위한 점진적인 확장에만 사용되기 때문입니다(< IE9 및 safari에서는 지원되지 않지만 이러한 검증에 의존하지 않는 경우에도 마찬가지입니다.다만, 메인 검증은 서버측에서 실시할 필요가 있습니다.

클라이언트와 서버 양쪽의 검증을 실시해, 프로젝트의 시큐러티를 강화할 것을 제안합니다만, 어느쪽인가를 선택할 필요가 있는 경우는, 서버측의 검증을 실시합니다.

https://web.archive.org/web/20131210085944/http://www.webexpertlabs.com/server-side-form-validation-using-regular-expression/ 에서 관련 정보를 찾을 수 있습니다.

나는 총체적, 체계적, 무작위적 오류를 구별하는 흥미로운 연결고리를 발견했다.

Client-Side validation총체적 오류 및 무작위 오류를 방지하는 데 완벽하게 적합합니다.일반적으로 모든 입력의 최대 길이입니다.서버측 검증 규칙을 모방하지 않고, 독자적인 종합적인 경험치 검증 규칙(클라이언트측에서는 200자, 특정)을 제공합니다.n서버 측에서 강력한 비즈니스 규칙에 따라 지정된 문자 수는 200자 미만입니다).

Server-side validation시스템 오류를 방지하는 데 매우 적합합니다.비즈니스 규칙을 적용합니다.

제가 관여하고 있는 프로젝트에서는 서버 상에서 ajax 요청을 통해 검증이 이루어집니다.클라이언트에 에러 메세지가 표시됩니다.

추가 판독치: 총오류, 체계오류, 무작위오류:

https://answers.yahoo.com/question/index?qid=20080918203131AAEt6GO

JavaScript는 런타임에 수정할 수 있습니다.

서버상에 검증 구조를 만들어 클라이언트와 공유하는 패턴을 제안합니다.

양쪽에 별도의 검증 로직이 필요합니다.다음은 예를 제시하겠습니다.

"required"속성inputs클라이언트측

field.length > 0서버측

그러나 동일한 검증 규격을 사용하면 양쪽에서 미러링 검증의 이중화(및 오류)가 일부 제거됩니다.

클라이언트측의 데이터 검증은, 유저 익스피리언스의 향상에 도움이 됩니다.예를 들어, E-메일 주소를 잘못 입력한 유저는, 리모트 서버에 의해서 요구가 처리되어 오타가 검출될 때까지 기다리지 말아 주세요.

단, 공격자는 클라이언트 측 검증을 우회할 수 있기 때문에(또한 브라우저를 전혀 사용하지 않을 수도 있습니다), 서버 측 검증이 필요하며, 이는 악의적인 사용자로부터 백엔드를 보호하기 위한 실제 게이트여야 합니다.

가벼운 검증을 실시하는 경우는, 클라이언트상에서 실시하는 것이 최선입니다.그러면 네트워크 트래픽이 저장되므로 서버의 성능이 향상됩니다.데이터베이스나 패스워드 등으로부터 데이터를 꺼낼 필요가 있는 검증이 복잡한 경우는, 데이터를 안전하게 확인할 수 있는 서버상에서 검증하는 것이 최선입니다.

언급URL : https://stackoverflow.com/questions/162159/javascript-client-side-vs-server-side-validation

반응형