오류내용

1. 선택이 안됨

2. RadioGroup의 value을 렌더링 후에 넣는 경우 오류 발생

원인 및 해결

1. Radio의 value가 문자열이 아니었음

2. RadioGroup 내에서 Radio를 반복문으로 출력하면서 value을 알 수 있는 상황이었는데, 임시방편으로 먼저 리스트에서 value 값을 find해놓고 설정해줌

오류내용

1. 대용량 다운안됨

2. ERR_RESPONSE_HEADERS_MULTIPLE_CONTENT_DISPOSITION

해결방법

대용량 파일 다운로드 - 버퍼 삭제

크롬계열브라우저 다운안될때 - 파일명을 따옴표로 묶지 않기

풀소스

Response.Expires = 0
Response.Clear

Set fs = Server.CreateObject("Scripting.FileSystemObject")
If fs.FileExists("파일풀패스") Then
	user_agent = Request.ServerVariables("HTTP_USER_AGENT")
	'If Instr(user_agent,"Chrome") = 0 Then ' 크로미움이 아닐때만
	'	Response.AddHeader "Content-Disposition", "attachment;filename="""&파일명&""""   '큰따옴표 처리
	'End If
	Response.ContentType = "파일MIME타입"
	Response.AddHeader "Content-Disposition","attachment; filename="&파일명

	Response.AddHeader "Content-Transfer-Encoding","binary"
	Response.AddHeader "Pragma","no-cache"
	Response.AddHeader "Expires","0"
	
	Set objStream = Server.CreateObject("ADODB.Stream")
	objStream.Open
	objStream.Type = 1
	objStream.LoadFromFile "파일풀패스"
	
	Const CHUNK = 2048000
	Response.Buffer = False
	Response.ContentType = fileType
	Do Until objStream.EOS Or Not Response.IsClientConnected
		Response.BinaryWrite(objStream.Read(CHUNK))
	Loop
	objStream.Close
	
	Set strFile = Nothing
	Set objStream = Nothing

Else 
	'파일이 없을 경우...
	Response.Write "해당 파일을 찾을 수 없습니다."
End If

Set fs = Nothing
Response.End

200메가 넘는 파일도 잘 받아진다

오류내용

Caused by: org.springframework.data.mapping.PropertyReferenceException: No property

해결

JpaRe, Custom, Jpa Imple 파일명이 달라서 생긴 문제였다.

1. cmd

2. diskpart

3. list disk

4. select disk ?

5. attributes disk clear readonly

출처: blog.naver.com/50after/220920780654

설치 innologica.github.io/vue2-daterange-picker/#installation :무사히 완료

npm i vue2-daterange-picker --save
or
yarn add vue2-daterange-picker

가장 기본 용법인 이건 된다.

// 컴포넌트 등록
import DateRangePicker from 'vue2-daterange-picker'
import 'vue2-daterange-picker/dist/vue2-daterange-picker.css'

Vue.component('DateRangePicker', DateRangePicker)


// 실사용
<template>
  <date-range-picker
    v-model="daterange" 
    :locale-data="{
      direction: 'ltr',
      firstDay: 0,
      format: 'yyyy-mm-dd',
      separator: ' - ',
      applyLabel: '확인',
      cancelLabel: '취소',
      weekLabel: '주',
      customRangeLabel: '기간',

      daysOfWeek: ['일', '월', '화', '수', '목', '금', '토'],
      monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
     }"
  />
</template>
<script>
import DateRangePicker from 'vue2-daterange-picker'
</script>

근데, 나는 props의 디폴트 값이 마음에 들지 않았다.

그리고 혼자 오해를 했다. 용법 innologica.github.io/vue2-daterange-picker/#usage : Register the component 이걸 하면 default props를 overriding 해줄거라고

내 잘못이 맞긴 한데 내가 파악한 구조상으로는 default props를 설정하려면 DateRangePicker.vue를 새로 만들던가 해야 할 것 같다. 기존 거 고쳐봤자 업데이트하면 날라갈 것 같으니 말이다.

