반응형

https://spring.io/guides/tutorials/spring-boot-oauth2/


위 사이트에 가면 Spring boot 를 이용해서 Oauth를 이용해서 Login 을 할 수 있는 샘플을 만들어볼 수 있다. 그래서 나도 해봤는데.. 그게 삽질의 시작이었다...

Tutorial 자체는 그렇게 어렵지 않게 따라 할 수 있다. 따라하기가 어렵다면 Git에서 소스를 내려 받아서 해볼 수도 있다.


이제 이 Tutorial 을 진행하기 위해서 Facebook Developer 사이트에서 앱을 등록을 해야 한다. 그래야 Client Id 하고 Client  Secret을 받을 수 있다.


https://developers.facebook.com


위 사이트에 들어 가면 본인의 Facebook 계정으로 앱을 등록할 수 있다.


위 화면에서와 같이 앱ID 와 앱 시크릿 코드 를 받을 수 있는데 이게 바로 Client Id 와 Client Secret으로 사용된다.

그리고 redirect URI를 등록하면 준비는 끝난다. (끝난건줄 알았다...)


이제 샘플을 실행 시켜봤다.


로그인 까지 멀쩡하게 됐는데 error가 딱 나온다.


아니 왜????? 대체 왜 에러가 나오는 거지??? 분명 할것 다 한것 같은데..



로그를 보니 분명 access_token 까지는 잘 가져 왔다. 그런데 https://graph.facebook.com/me 라는 url을 호출 할때 400 error 가 났다. Http request 400 Error 는 그냥 Bad Request(요청이 잘못됐다)라는 의미는 아니다.


400(잘못된 요청): 서버가 요청의 구문을 인식하지 못했다

