2017년 11월 28일 화요일
js 유효성? 뭔지모를 문제점과 해결책
예전에 비트할때에도 웹 jsp의 이상한 구조로 인해 고통받았었는데,
(페이지 로딩 전과 후의 문제로 인해 함수의 작동 유무 따위의)
다시 그 고통속에서 해엄치고 있습니다.
우선, js 뿐만 아니라 다른곳에서도 비슷한 일이 있던걸로 아는데, 다시한번 나타난 문제로,
var text = '<span id="testspan" onclick="Foo()"'>hello</>';
의 경우입니다.
innerHTML 혹은 append 따위를 이용하기 위해 만든 변수인데, 작동상에 문제가 없습니다.
하지만, Foo함수 안에 파라메터를 입력할때에 문제가 발생했습니다.
ajax통신,
success(value):
var text = '<span id="testspan" onclick="Foo( ? )"'>hello</>';
document.getElementByid('testDiv').innerHTML=text;
function Foo(value){
console.log(value);
}
에서 ? 의 케이스 입니다.
처음 생각했을 때에는
var text = '<span id="testspan" onclick="Foo('+value+')"'>hello</>';
로 생각을 했었으며, 결과적으로
value function은 선언되지 않았따는 오류를 띄웠습니다.
var text = '<span id="testspan" onclick="Foo("'+value+'")"'>hello</>';
를 시도했을떄는 위치를 알 수 없는 신텍스 에러가 났습니다.
문제점은 double quota 였습니다. onclick 시 이미 쌍따움표를 이용해 들어갔는데, 내부에서 다시 쌍따움표로 막혔기 때문에, 이후 모든 syntax들이 꼬이게 되었습니다.
Foo함수 내부의 parameter에서 double quota 를 읽지 않게 하면 됩니다.
이를 예전에 유효성 관련 과제로 처리하는게 있었는데.. 아무튼
js의 케이스에서 " 를 무시시키는 것은 간단히 \ 를 쓰는것으로 해결되었습니다.
var text = '<span id="testspan" onclick="Foo(\"'+value+'\")"'>hello</>';
보고 속이 울렁거리는걸 꾹 참고 정독해 보면, double quota 가 필요하나, 읽지 않아야 할 부분 앞에는 \ 가 붙어있음을 볼 수 있습니다.
2017년 11월 21일 화요일
c 룰렛게임?
죄수 n ( 1이상 1000이하) 명, 회전 횟수 k ( 1이상 n 이하)가 있으며,
시작지점 0번째 실린더 위치를 p, k만큼 실린더가 돕니다.
선택된 실린더 p의 죄수는 처형당하며, 사라진 죄수의 다음 위치에 p가 설정됩니다.
이 작업이 반복되면서, 마지막 남은 죄수가 몇번째 인가, 그리고 처형된 순서대로 로그에 남기는 문제입니다.
이주짜리 과제...2주나?
단일 소스 코드로, 환형 리스트,클래스없이 구현하는게 제약조건이었습니다.
시작지점 0번째 실린더 위치를 p, k만큼 실린더가 돕니다.
선택된 실린더 p의 죄수는 처형당하며, 사라진 죄수의 다음 위치에 p가 설정됩니다.
이 작업이 반복되면서, 마지막 남은 죄수가 몇번째 인가, 그리고 처형된 순서대로 로그에 남기는 문제입니다.
이주짜리 과제...2주나?
단일 소스 코드로, 환형 리스트,클래스없이 구현하는게 제약조건이었습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
|
#include<stdio.h>
#include<stdlib.h>
typedef struct prisoner {
int prisonerNum;
struct prisoner* next;
}PRISONER;
typedef struct killLog {
int *log;
}KILLLOG;
PRISONER* init(int size){ //리스트 선언,초기화
int num = 1;
PRISONER* neww = (PRISONER*)malloc(sizeof(PRISONER));
PRISONER* cur,* tmp = NULL;
cur = neww;
cur->prisonerNum = num;
if (size == 1) {
cur->next = neww;
return neww;
} //죄수가 한명일때, 쓸모없지만, 문제에서 제시한 범위는 1명 이상이다.
while (num != size) {
tmp= (PRISONER*)malloc(sizeof(PRISONER));
cur->next = tmp;
cur = tmp;
cur->prisonerNum = ++num;
}
cur->next = neww;
cur->prisonerNum = num;
return neww;
}
int roll(/*cbv*/PRISONER **killPoints, int size,KILLLOG *killLog,int *killCount) {
PRISONER* tmp = *killPoints;
int count = size;
if ((*killPoints)->next == *killPoints)
return 1;// 죽일 죄수가 하나뿐일떄
while (count != 1) {
*killPoints = (*killPoints)->next;
count--;
} // 죽일 죄수를 정한다.
while (tmp->next != *killPoints)
tmp = tmp->next;//죽일 죄수의 prev로 간다.
tmp->next = (*killPoints)->next; // 죽일 죄수의 링크드 리스트를 연결을 해제
tmp = *killPoints; //죽일 죄수는 tmp포인터가 이제 지목한다.
*killPoints = tmp->next; // 다음 죽일 죄수를 위해 포인터가 다음칸으로 이동한다.
//printf("current killpoint is %d \n", (*killPoints)->prisonerNum);
tmp->next = NULL; //죽일 죄수의 노드를 말끔히 지운다.
killLog->log[(*killCount)++]=tmp->prisonerNum;//죽일 죄수의 번호를 로그에 입력
//printf("kill number is : %d \n", tmp->prisonerNum);
free(tmp);//죽인다.
return 0;
//죄수가 1명이 되면 return statement는 true가 된다, 그렇지 않으면 false가 되어 함수가 반복된다.
}
int main() {
int n, k,result=0,killCount=0;
PRISONER *killMark;
KILLLOG *killLog;
scanf("%d", &n);
//죄수의 총 숫자
scanf("%d", &k);
//순번 카운트
if (!(n > 0 && n < 1001))
return 0; //예외처리
if (!(k > 0 && k < n))
return 0; //예외처리
killLog = (KILLLOG*)malloc(sizeof(KILLLOG));
killLog->log = (int*)malloc(sizeof(int)*n);
//문제 의도대로 살해 순번을 나타내기 위해 동적 배열 생성, 짜놓고도 무식한 방법이네요.
killMark = init(n);
//싱글 환형 링크드 리스트로 세팅 완료
while(result!=1)
result = roll(&killMark, k,killLog,&killCount);
//하나 남을때까지 죽이는 함수.
printf("survived prisoner's number is %d \nkilllog : ", killMark->prisonerNum);
for (int i = 0; i < killCount; i++){
printf("%d ", killLog->log[i]);
}
//킬 로그 출력
free(killMark);
free(killLog->log);
free(killLog);
//마지막 동적 생성된 구조체를 지운다.
}
/*
Project : Assignment for DataStruct
Creator : Changwon J.
Date : Nov 06, 2017
note : n ist prisoner number, k ist number for counting,
called "요셉문제"
*/
|
2017년 11월 17일 금요일
Node.js/Javascripts 소숫점 자를때 생기는 문제점..
가지고 있는 Double 혹은 Float 타입의 값의 소숫점을 자를 필요가 있었는데,
우선 결론적으로는 간단한 함수를 쓰면 된다.
var value = 3.14;
console.log(value.toFixed(1));
// 결과는 3.1 이 나오게 된다.
toFixed는 반올림 을 해주며, 이미 여러곳에서 쉽게 검색을 할 수 있는데, 추가적인 작업중에 꽃피는 애로사항이 나를 맞이하였다,
javascripts를 내가 싫어하는 이유중 하나가 바로 데이터타입을 원하는데로 선언이 안되던건데, 아니나 다를까 여기서 발목이 잡혔다.
toFixed 함수의 리턴갑은 String 타입이다.
이를 확인하기 위해서 간단히
console.log(typeof value);
//결과는 string
를 이용했었다.
결론적으로 String이어서 또 캐스팅을 해야하는 짜증나는 문제가 생겼는데,이미 정의된 함수를 뜯어고치는것도 내 수준에서는 정신나간짓 인거같고, 또 캐스팅을 하자니 뭔짓인가 싶어서 조금 더 검색을 해 봤는데 결과는 너무나 간단하게 해결이 가능했다.
console.log(value.toFixed(1)/1);
1을 나눠주게 해버리니깐 number 타입으로 다시 바꾸더라.
익숙해지기 힘드네..
우선 결론적으로는 간단한 함수를 쓰면 된다.
var value = 3.14;
console.log(value.toFixed(1));
// 결과는 3.1 이 나오게 된다.
toFixed는 반올림 을 해주며, 이미 여러곳에서 쉽게 검색을 할 수 있는데, 추가적인 작업중에 꽃피는 애로사항이 나를 맞이하였다,
javascripts를 내가 싫어하는 이유중 하나가 바로 데이터타입을 원하는데로 선언이 안되던건데, 아니나 다를까 여기서 발목이 잡혔다.
toFixed 함수의 리턴갑은 String 타입이다.
이를 확인하기 위해서 간단히
console.log(typeof value);
//결과는 string
를 이용했었다.
결론적으로 String이어서 또 캐스팅을 해야하는 짜증나는 문제가 생겼는데,이미 정의된 함수를 뜯어고치는것도 내 수준에서는 정신나간짓 인거같고, 또 캐스팅을 하자니 뭔짓인가 싶어서 조금 더 검색을 해 봤는데 결과는 너무나 간단하게 해결이 가능했다.
console.log(value.toFixed(1)/1);
1을 나눠주게 해버리니깐 number 타입으로 다시 바꾸더라.
익숙해지기 힘드네..
2017년 11월 16일 목요일
ejs, script 문에서 서버 전송 값 다루기..
이놈의 ejs는 할때마다 까먹고 해괴한데, 두번째로 변수값에 대한 글을 남기게 되었습니다.
ejs파일 속의 <script>안에서, 서버에서 전송한 값은 어떻게 받을까 고민하며,
<script>
var val = <%- test %>
</script>
로 해봤는데 그냥 뻗어버리는 사태가 계속해서 발생..
짜증 이빠이 나서 검색해보니 의외로 간단 -_-;;
서버사이드에서 넘길때 변수타입이 이상해서 못받고 뻗어버리는것.
그러니깐 어뜨캐 하냐면
var val = <%- JSON.Stringify(test) %>
js는 ㄹㅇ 난 못하는듯 합니당. 너무 답답하고 미칠거같아서 눈물이 다 나려하더라
ejs파일 속의 <script>안에서, 서버에서 전송한 값은 어떻게 받을까 고민하며,
<script>
var val = <%- test %>
</script>
로 해봤는데 그냥 뻗어버리는 사태가 계속해서 발생..
짜증 이빠이 나서 검색해보니 의외로 간단 -_-;;
서버사이드에서 넘길때 변수타입이 이상해서 못받고 뻗어버리는것.
그러니깐 어뜨캐 하냐면
var val = <%- JSON.Stringify(test) %>
js는 ㄹㅇ 난 못하는듯 합니당. 너무 답답하고 미칠거같아서 눈물이 다 나려하더라
2017년 11월 7일 화요일
11월 7일 ejs 태그 문제
과제폭탄으로 여태까지 업데이트가 없어쓰..
오늘까지 된것.
ejs공부
express 기초 다시 공부
mysql 통신성공
sql query문을 통해 데이터 판독 성공
다음 해야할 일들
passport와 session을 이용해 세션 설정.
bcrypt를 이용한 비밀번호 암호화
1차 코드 보강
뷰 연동
2차 서버 통신 준비
ejs 에서 조건문을 쓸때 유의해야하는 사항이 하나 있는데, <% %>를 언제 끊어야 하나 였습니다.
jsp에서는 이런식일때는 문제가 없었는데,
<% if(condition){
%><script>blah </><%
}else{
%> <script> blah2</> <%
}%>
지저분하기야 jsp를 만질때부터 느끼고는 있었으나 사용에는 문제가 없었으므로, 이의를 제기하지 않고 썻었습니다.
헌데 ejs에서는 문법 오류를 뿜어대는데, 도저히syntex오류를 찾을수 없어 조금 더 검색을 하다가, 결론이 나왔습니다.
https://stackoverflow.com/questions/8216918/can-i-use-conditional-statements-with-ejs-templates-in-jmvc
<!-- if문 -->
<% if(condition) {%>
<script>blah</>
<% }else{ %>
<script>blah2</>
<%}%>
<!-- while문-->
<% while(condition) { %>
<script>blah3 </>
<% variable++
} %>
<!-- switch문 -->
<%switch(condition){
case 1 : %>
<script> blah4</>
<% break;
case 2 : %>
<script> blah5</>
<% break;
default : break;
} %>
차이가 뭐냐 싶었는데, 속된말로 ㅈ대로 꺽쇠를 열었다 닫았다를 못합니다.
jsp에서는 쓰는놈 마음대로 어느정도 꼬을 수 있다고 보는데, ejs에서는 규칙을 정해놨네요.
태그를 닫는순간 그 뒤에 다시 열기전에 태그문이 아닌 다른것이 들어가야 하더군요.
정확하게 설명글을 아직 보지는 못했지만, 잃어버린 내 4시간을 위해 써둡니당.
오늘까지 된것.
ejs공부
express 기초 다시 공부
mysql 통신성공
sql query문을 통해 데이터 판독 성공
다음 해야할 일들
passport와 session을 이용해 세션 설정.
bcrypt를 이용한 비밀번호 암호화
1차 코드 보강
뷰 연동
2차 서버 통신 준비
ejs 에서 조건문을 쓸때 유의해야하는 사항이 하나 있는데, <% %>를 언제 끊어야 하나 였습니다.
jsp에서는 이런식일때는 문제가 없었는데,
<% if(condition){
%><script>blah </><%
}else{
%> <script> blah2</> <%
}%>
지저분하기야 jsp를 만질때부터 느끼고는 있었으나 사용에는 문제가 없었으므로, 이의를 제기하지 않고 썻었습니다.
헌데 ejs에서는 문법 오류를 뿜어대는데, 도저히syntex오류를 찾을수 없어 조금 더 검색을 하다가, 결론이 나왔습니다.
https://stackoverflow.com/questions/8216918/can-i-use-conditional-statements-with-ejs-templates-in-jmvc
<!-- if문 -->
<% if(condition) {%>
<script>blah</>
<% }else{ %>
<script>blah2</>
<%}%>
<!-- while문-->
<% while(condition) { %>
<script>blah3 </>
<% variable++
} %>
<!-- switch문 -->
<%switch(condition){
case 1 : %>
<script> blah4</>
<% break;
case 2 : %>
<script> blah5</>
<% break;
default : break;
} %>
차이가 뭐냐 싶었는데, 속된말로 ㅈ대로 꺽쇠를 열었다 닫았다를 못합니다.
jsp에서는 쓰는놈 마음대로 어느정도 꼬을 수 있다고 보는데, ejs에서는 규칙을 정해놨네요.
태그를 닫는순간 그 뒤에 다시 열기전에 태그문이 아닌 다른것이 들어가야 하더군요.
정확하게 설명글을 아직 보지는 못했지만, 잃어버린 내 4시간을 위해 써둡니당.
2017년 10월 30일 월요일
10월 30일
서버 설계도 작업을 시작했습니다.
아직 초보이며, 서버에 대한 기초지식이 부족한 관계로, 처음에는 가볍게
3계층 구조를 시도해 볼 생각입니다.
client - was - dbms 로 1차 구현 입니다.
express 를 이클립스에 올리기를 어제 실패했습니다.
보통 인터넷에 알려주는 방법은 npm을 사용하는데, 아직은 방법을 이해하지 못했습니다.
조금 더 알아보았고, 결국은 eclipse용 express를 설치하는데 성공했습니다.
express 에서는기존의 Node의 서버 실행과는 조금 다른방식으로, 변수에 express를 불러와서,
그 변수를 이용하여 서버를 세팅하고, 구동합니다. 위의 코드에서 app 라는 variable이 그 역활을 담당합니다.
서버의 오픈은 11번 라인입니다.
이후 서버로부터 사용자의 요청을 받기 위해서는, 라우터가 필요합니다.
라우터는 JSP에서 controller를 부분적으로 담당하는 기능입니다.
클라이언트로부터 들어온 요청대로 경로를 뿌려주는 기능입니다.
아래 15번 라인이 라우터의 예시입니다. 메인 소스에 지저분하게 얹히는것이 싫기 때문에, 코드를 따로 뺍니다.
./router/main.js 에 라우터를 설정합니다.
이로써 따로 빼낸 라우터가 준비되었습니다. 처음의 4번 라인에서, 방금 만든 코드를 인클루드 합니다.
이제 html들을 준비합니다.
만든 html파일들을 따로 보관하기 위해,
./views/ 안에 html들을 저장했습니다.
라우터 코드에 html들의 이름이 적혀져 있습니다. 하지만 정확한 html의 실행 경로는 설정 되어 있지 않기 때문에, 제일 상단의 6번 라인을 선언합니다. 이로써views 는 ./views/ 로 설정이 된다 합니다.
css, 정적인 이미지나, 동영상 등은 정적이므로, node에서 여러번 생성 할 필요가 없습니다.
그런 이유에서 상기의 리소스들을 static화를 시킵니다.
css 파일을
./public/css/style.css 위치에 지정했습니다.
메인클래스에서 static선언과, 위치를 알려주는 코드는 9번 라인 입니다.
이제 html에서는
를 헤더에 선언하면, 적용이 된 css를 볼 수 있게 됩니다.
이정도 까지..
보고 배운, 출처 블로그 : https://velopert.com/294
아직 초보이며, 서버에 대한 기초지식이 부족한 관계로, 처음에는 가볍게
3계층 구조를 시도해 볼 생각입니다.
client - was - dbms 로 1차 구현 입니다.
express 를 이클립스에 올리기를 어제 실패했습니다.
보통 인터넷에 알려주는 방법은 npm을 사용하는데, 아직은 방법을 이해하지 못했습니다.
조금 더 알아보았고, 결국은 eclipse용 express를 설치하는데 성공했습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
//express 사용방법. package.json이 선언되어 있어야 한다.
var express = require('express');
var app = express();
var route = require('./router/main.js')(app); //라우트 폴더의 js파일을 인식시키게 하는 코드,(app)로 인자값 전달.
app.set('views',__dirname+'/views');
app.set('view engine','ejs');
app.engine('html',require('ejs').renderFile);
app.use(express.static('public')); //css파일,이미지,동영상등 변하지 않는 리소스들을 보관하는 폴더엔 public 내부를 인식.
var server = app.listen(8081, function(){
console.log('Express erver ist on at 8081');
});
//app.get('/',function(request,response){
// response.send('Hello World');
//})
//라우터 사용방법. 라우터란 jsp의 mvc패턴의 controller와 비슷한 기능을 제공하는 기능이다.
//올바른 코드를 위해서는, 라우터 코드를 따로 폴더에 저장한다.
|
express 에서는기존의 Node의 서버 실행과는 조금 다른방식으로, 변수에 express를 불러와서,
그 변수를 이용하여 서버를 세팅하고, 구동합니다. 위의 코드에서 app 라는 variable이 그 역활을 담당합니다.
서버의 오픈은 11번 라인입니다.
이후 서버로부터 사용자의 요청을 받기 위해서는, 라우터가 필요합니다.
라우터는 JSP에서 controller를 부분적으로 담당하는 기능입니다.
클라이언트로부터 들어온 요청대로 경로를 뿌려주는 기능입니다.
아래 15번 라인이 라우터의 예시입니다. 메인 소스에 지저분하게 얹히는것이 싫기 때문에, 코드를 따로 뺍니다.
./router/main.js 에 라우터를 설정합니다.
1
2
3
4
5
6
7
8
9
|
module.exports = function(app)
{
app.get('/',function(request,response){
response.render('index.html');
});
app.get('/about',function(request,response){
response.render('about.html');
});
}
|
이로써 따로 빼낸 라우터가 준비되었습니다. 처음의 4번 라인에서, 방금 만든 코드를 인클루드 합니다.
이제 html들을 준비합니다.
만든 html파일들을 따로 보관하기 위해,
./views/ 안에 html들을 저장했습니다.
라우터 코드에 html들의 이름이 적혀져 있습니다. 하지만 정확한 html의 실행 경로는 설정 되어 있지 않기 때문에, 제일 상단의 6번 라인을 선언합니다. 이로써views 는 ./views/ 로 설정이 된다 합니다.
css, 정적인 이미지나, 동영상 등은 정적이므로, node에서 여러번 생성 할 필요가 없습니다.
그런 이유에서 상기의 리소스들을 static화를 시킵니다.
css 파일을
./public/css/style.css 위치에 지정했습니다.
메인클래스에서 static선언과, 위치를 알려주는 코드는 9번 라인 입니다.
이제 html에서는
1
|
<link rel="stylesheet" type="text/css" href="css/style.css">
|
를 헤더에 선언하면, 적용이 된 css를 볼 수 있게 됩니다.
이정도 까지..
보고 배운, 출처 블로그 : https://velopert.com/294
project pid 시작!
새 프로잭트를 준비하며, 일지를 다시 작성합니다.
앞으로 최대한 일지를 작성할 것이며, 이전처럼 겪은내용, 애로사항, 해결법, 등을 기술 할 것 입니다.
새 프로잭트인 pid에서 제가 맡은 역활은 서버 생성 입니다.
Node.Js 를 이용하여 기본 서버 설계, 나아가 리눅스 기초를 만져 볼 생각입니다.
앞으로 최대한 일지를 작성할 것이며, 이전처럼 겪은내용, 애로사항, 해결법, 등을 기술 할 것 입니다.
새 프로잭트인 pid에서 제가 맡은 역활은 서버 생성 입니다.
Node.Js 를 이용하여 기본 서버 설계, 나아가 리눅스 기초를 만져 볼 생각입니다.
피드 구독하기:
글 (Atom)