장고 Admin에서 각 user의 소속 그룹지정해줄 수 있다.

그리고 그룹에 따라 접속 가능한 페이지도 나눌 수 있다.



상황:

"partner" 그룹에 속한 유저만 해당 페이지에 접속 허용하고, 그 외 그룹에 속하지 않는 유저메인페이지리다이렉트한다.



1
2
3
4
def menu_add(request):
    ctx = {}
    if "partner" not in request.user.groups.all():
        return redirect("/")
cs


1) 그룹 데이터직접 접근한다.


조건문을 작성하여 해당 페이지에 접속한 유저의 그룹이 필요로하는 "partner" 값인지 유무를 따지고, 없다는 조건이 참이면 메인페이지로 리다이렉트한다.


단, 여기서도 동일한 내용의 코드를 여러 뷰 함수에 담아서 사용하는데에 발생하는 번거로움과 늘어나는 코드량이 문제가 될 수 있다.



2) 1)번과 동일한 기능은 갖춘 user_passes_test 데코레이터 활용하기


1
2
3
4
5
6
7
8
9
from django.contrib.auth.decorators import user_passes_test
 
URL_LOGIN = '/partner/login/'
 
def partner_group_check(user):
    return "partner" in user.groups.all()
 
@user_passes_test(partner_group_check, login_url=LOGIN_URL)
def menu_add(request):
cs


user_passes_test 데코레이터를 사용하기 위해서는 별도의 함수 작성이 필요하다.

함수명은 partner_group_check로서 유저의 그룹이 "partner"인지 확인하는 것으로 만약 거짓이라면 로그인 페이지리다이렉트하게 된다.


*매개변수를 user로 받는데, 이 user는 menu_add 함수의 request.user와 동일하다.


1
2
3
4
5
6
7
8
9
10
11
12
13
URL_LOGIN = '/partner/login/'
 
def partner_group_check(user):
    return "partner" in user.groups.all()
 
@user_passes_test(partner_group_check, login_url=LOGIN_URL)
def menu_add(request):
 
@user_passes_test(partner_group_check, login_url=LOGIN_URL)
def menu_edit(request):
 
@user_passes_test(partner_group_check, login_url=LOGIN_URL)
def menu_delete(request):
cs


partner 그룹에 속한 유저만 사용해야하는 모든 경우에 데코레이터를 손쉽게 가져다 사용할 수 있다.




블로그 이미지

쵸잇

,

상황:

패스트푸드 사이트에서 메뉴페이지신메뉴를 추가시킬 수 있는 권한관리자로그인한 경우만 가능하다.

따라서 관리자가 아닌 익명의 유저URL를 직접 입력하여 관리자의 권한이 필요한 페이지로 접근을 하려고한다.



1) User 모델의 속성 중 하나인 "is_anonymous"를 활용한다.


다른 속성인 "is_authenticated"는 해당 유저가 인증이 되었는지 유무를 알려준다.

"is_anonymous"는 User와 AnonymousUser 객체의 차이를 두기 위해 사용한다.

확인을 위해서는 request.user.is_anonymous 형태로 사용된다.


1
2
if request.user.is_anonymous:
    return redirect("/partner/login/")
cs


익명의 사용자라는 것이 확인되면 로그인 페이지리다이렉트한다.



2) 1)번을 간편하게 쓸 수 있는 login_required 데코레이터활용한다.


1
2
3
4
from django.contrib.auth.decorators import login_required
 
@login_required(login_url='/accounts/login/')
def my_view(request):
cs


view 함수 위에 해당 데코레이터와 로그인 페이지를 입력하면 AnonymousUser를 즉시 로그인 페이지리다이렉트 처리한다.




**

데코레이터를 반복적으로 여러 뷰 함수에 사용하는 경우 (login_url='/accounts/login/') 부분이 중복되므로 상수처리한다.


1
2
3
4
5
6
7
8
9
10
11
12
13
URL_LOGIN = '/accounts/login/'
 
@login_required(login_url=URL_LOGIN)
def my_view(request):
 
@login_required(login_url=URL_LOGIN)
def your_view(request):
 
@login_required(login_url=URL_LOGIN)
def his_view(request):
 
@login_required(login_url=URL_LOGIN)
def her_view(request):
cs



**

새로운 상황:

접근 권한이 필요한 페이지URL을 통해 직접 접근한 경우, 

login_required 데코레이터에 의해 로그인 페이지로 넘어가는데,

이때 login_required 데코레이터는 로그인한 경우 해당 페이지리다이렉트해주는 기능이 포함되어있다.

그러나 로그인 뷰에 의해 해당 페이지가 아닌 로그인 뷰에 지정된 페이지리다이렉트가 된다.