그리고 매뉴얼이 진짜 불친절하다 props이름이랑 밑에 설명이랑 매칭이 바로 바로 안되서 일일히 _넣어서 확인해봐야했다.

시간도 버렸고 안 쓰기로 했지만 또 언젠가 쓰게 될지도 모르니까 오늘 정리한 것은 기록으로 남겨두겠다.

node_modules\vue2-daterange-picker\dist\vue2-daterange-picker.css에서 나는 문제가 있어서 수정한 부분은 아래와 같다.

// original
.daterangepicker.openscenter[data-v-7d8c7845]{
    ...
    left:50%;
    ...
}

// modify
.daterangepicker.openscenter[data-v-7d8c7845]{
    ...
    left:100%;
    ...
}

매뉴얼 중 props 관련하여 이름순 말고 관련있는 설정끼리 묶어봤다.

/** 날짜 설정과 관련된 옵션 **/
:minDate [String, Date], // 최소
:maxDate [String, Date], // 최대
:localeData Object,  // 로케일 데이터 포함한 객체
:dateRange [Object], // v-model prop에서 사용함 startDate와 endDate 를 포함하는 객체여야며 Date로 파싱할 수 있는 문자열이어야 함
:dateFormat Function, 
// function(classes, date) - 2 개의 매개 변수를받는 특수한 prop 유형 함수:
// "classes" - 컴포넌트의 로직이 정의한 클래스,
// "date" - 현재 처리 된 날짜.
// 렌더링 된 날짜에 적용 할 Vue 클래스 객체를 반환해야 함.


/** input 상태 관련 **/
:disabled Boolean, // 비활성화 상태
:readonly Boolean, // readonly 여부


/** input class명 관련 **/
:controlContainerClass [Object, String], // class명

/** 달력 모양 관련 **/
:ranges [Object, Boolean], // 오늘, 어제, 이번달, 올해, 지날달 범위 선택으로 뜨는것. 숨기려면 false로 설정할 수 있음
:opens String, // :ranges 목록의 위치를 지정하는 것임 "center", "left", "right", "inline"라는데 제대로 동작 안한다

:showWeekNumbers Boolean, // 주수표시
:showDropdowns Boolean, // 달력 위에 월 및 연도 선택에 대한 드롭 다운을 표시
:alwaysShowCalendars Boolean, // false로 설정하고 미리 정의 된 범위 중 하나를 선택하면 달력이 숨겨진다고 함
:singleDatePicker [Boolean, String], // 단일 캘린더만 표시

:timePicker Boolean, // 달력 아래에 시간 (시간 / 분) 선택에 대한 드롭 다운을 표시
:timePickerIncrement Number, // 분 드롭 다운에서 분 단위
:timePicker24Hour Boolean, // 24시간제 여부
:timePickerSeconds Boolean, // 시/분을 제외한 초를 선택

:appendToBody Boolean, // 드롭 다운 요소를 본문 끝에 추가하고 동적으로 크기 / 위치를 지정할지 여부
:calculatePosition Function, // appendToBody true일 경우 설정함


/** 달력 이벤트 관련 **/
:linkedCalendars Boolean, // 달력선택 연동
:autoApply Boolean, // 선택한 범위를 자동으로 적용
:closeOnEsc Boolean, // esc키로 드롭다운을 닫을 지 여부

여기까지만 봐서 정리도 여기까지만 한다.

1. javascript에서 페이지 이동을 할 수 있도록 빼놨는지 확인을 해봤음

페이지이동 스크립트만 js에 남아있고, 링크주소 조차 swf에 있는듯 했음

2. 여러 디컴파일을 확인해보다가 no|wrap.de - Flare를 알게됨 설치후 swf 파일과 연결되면 액션스크립트 파일만 반환해줬음 확장자는 fla

이 파일을 확인하니 예상대로 경로가 다 들어있어서 각각의 메뉴 주소를 파악완료함

swf를 위해서 다양한 것을 찾아보다가 이런 곳을 발견함

vidkidz.github.io/

가지고 있는 swf 파일을 에뮬레이터로 재생시켜주는 듯함

