Vue.js28 [Vue.js][Error] Cannot read property 'signin2' of undefined web application에 Google OAuth 2.0을 적용하는데 있어서, 발생할 수 있는 Error에 대해서 알아보겠습니다. 구현하는 방식은 Google Platform Library를 해당 library가 onload가 되면 init function을 호출하게 됩니다. 해당 function에서는 init을 하고나서 new Event를 생성하게 됩니다. 그리고 바로 dispatchEvent로 Event를 creating하게 되는 것이죠. 이렇게 되면, 전역으로 'google-oauth-library-load' 이름을 가진 Event가 생성되었습니다. 그럼 해당 이벤트를 받아서 사용할 코드를 원하는 곳에 작성해주면 됩니다. 저는 Login.vue에 기능을 구현하기 때문에 해당 파일에 addEven.. 2021. 4. 7. [Vue.js] 19. Google OAuth 2.0 사용하기 (2) 지난 시간에 이어서 Goolge OAuth 2.0을 web application에 적용하는 방법을 알아보겠습니다. 전체적인 단계는 아래의 순서로 살펴보겠습니다. Create user authorization credentials web application에 적용해서 Login / Logout 구현하기 Token 전송 및 Google API 호출 / 사용하기 Create user authorization credentials을 진행했으니, 나의 web application에서는 해당 OAuth 2.0 Client ID를 이용해서 Google OAuth를 통해 Login이 가능한 환경이 되었습니다. 제가 적용을 하려고 하는 web applicaton은 vue.js 2.9.6 입니다. 그렇다면 vue.js에.. 2021. 4. 6. [Vue.js] 18. Google OAuth 2.0 사용하기 (1) 요즘은 많은 Application에서 자체적으로 구현한 Login이 아닌 Google, Facebook, Naver등 에서 제공하는 방식으로 Login이 가능하게 구현하고 있습니다. 이를 통해서, 개별 개발자의 입장에서는 별도의 노력으로 Login을 구현할 필요가 없어졌으며, 보안적으로 인증된 곳에서 제공하는 방식을 사용해서 좀 더 안정적인 서비스를 가능하게 할 수 있습니다. OAuth 2.0이란 인증에 대한 산업 표준방식입니다. 이 방식은 web application에서 인증을 제공하는데 있어 서 개발자가 간편하게 제공할 수 있게 하는데 초점이 맞춰져 있습니다. 따라서 위에서 언급한 Google, Facebook, Naver등의 제공업체의 OAuth2.0은 대부분 비슷한 방식으로 구현이 가능합니다. 그.. 2021. 4. 5. [Vue.js] 17. use chart.js event and label plugin listeners 이번 시간에는 vue-chartjs를 통해서 그린 chart에 대해서 마우스를 올렸을 때, tooltips로 자동제공하는 정보가 아닌... 마우스 click이나 기타 event(이벤트)를 발생시켜서 원하는 동작을 하게하는 방법에 대해서 알아보겠습니다. 저같은 경우에는 위의 그림과 같이 그려진 chart의 dataset중 한개의 특정 data를 선택하여 click을 하게되면, 해당 data와 관련된 다른 정보를 보여주거나, 다른 기능을 추가로 제공하고자 했었습니다. 따라서 그것이 가능하기위한 기능을 추가해야 했는데... 그게 바로 아래의 2가지 방법입니다. 그럼 각 방법에 대해서 알아보도록 하겠습니다. 1. chart.js Events chart.js의 docs를 살펴보면, General > Interac.. 2021. 4. 1. 이전 1 2 3 4 5 ··· 7 다음