로그인 후 해당 페이지로 즉시 이동하려면?


URL을 살펴보면, "127.0.0.1:8000/partner/login/?next=/partner/menu/"이다.

URL 중 쿼리스트링으로 작성된 부분인 "?next=/partner/menu/"에서 "next"의 값으로 "/partner/menu/" URL를 갖고 있다.

이 쿼리스트링 부분을 login_required 데코레이터가 만들어 준 것이다.


로그인 뷰에서 GET 방식을 통해 URL에서 "next" 값을 호출하여 "next_value"라는 변수로 정의한다.

조건을 만들어서 URL에 "next" 값이 존재한 경우에는 그 값에 해당하는 URL로 리다이렉트하고,

"next" 값이 존재하지 않다면 메인페이지로 이동하도록 한다.


1
2
3
4
5
6
7
if user is not None:
    auth_login(request, user)
    next_value = request.GET.get("next")
    if next_value:
        return redirect(next_value)
    else:
        return redirect("/partner/")
cs







블로그 이미지

쵸잇

,

내 정보(myInfo) 객체에서 성별을 출력할 때 console.log()를 사용했다.


1
console.log(myInfo.gender);
cs


myInfo 객체에 gender 키에 접근하는 것처럼,

console.log를 console 객체에 log() 함수를 사용한다고 보면 된다. 



console 객체를 출력하면,


1
2
3
4
5
6
7
8
9
10
11
12
13
t {
  log: [Function],
  error: [Function],
  info: [Function],
  warn: [Function],
  dir: [Function],
  time: [Function],
  timeEnd: [Function],
  trace: [Function],
  assert: [Function],
  clear: [Function],
  stdout: { [Function] clear: [Function] },
  _times: {} }
cs


log 함수를 비롯해 다양한 함수를 포함하고 있다.

이 중에서 우리가 사용하고 싶은 것을 console.함수명() 형태로 사용하는 것이다.

console이라는 객체는 여러가지의 내장함수를 가지고 있다.




그럼 함수는 왜 필요할까?


1
2
3
4
5
console.log("Hello, Ryan");
console.log("Hello, Adrianne");
console.log("Hello, Kaori");
console.log("Hello, Bobby");
 
cs


"Hello"라는 인삿말이 싫어서 "Hi"로 고치려면 1개씩 수정해야하는 번거로움이 있다.

만약 이런 코드가 100만개라면 100만개를 하나씩 언제까지 고치고 있을줄 모른다.


여기서 반복되는 


1
2
console.log("Hello");
 
cs


이 코드를 하나로 묶어 필요할 때마다 사용하고, 내용 수정한 번만으로 100개든 1000개든 한꺼번에 되도록 하는게 목표다.

그것을 도와줄 녀석이 함수이다.  



함수의 정의는 function 함수명()으로 시작한다.


1
2
3
4
5
function sayhello() {
  console.log("Hello");
}
 
sayhello();
cs


중괄호{} 안에 중복되는 코드를 입력하고, 필요시 함수명()만 입력하면 함수로 지정된 코드를 반환한다.



다시 한 번 정리하면, 함수 형태는 함수명()이다.

console.log()는 즉, console 객체에 포함된 log() 함수라는 걸 기억하자.



이어서 우리가 만든 함수를 활용하여 인삿말과 이름을 같이 출력해보자.


1
sayhello()+console.log("Ryan")
cs


실망스럽게도,


1
2
>> Hello
Ryan
cs


우리가 원하는 한 줄의 텍스트로 출력되지 않았다.



그럼 sayhello() 함수의 도움을 받아 sayhello("Ryan") 형태로 값을 담아 같이 출력해보는 방식을 만들어보자.


1
2
3
4
5
function sayhello(name) {
  console.log("Hello"+','name);
}
 
sayhello("Ryan")
cs

 

1
2
>>
Hello, Ryan
cs


드디어 우리가 원하던 결과가 반환되었다.

name은 매개변수(parameter)이고, sayhello() 함수 안의 "Ryan"은 인자(argument)이다.


매개변수는 인자를 받아서 넘겨주는 역할을 한다.

따라서 sayhello() 함수는 "Ryan"을 name에게 토스하여 "Hello"와 같이 출력된다. 

매개변수는 변수처럼 임의로 이름을 설정해주면 된다.


1
2
3
4
5
6
7
8
function sayhello(name) {
  console.log("Hello"+','name);
}
 
sayhello("Ryan")
sayhello("Adrianne")
sayhello("Kaori")
sayhello("Bobby")
cs


1
2
3
4
5
>>
Hello, Ryan
Hello, Adrianne
Hello, Kaori
Hello, Bobby
cs