(출처 : https://ko.wikipedia.org/wiki/HTTP_%EC%83%81%ED%83%9C_%EC%BD%94%EB%93%9C#4xx_(%EC%9A%94%EC%B2%AD_%EC%98%A4%EB%A5%98)


한마디로 요청을 하는 syntax 가 뭔가 잘못됐다는 의미이다.


똑같은 요청을 Postman 으로 보내봤다.


리턴된 메세지에 appsecret_proof argument가 있어야 된다고 나온다.. 이게 뭐지??? client_secret 말고 뭐가 또있나???

appsecret_proof로 그래프 API 호출 인증

그래프 API는 클라이언트 또는 클라이언트를 대신하여 서버에서 호출할 수 있습니다. 서버의 호출은 appsecret_proof라고 하는 매개변수를 추가하여 앱의 보안을 개선할 수 있습니다.

액세스 토큰은 이동 가능합니다. 클라이언트에서 Facebook의 SDK에 의해 생성된 액세스 토큰을 취하여 서버에 보낸 다음, 해당 서버에서 클라이언트를 대신하여 호출할 수 있습니다. 사용자 컴퓨터의 악성 소프트웨어 또는 메시지 가로채기(man in the middle) 공격에서 액세스 토큰을 훔칠 수도 있습니다. 그런 다음 클라이언트나 서버가 아닌 완전히 다른 시스템에서 이 액세스 토큰을 사용하여 스팸을 생성하고 데이터를 훔칠 수 있습니다.

서버의 모든 API 호출에 appsecret_proof 매개변수를 추가하고 모든 호출에 대해 인증서를 요청하도록 설정하여 이를 방지할 수 있습니다. 이렇게 하면 악의적인 개발자가 자신의 서버에서 다른 개발자의 액세스 토큰으로 API를 호출할 수 없게 됩니다. Facebook PHP SDK를 사용하고 있다면 appsecret_proof 매개변수는 자동으로 추가되어 있습니다.

(출처 : https://developers.facebook.com/docs/graph-api/securing-requests?locale=ko_KR)


그런 이유로 access_token 이외에 appsecret_proof를 같이 보내야 한다는 거다.



그런데 이런 설명도 있다. 그래서 저기 보이는  Require App Secret(앱시크릿 코드요청) 에 대한 설정을 안하면 appsecret_proof를 추가하지 않아도 된다는 이야기이다. 그래서 저 설정을 No로 설정하면 된다.


이렇게 해서 Facebook 로그인에 대한 샘플이 제대로 작동하는 것을 확인 할 수 있었다. 

간단하게 끝날줄 알았느데 설정 하나 때문에 온갖 고생을 했다. 


728x90
반응형
저작자표시 비영리 변경금지

'Development > Java' 카테고리의 다른 글

[SpringSecurity]Spring Reference 수정  (0) 2018.04.21
[SpringBoot] @Mock, @MockBean 차이가 뭘까?  (2) 2018.04.10
작성중-[SpringBoot] ClassPathResource 의 getFile() 사용시 FileNotFoundException 발생  (0) 2018.01.12
[Spring-Data-JPA]Auditing을 추가해보자  (0) 2017.12.13
[Spring Security] Max Session 적용하기  (0) 2017.11.20
반응형

props 는 컴포넌트에서 사용할 데이터중 변하지 않는 데이터를 다룰때 사용한다. 


Parent 컴포넌트에서 child 컴포넌트로 데이터를 전달할 때 props를 사용한다. 


컴포넌트의 render() 메소드 내부에 {this.props.propsName} 형태로 넣고 컴포넌트에서 사용할 때에는 <> 안에 propsName='value' 형태로 값을 설정 한다. 


- render() 메소드 내부


1
2
3
4
5
6
7
8
9
10
11
12
13
class App extends React.Component {
    render(){
 
        let text = "Hello HI";
 
        return (
            <div>
                <Header title={this.props.headerTitle}/>
                <Content title={this.props.contentTitle} body={this.props.contentBody}/>
            </div>
        );
    }
}
cs


- 컴포넌트


1
2
3
4
ReactDOM.render(<App headerTitle="Welcome"
                    contentTitle="Stranger"
                    contentBody="welcome to ex App"/>
                    , rootElement);
cs



- Default 값 사용시에는 App 내부에 className.defaultProps={propsName:value} 로 설정해주면 된다. 


1
2
3
4
5
6
App.defaultProps={
    headerTitle:'Default header',
    contentTitle: 'Default contentTitle',
    contentBody: 'Default contentBody'
};
 
cs


- propType 지정


1
2
3
4
Content.propType={
    title: React.PropTypes.string,
    body: React.PropTypes.string.isRequired
};
cs


title 과 body 를 모두 string으로 지정하고 body 는 필수로 설정한다. 필수 지정일경우 값이 없으면 오류가 난다.




<이 문서에 작성된 소스는 https://velopert.com 에 게시된 소스 입니다. >


----------------------------------------------------------------------------------------------------------------


추가.


React 에서는 단방향 흐름을 강조하는 것 같다. 그래서 props는 상위 컴포넌트에서 하위 컴포넌트로 전달되는 데이터이며, 또한 이것을 하위 컴포넌트에서 변경되는것은 권장하지 않는것 같다...



728x90
반응형
저작자표시 비영리 변경금지

'Development > Frontend skills' 카테고리의 다른 글

npm install --save --save-dev  (0) 2017.05.30
map() 메소드 사용  (0) 2017.01.16
React.. 끄적끄적.  (0) 2017.01.09
Mac 에서 Node.js 설치  (0) 2017.01.05
jquery radio button 속성 설정  (0) 2013.09.04
반응형

- React는 UI를 만들기 위한 라이브러리이다. framework 가 아니다. 


- React는 Virtual DOM 을 사용한다. 그래서 Virtual DOM의 전후 상태를 비교해서 변경된 부분만 새로 반영한다. 


- 현재 facebook 에서 라이브러리 관리를 하고 있어서 한동안 없어질 일은 없다. 


https://facebook.github.io/react/






728x90
반응형
저작자표시 비영리 변경금지

'Development > Frontend skills' 카테고리의 다른 글

map() 메소드 사용  (0) 2017.01.16
React 에서 props 사용  (0) 2017.01.09
Mac 에서 Node.js 설치  (0) 2017.01.05
jquery radio button 속성 설정  (0) 2013.09.04
JavaScript 객체 변환 toJSON  (0) 2013.05.10
반응형
흠... 왜 이렇게 생각을 못했을까

Balanced Smileys

Your friend John uses a lot of emoticons when you talk to him on Messenger. In addition to being a person who likes to express himself through emoticons, he hates unbalanced parenthesis so much that it makes him go :(

Sometimes he puts emoticons within parentheses, and you find it hard to tell if a parenthesis really is a parenthesis or part of an emoticon.

A message has balanced parentheses if it consists of one of the following:

  • - An empty string ""
  • - One or more of the following characters: 'a' to 'z', ' ' (a space) or ':' (a colon)
  • - An open parenthesis '(', followed by a message with balanced parentheses, followed by a close parenthesis ')'.
  • - A message with balanced parentheses followed by another message with balanced parentheses.
  • - A smiley face ":)" or a frowny face ":("

Write a program that determines if there is a way to interpret his message while leaving the parentheses balanced.

Input

The first line of the input contains a number T (1 ≤ T ≤ 50), the number of test cases. 
The following T lines each contain a message of length s that you got from John.

Output

For each of the test cases numbered in order from 1 to T, output "Case #i: " followed by a string stating whether or not it is possible that the message had balanced parentheses. If it is, the string should be "YES", else it should be "NO" (all quotes for clarity only)

Constraints

  • 1 ≤ length of s ≤ 100

Example input
5
:((
i am sick today (:()
(:)
hacker cup: started :):)
)(

Example output
Case #1: NO
Case #2: YES
Case #3: YES
Case #4: YES
Case #5: NO

  1. public class BalancedSmileys {
  2.     public static void main(String[] args) {
  3.         try {
  4.             BufferedReader in = new BufferedReader(new FileReader("src/code/smile.txt"));
  5.             String lineData;
  6.             int lineNumber = 0;
  7.                        
  8.             while ((lineData = in.readLine()) != null) {
  9.                
  10.                 if (lineNumber >= 1){
  11.                     char[] charData = lineData.toCharArray();
  12.                     int parenthesisOpenCount = 0;
  13.                     int parenthesisCloseCount = 0;             
  14.                        
  15.                     String result = "YES";
  16.                    
  17.                     for(int i=0; i<charData.length; i++){
  18.                         char data = charData[i];
  19.                         char preData = ' ';
  20.                        
  21.                         if (i > 0){
  22.                             preData = charData[i-1];
  23.                         }
  24.                                                
  25.                         if (data == '('){                  
  26.                             parenthesisOpenCount++;
  27.                            
  28.                             if (i > 0 && preData != ':'){
  29.                                 parenthesisCloseCount++;
  30.                             }
  31.                         }else if (data == ')'){
  32.                             parenthesisCloseCount = Math.max(0, parenthesisCloseCount-1);
  33.                            
  34.                             if (i > 0 && preData != ':'){
  35.                                 parenthesisOpenCount--;
  36.                                
  37.                                 if (parenthesisOpenCount < 0){
  38.                                     break;
  39.                                 }
  40.                             }
  41.                         }
  42.                     }
  43.                    
  44.                     if (parenthesisOpenCount >= 0 && parenthesisCloseCount == 0 ){
  45.                         result = "YES";
  46.                     }else{
  47.                         result = "NO";
  48.                     }
  49.                    
  50.                    
  51.                     System.out.println("Case #" + lineNumber + ": " + result);
  52.                 }
  53.                 lineNumber++;
  54.             }
  55.             in.close();
  56.         } catch (IOException e) {
  57.             System.err.println(e);
  58.             System.exit(1);
  59.         }
  60.     }
  61. }


728x90
반응형

'Development > Algorithm' 카테고리의 다른 글

에라토스테네스의 체  (0) 2016.12.07
[Try-catch]대문자 출력  (0) 2013.11.04
[Programing Challenges]반전한 수 더하기  (0) 2013.02.12
[Hacker Cup]Find the Min  (0) 2013.02.01
[Programming Challenges] The 3n+1 Problem  (0) 2011.09.01

+ Recent posts

티스토리툴바