단, 메뉴 swf는 재생만 될 뿐 링크가 동작하진 않았음

1. 특정 ip나, 소수의 ip 대역대만 차단하는 방법

- 서버관리자 > 관리 > 역할 및 기능 추가 마법사 > 서버선택 > 서버역할 > 웹 서버(IIS) > 웹 서버 > 보안 > IP 및 도메인 제한 선택 후 설치

- IIS 관리자 > 좌측에서 사이트에서 해당 사이트 선택 > 우측 아이콘 중 IP 주소 및 도메인 제한 선택 > 우측 사이드 바에 거부항목 추가

2. 국가 단위로 IP 차단하는 방법

출처: www.gregsitservices.com/blog/2016/02/blocking-unwanted-countries-with-windows-firewall/

- 출처 스텝2의 파워쉘 스크립트를 다운로드 받는다. 85번째 줄을 주석처리한다. 삭제해도 무방하다.

#if ($currentrules.count -lt 3) {"`nProblem getting a list of current firewall rules, quitting...`n" ; exit } 

- 스텝3에서 말하는 www.ipdeny.com/ipblocks/ 에서 블록킹하고 싶은 나라의 ip를 받는다. 스크립트로 등록할때 파일명을 기반으로 방화벽 룰 이름을 등록하기 때문에 나라이름 약어를 풀네임으로 변경해두는 것을 권장한다.

- 파워쉘 스크립트와 ip 대역을 받은 것을 같은 폴더에 두고 커맨드 창에서 다음과 같이 실행한다.

> Import-Firewall-Blocklist.ps1 -inputfile china.zone.txt

- 혹시 안된다면 커맨드 창을 관리자모드로 실행해서 다시 해본다.

- ip 대역대를 업데이트하는 방법은 다시 새로 받아서 진행하면 된다.

- 차단한 것을 삭제하는 방법은 다음과 같다라고 했는데 내가 뭘 잘못했는지 방화벽에서 찾아서 지움

> Import-Firewall-Blocklist.ps1 -inputfile china.zone.txt -deleteonly

혹시 모르니까 소스 보관용으로 스크립트 파일이랑 중국, 북한, 러시아, 남한, 미국 zone파일을 동봉했다.

1. Korean Language Pack for Visual Studio Code

한국어팩

2. Auto Rename Tag

이름 그대로임. 오픈 태그를 수정하면 닫는 태그도 자동으로 수정해준다.

3. Bracket Pair Colorizer 2

괄호 색깔이 짝 맞춰 컬러플하다

4. indent-rainbow

같은 indent인 것들끼리 색으로 쉽게 확인 가능하고 들여쓰기가 잘 된 경우 빨간색으로 표시된다.

5. Prettier - Code formatter

프로젝트의 소스 포맷을 통일하기 좋다

6. ESLint

코드 리뷰해준다.

7. CSS Peek

css 셀렉터 찾기 좋다.

8. Debugger for Chrome

크롬으로 개발한다면 필요함

9. vscode-icons

확장자별로 아이콘 표시가 명확하다.

// 숫자 배열

const arr = [5, 2, 6, 11, 8, 20];

// 오름차순
arr.sort(function(a, b) {
    return a - b;
});

// 내림차순
arr.sort(function(a, b) {
    return b - a;
});

// 문자 배열

const arr = ['cherry', 'peach', 'strawberry', 'apple'];

// 오름차순
arr.sort();

// 내림차순
arr.sort(function(a, b) {
	return (a > b)? -1 : ((a < b)? 1 : 0);
});

// 객체 배열

const arr = [
  { key: 10, value: '휴대폰' },
  { key: 5, value: '이어폰' },
  { key: 21, value: '가방' },
  { key: 8, value: '보조배터리' },
  { key: 16, value: '전화기' },
];

// 객체 내 숫자 기준
arr.sort(function(a, b) {
    return a.key - b.key;
});

// 객체 내 문자열 기준
arr.sort(function(a, b) {
	return (a.value > b.value)? -1 : ((a.value < b.value)? 1 : 0);
});

마우스 우클릭

터치패드 손가락 2개