추가로 인자를 2개 넘기는 연습을 해보자. 인자가 2개이면 매개변수도 2개이다.


1
2
3
4
5
6
7
8
function sayhello(name, age) {
  console.log("Hello"+','name+"!""Are you", age+"?");
}
 
sayhello("Ryan"31)
sayhello("Adrianne"31)
sayhello("Kaori"26)
sayhello("Bobby"25)
cs


1
2
3
4
5
>>
Hello, Ryan! Are you 31?
Hello, Adrianne! Are you 31?
Hello, Kaori! Are you 26?
Hello, Bobby! Are you 25?
cs


점점 함수가 발전되어가는 모습이다.



블로그 이미지

쵸잇

,

배열과 객체를 넓게 사용해보자


1) 여러 개의 객체배열에 담을 수 있고,

2) 객체 속성의 값으로 배열을 사용할 수 있으며,

3) 2)번의 배열객체를 담을 수도 있다.



1) 개개인의 정보 객체info라는 배열에 담았다. 


1
const info = [RyanInfo, DavidInfo, AdrianneInfo, KaoriInfo]
cs



2) 정보(myInfo) 객체에서 좋아하는 음식을 나열한 속성인 favoriteFood의 값으로 배열을 지정했다.


1
2
3
4
5
6
7
const myInfo = {
  name : "Ryan",
  age : 31,
  gender : "male",
  isHandsome : true,
  favoriteFood : ["kimchi""chickenSoup""bulgogi"],
}
cs



3) testPass 속성의 값인 배열객체를 담았다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const myInfo = {
  name : "Ryan",
  age : 31,
  gender : "male",
  isHandsome : true,
  favoriteFood : ["kimchi""chickenSoup""bulgogi"],
  testPass : [
    {
      subject:"math"
      pass:false
    },
    {
      subject:"javascript",
      pass:true
    }
  ]
}
cs



'코딩 연습 > Javascript' 카테고리의 다른 글

문자열 속에 매개변수 넣기  (0) 2018.12.06
함수(function)  (0) 2018.12.05
객체(object)를 이용해 데이터 다루기  (0) 2018.12.04
배열(array)  (0) 2018.12.04
카멜 표기법(camel case)  (0) 2018.12.04
블로그 이미지

쵸잇

,

객체(object)를 이용해 데이터 다루기

그리고 똑같은 리스트 방식인 배열(array)과 다른 점 살펴보기


배열(array)의 문제점은 뭘까?


  • 내 정보인 이름(name), 나이(age), 성별(gender), 조건문(true or false)에 대한 값을 배열(array)로 만들었다.
  • console.log() 메소드를 통해 나이만 출력하고 싶다.


1
2
3
const my_info = ["Ryan"31"male"true]
 
console.log(my_info[1]);
cs


  • 우선 나이에 대한 데이터가 my_info에서 배열 몇 번째에 있는지 알아야 출력이 가능해진다.
  • 만약 배열 안에 데이터가 100만 개가 있다면 4만 7천번째 값이 뭔지 알아야 꺼낼 수 있다는 말이다.
  • 따라서 효율적으로 데이터를 관리하기 위해서 객체(object)를 사용한다.



동일한 데이터를 가지고 객체로 만들어보자


  • 객체는 {}괄호를 사용하고, 데이터에 이름을 붙여준다.
  • 데이터로는 문자, 숫자, 배열, 객체도 사용 가능하다.


1
2
3
4
5
6
7
8
const my_info = {
  name : "Ryan",
  age : 31,
  gender : "male",
  isHandsome : true,
}
 
console.log(my_info.age);
cs


  • 원하는 데이터를 호출하려면 객체에 점(.)을 찍은 후 데이터에 지정해준 이름을 적으면 된다.

  • 호출한 데이터로 console.log() 메소드를 통해 출력할 수 있다.



1
2
3
4
5
console.log(my_info.age);
 
my_info.age = 32
 
console.log(my_info.age);
cs


  • 호출한 데이터에 '32'를 입력하여 age 데이터를 바꿀 수 있다. 


'코딩 연습 > Javascript' 카테고리의 다른 글

함수(function)  (0) 2018.12.05
배열(array)과 객체(object)를 확장해서 사용  (0) 2018.12.04
배열(array)  (0) 2018.12.04
카멜 표기법(camel case)  (0) 2018.12.04
자료형(data type)  (0) 2018.12.04
블로그 이미지

쵸잇

,

배열의 필요성


요일 변수요일 값을 담고 출력하면,


1
2
3
4
5
6
7
8
9
const Monday = "Mon";
const Tue = "Tue";
const Wed = "Wed";
const Thu = "Thu";
const Fri = "Fri";
const Sat = "Sat";
const Sun = "Sun";
 
