현재 상황: 중복
웹 개발 시 동일한 기능을 구현하기 위해 서로 다른 프로그래밍 언어를 사용하는 경우가 자주 있나요?
예를 들어, 파일 업로드 기능을 사용하려면 업로드된 파일에 대한 파일 형식 제한이 필요합니다. 우리는 일반적으로 제한을 위해 접미사 이름을 사용합니다.
프런트 엔드
사용자 경험을 위해 사용자가 선택한 파일은 페이지에서 판단되며 합법적인 경우에만 사용자가 업로드할 수 있습니다.
function is_filetype(filename,types) {
types = types.split(',');
var 패턴 = '.(';
for(var i=0; iif(0 ! = i) {
pattern = '|';
}
pattern = type[i].trim()
}
pattern = ')$'
반환 RegExp(pattern , 'i').test(filename);
// 여기서 N 줄의 코드를 생략합니다
if(!is_filetype($('#uploadfile').val (), 'doc,pdf,txt,wps,odf,md,png,gif,jpg')){
can_submit = false; // 업로드가 허용되지 않습니다
$('#uploadfile').val ('') ;
alert('업로드만 허용됨: ' 상수.RESUME_FILETYPES);
}
// 여기서는 N줄의 코드가 생략되었습니다.
백엔드
악성 업로드 우려로 인해 사용자가 업로드한 파일에 대한 재심사는 불가피합니다. 그래서 Python을 사용하여 파일 접미사를 결정하는 논리를 작성했습니다.
다시 가져오기
def is_filetype(filename, type):
types = types.split(',')
pattern = '.(' '|'.join([ t.strip( ) for t in type]) ')$';
return re.search(pattern, filename, re.I) != None
# 웹 요청 핸들러
# 생략 N줄 여기에 코드
이렇게 작업이 중복되는 이유는 무엇인가요?
1. 프론트엔드는 절대 신뢰할 수 없습니다.
2. 프론트엔드와 백엔드는 서로 다른 프로그래밍 언어를 사용합니다.
이러한 중복의 비용은 얼마입니까?
1. 비즈니스 로직을 수정하고 두 번 반복해야 합니다. 갑자기 docx 파일 형식이 지원되지 않는 경우 자바스크립트 코드와 Python 코드를 동시에 수정해야 합니다.
2. 자바스크립트 코드와 파이썬 코드의 비즈니스 로직이 일관성을 유지하도록 하는 데 드는 비용입니다. 두 가지 유형의 테스트를 별도로 작성해야 하며, 단위 테스트 실행 시간이 두 배로 늘어납니다.
nodejs 시대: DRY
더 이상
nodejs를 사용하지 마세요 DRY !하나의 코드, 프런트엔드와 백엔드가 동시에 실행됩니다
// Constant.js
(function(exports){
imports.RESUME_FILETYPES = 'doc,docx, pdf,txt,wps,odf,md,png,gif,jpg'
})( (function(){
if(내보내기 유형 === '정의되지 않음') {
window .constant = {};
return window.constant;
} else {
return 내보내기;
})()
// util.js
(function(exports){
/**
* 문자열 양쪽 끝의 공백 문자를 제거합니다.
*
* @return {String}
* @api public
*/
String.prototype.trim = function(){
이것을 반환 .replace(/(^s*) |(s*$)/g, "");
/**
* 파일이 사용자 정의 유형인지 확인
*
* @param {String}filename
* @param {String} 유형, 여러 유형은 doc, docx, txt
* @return {Boolean} true 또는 false
* @api public
*/
var is_filetype =exports.is_filetype = function(파일 이름, 유형) {
types = 유형.split(',');
var 패턴 = '.(';
for(var i=0; iif(0 ! = i) {
pattern = '|';
}
pattern = 유형[i].trim()
}
pattern = ' )$';
return new RegExp(pattern, 'i').test(filename);
}
})( (function(){
if(수출 유형 = == '정의되지 않음') {
window.util = {};
window.util 반환
} else {
내보내기 반환
})() );
프론트엔드
코드 복사
if (!util.is_filetype($('#uploadfile').val(), Constant.RESUME_FILETYPES)){
can_submit = false; allowed
$('#uploadfile').val(' ');
alert('업로드만 허용됨: ' Constant.RESUME_FILETYPES)
}
// 여기서는 N 줄의 코드가 생략됩니다.
백엔드
코드 복사
코드는 다음과 같습니다.
var util = require('./public/js/util.js'),
constant = require('./public/js/constant.js')
app.post ('/resume/upload/:job_id', function(req, res, next){
req.form.complete(function(err, fields, files){
if(!util.is_filetype(filepath, Constant.RESUME_FILETYPES)) {
// 클라이언트가 판단했기 때문에 이 상황은 악의적으로 업로드됩니다.
res.send('파일 형식 오류: ' filepath
' 에 파일을 업로드하십시오. ' 상수.RESUME_FILETYPES ' 형식');
return;
}
// 파일 저장 ...
// 여기서는 N 줄의 코드가 생략됩니다
} );
와, 더 이상 중복이 없습니다! done
기타 일반적인 시나리오
상수 정의
문자열 작업과 같은 다양한 유용한 도구 모듈