직렬화는 데이터 구조나 객체를 동일하거나 다른 컴퓨터 환경에 저장하고, 나중에 재구성할 수 있는 포맷으로 변환하는 과정이다. 직렬화한 데이터를 다시 추출하는 과정은 역직렬화 라고 한다.
자바스크립트에서 직렬화를 하기 위해 node-serialize 라는 모듈을 사용하겠다.
serialize() 함수를 통해 직렬화를 진행하고, unserialize() 함수를 통해 역직렬화를 진행한다.
| [NodeJS] 접속자 아이피 가져오기 (0) | 2020.11.19 |
|---|---|
| [Javascript] IIFE (0) | 2020.10.28 |
| [Javascript] 사칙연산 계산기 (0) | 2020.08.21 |
| [PHP] isset() (0) | 2020.06.14 |
| [PHP] PDO로 데이터베이스(mysql) 연결 (0) | 2020.06.14 |
IIFE는 즉시 실행 함수 표현을 의미한다.(Immediately Invoked Function Expression)
정의되자마자 즉시 실행되는 함수를 말한다.
함수 전체를 괄호()로 감싸고 즉시 실행 함수를 생성하는 괄호()를 붙이면 자바스크립트 엔진은 함수를 즉시 해석하여 실행한다.
ex)
(function hi(){
console.log('hi');
})();
| [NodeJS] 접속자 아이피 가져오기 (0) | 2020.11.19 |
|---|---|
| [Javascript] serialization(직렬화) (0) | 2020.11.04 |
| [Javascript] 사칙연산 계산기 (0) | 2020.08.21 |
| [PHP] isset() (0) | 2020.06.14 |
| [PHP] PDO로 데이터베이스(mysql) 연결 (0) | 2020.06.14 |
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CALC</title>
<script>
// 숫자와 연산기호 입력
function input_num(calc_num){
document.getElementById("formula").value += calc_num;
}
// 사칙연산 수행
function calculate(result){
var formula = document.getElementById("formula").value;
result = eval(formula);
document.getElementById("result").value = result;
}
// 초기화
function reset(){
document.getElementById("formula").value = null;
document.getElementById("result").value = null;
}
</script>
</head>
<body>
<div align='center'>
<input type="text" name="formula" id="formula" size="30"><br> <!-- size:30 == 180pt -->
<input type="text" name="result" id="result" size="30"><br>
<input type="button" value="초기화" style="width: 90pt;" onclick="reset()">
<input type="button" value="=" size="15" id="result_btn" style="width: 90pt;" onclick="calculate()"><br>
<input type="button" style="width: 45pt;" id="btn" value="7" onclick="input_num('7')">
<input type="button" style="width: 45pt;" id="btn" value="8" onclick="input_num('8')">
<input type="button" value="9" style="width: 45pt;" id="btn" onclick="input_num('9')">
<input type="button" value="+" style="width: 45pt;" id="btn" onclick="input_num('+')"><br>
<input type="button" value="4" style="width: 45pt;" id="btn" onclick="input_num('4')">
<input type="button" value="5" style="width: 45pt;" id="btn" onclick="input_num('5')">
<input type="button" value="6" style="width: 45pt;" id="btn" onclick="input_num('6')">
<input type="button" value="-" style="width: 45pt;" id="btn" onclick="input_num('-')"><br>
<input type="button" value="1" style="width: 45pt;" id="btn" onclick="input_num('1')">
<input type="button" value="2" style="width: 45pt;" id="btn" onclick="input_num('2')">
<input type="button" value="3" style="width: 45pt;" id="btn" onclick="input_num('3')">
<input type="button" value="*" style="width: 45pt;" id="btn" onclick="input_num('*')"><br>
<input type="button" value="0" style="width: 60pt;" id="btn" onclick="input_num('0')">
<input type="button" value="." style="width: 60pt;" id="btn" onclick="input_num('.')">
<input type="button" value="/" style="width: 60pt;" id="btn" onclick="input_num('/')"><br>
</div>
</body>
</html>
| [Javascript] serialization(직렬화) (0) | 2020.11.04 |
|---|---|
| [Javascript] IIFE (0) | 2020.10.28 |
| [PHP] isset() (0) | 2020.06.14 |
| [PHP] PDO로 데이터베이스(mysql) 연결 (0) | 2020.06.14 |
| [PHP] phpinfo (0) | 2020.06.12 |
화살표 함수: 화살표 기호(=>)를 이용하여 함수를 작성하는 방법. 기존 함수보다 단순하고 간결한 문법으로 함수를 만들 수 있다.
let sum (a,b) => a + b; //화살표함수
let sum = function(a, b){ //원래 함수
return a+b;
};
| [PHP] PDO로 데이터베이스(mysql) 연결 (0) | 2020.06.14 |
|---|---|
| [PHP] phpinfo (0) | 2020.06.12 |
| [JavaScript] 함수 표현식과 함수 선언문 (0) | 2020.01.27 |
| [JavaScript] confirm() (0) | 2020.01.27 |
| [JavaScript] prompt() (0) | 2020.01.26 |
// 함수 선언문
function sum(a, b){
return a+b;
}// 함수 표현식
let sum = function(a, b){
return a+b;
};함수 선언문은 스크립트 실행 준비 단계에서 생성되기 때문에 함수 선언문의 앞에서도 호출이 가능하나 함수 표현식은 코드의 순서대로 순차적으로 생성 되어 표현식이 선언된 후에만 접근할 수 있다.
| [PHP] PDO로 데이터베이스(mysql) 연결 (0) | 2020.06.14 |
|---|---|
| [PHP] phpinfo (0) | 2020.06.12 |
| [JavaScript] 화살표 함수 (0) | 2020.02.02 |
| [JavaScript] confirm() (0) | 2020.01.27 |
| [JavaScript] prompt() (0) | 2020.01.26 |
confirm : 매개 변수로 받은 질문과 확인 및 취소 버튼이 있는 창을 띄우는 함수
확인을 누르면 참(true), 취소를 누르면 거짓(false)를 반환.
confirm('Are you female??')
| [PHP] PDO로 데이터베이스(mysql) 연결 (0) | 2020.06.14 |
|---|---|
| [PHP] phpinfo (0) | 2020.06.12 |
| [JavaScript] 화살표 함수 (0) | 2020.02.02 |
| [JavaScript] 함수 표현식과 함수 선언문 (0) | 2020.01.27 |
| [JavaScript] prompt() (0) | 2020.01.26 |
JSON(JavaScript Object Notation)
json은 "속성 - 값" 또는 "키 - 값" 쌍으로 이루어진 데이터 오브젝트를 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷이다. AJAX, XML 등을 대체하며 .json 확장자를 가진다.
JSON 기본 자료형
자료형으로는 number, string, boolean, array, object, null 이 있다. 다음은 이 자료형 들의 특징이다.
number : 8진수, 16진수, 표현 방법은 지원하지 않는다.
string : 항상 큰따옴표(")로 묶어야 하고, 역슬래시(\)는 제어 문자를 표현한다.
array : 대괄호[]로 나타내며, 각 요소들은 (,)로 구분한다. 요소간의 순서에 의미가 있다.
object : 순서가 없는 "이름-값" 쌍의 집합으로 이름은 항상 string 자료형이다. 중괄호{}를 사용한다.
JSON 객체 예시 ( 키-값 패턴으로 표기)
{
"이름": "phulasso",
"나이": 18,
"성별": "남",
"주소": "경기도 수원시",
}
JSON 장점
문제 설명을 보면 자바스크립트 게임이고, 시스템을 우회하여 클리어 할 수 있냐고 물어보는 것 같다.
문제 페이지를 보면 어떤 게임을 할 수 있는 것 같다.
게임을 플레이 해 보면 31337점을 얻어야 게임을 클리어 할 수 있을 것 같다.
소스코드를 보면 다음과 같이 난독화된 자바스크립트 코드를 확인할 수 있다.
https://beautifier.io/ 라는 사이트에서 자바스크립트 코드의 난독화를 해제할 수 있다.
코드를 잘 살펴보다 보면 다음과 같이 score 값을 조작할 수 있는 부분을 발견할 수 있게 된다.
저기에 BTunnelGame['getScore']() 를 지우고 목표 점수인 31337으로 수정한후
전체 코드를 웹 페이지의 콘솔창에 입력한 후 게임을 실행하면 게임오버시 플래그를 얻을 수 있다.
알게된 점 : 자바스크립트 코드 난독화를 해제하는 사이트
| [Wargame.kr] DB is really GOOD (0) | 2019.09.02 |
|---|---|
| [Wargame.kr] md5 password (0) | 2019.08.29 |
| [Wargame.kr] WTF_CODE (0) | 2019.08.27 |
| [Wargame.kr] login filtering (0) | 2019.08.25 |
| [Wargame.kr] QR CODE PUZZLE (0) | 2019.08.25 |