console.log(Monday, Tue, Wed, Thu, Fri, Sat, Sun);
cs


하나씩 변수를 지정하고 값을 담아야하니 동일한 작업을 6번이나 더 해야한다.

배열7개의 문자열하나로 묶는다. 


배열만 출력하면 7개의 문자열이 모두 한꺼번에 출력이 된다.


1
2
3
const dayOfWeek = ["Mon""Tue""Wed""Thu""Fri""Sat""Sun"]
 
console.log(dayOfWeek);
cs



배열에서 원하는 값을 출력하려면 해당 값의 순서를 "[]" 안에 입력하면 된다.


1
2
3
const dayOfWeek = ["Mon""Tue""Wed""Thu""Fri""Sat""Sun"]
 
console.log(dayOfWeek[5]);
cs


'코딩 연습 > Javascript' 카테고리의 다른 글

배열(array)과 객체(object)를 확장해서 사용  (0) 2018.12.04
객체(object)를 이용해 데이터 다루기  (0) 2018.12.04
카멜 표기법(camel case)  (0) 2018.12.04
자료형(data type)  (0) 2018.12.04
주석처리하기  (0) 2018.12.04
블로그 이미지

쵸잇

,

카멜 표기법 - 일명 낙타 표기법으로 낙타의 "등"을 묘사한 표기 방식이다.


1
const daysOfWeek =
cs


자바스크립트에서는 첫 글자는 소문자로 입력하고, 다음 단어스페이스 대신첫 글자를 대문자로 입력한다.

'코딩 연습 > Javascript' 카테고리의 다른 글

객체(object)를 이용해 데이터 다루기  (0) 2018.12.04
배열(array)  (0) 2018.12.04
자료형(data type)  (0) 2018.12.04
주석처리하기  (0) 2018.12.04
var, let, const  (0) 2018.12.04
블로그 이미지

쵸잇

,

1. 문자열(string) 


1
const A = "good";
cs


쌍따옴표(") 사이에 문자나 숫자, 이모티콘 등을 입력하면 문자열로 인식



2. 불리언(boolean)


1
const A = True;
cs


boolean은 True 또는 False 값을 가진다



3. 숫자형(number)


1) 실수(float) 


1
const A = 0.0002;
cs


소수점을 포함 숫자다.



2) 정수(integer)


1
2
3
const A = -5;
const B = 0;
const C = 5;
cs


양수, 0, 음수를 포함한 숫자다.

'코딩 연습 > Javascript' 카테고리의 다른 글

객체(object)를 이용해 데이터 다루기  (0) 2018.12.04
배열(array)  (0) 2018.12.04
카멜 표기법(camel case)  (0) 2018.12.04
주석처리하기  (0) 2018.12.04
var, let, const  (0) 2018.12.04
블로그 이미지

쵸잇

,


1
2
3
4
5
6
7
// const a = 1
 
/*
const b = 2
const c = 3
const d = 4
*/
cs



한 줄 주석처리는 //


범위에 따른 주석처리는 /* (범위) */

'코딩 연습 > Javascript' 카테고리의 다른 글

객체(object)를 이용해 데이터 다루기  (0) 2018.12.04
배열(array)  (0) 2018.12.04
카멜 표기법(camel case)  (0) 2018.12.04
자료형(data type)  (0) 2018.12.04
var, let, const  (0) 2018.12.04
블로그 이미지

쵸잇

,
1) var

1
2
3
var A = 1
var A = 2
var A = 5
cs




var A를 출력하면 마지막 값인 "5"만 출력된다.



2) let


1
2
let A = 1
let A = 2
cs


let A를 출력하면 A값 중복선언 오류가 발생한다.

처음에 선언한 값인 "1"만 허용된다.


1
2
let A = 1
= 2
cs


다음과 같은 상황에서 A를 출력하면 "2"가 출력된다.



3) const


1
2
const A = 1
const A = 2
cs


const A를 출력하면 A값 중복선언 오류가 발생

let과 마찬가지로 처음 값만 허용된다.


1
2
const A = 1
= 2
cs


A를 출력하면 상수 할당 오류가 발생한다.

상수로서 값을 "1"로 선언했기에 값이 바뀔 수 없다.

'코딩 연습 > Javascript' 카테고리의 다른 글

객체(object)를 이용해 데이터 다루기  (0) 2018.12.04
배열(array)  (0) 2018.12.04
카멜 표기법(camel case)  (0) 2018.12.04
자료형(data type)  (0) 2018.12.04
주석처리하기  (0) 2018.12.04
블로그 이미지

쵸잇

,