Ionic / Cordova 앱에서 인증
우선 저는 프로가 아닙니다.
더 나은 개발자가되기위한 탐구에서 Ionic-Framework 앱에 대한 가입 / 로그인 생성을 수행하는 방법과 필요한 사항을 이해하려고합니다.
대부분의 SPA (단일 페이지 응용 프로그램)는 클라이언트 용 HTML도 제공하는 노드 서버에서 인증을 처리합니다. 제 경우에는 전화 자체가 HTML을 제공하므로 일부 COR 문제에 맞설 수 있다고 생각합니다.
Ionic-Framework는 내 앱에서 상태를 변경할 때마다 인증해야하는 상태 및 기반 angular-client-side-auth repo를 사용한다는 것을 이해합니다 .
초기 앱 설정이 있지만 이제 여기서 어디로 가야할지 혼란 스럽습니다.
내가 사용할 수있는 도구 :
- Node.JS 서버-DigitalOcean에게 감사드립니다 (이것을 DB에 대한 프록시로 사용해야합니까?).
- CouchDB 서버 (여기에 전체 스택이 있습니다)
내 질문 :
- 하이브리드 앱을 사용할 때 인증을위한 표준 접근 방식은 무엇입니까?
- Node.JS를 데이터베이스에 대한 프록시로 사용해야합니까?
- node.js를 건너 뛰고 CouchDB 서버에서 직접 인증해야합니까? (들어 본 적 있음)
- 내가 이것에 대해 잘못된 방향으로 가고 있습니까?
- 내 잠재적 장애물은 무엇입니까?
- CORS는 하이브리드 애플리케이션과 어떻게 작동합니까?
- 내가 놓친 것이 있습니까?
더 나은 개발자가되도록 도와 주셔서 감사합니다.
네, 대답 할 것이 많습니다. 그러나 간단한 대답은 일반 웹 앱처럼 단순하게 유지하고 인증하는 것입니다.
일반 웹 앱에서 :
- 일반 웹 앱에서는 서버에 요청을 보내고 데이터베이스에서 자격 증명을 확인하여 사용자를 인증합니다.
모바일 앱에서 :
- 모바일 앱에서는 ajax 요청을 통해 동일한 작업을 수행합니다 (angular의 경우 $ http 사용).
- 서버에서 인증이 완료되면 인증 결과를 프런트 엔드에 알리는 응답을 앱 (예 : json / xml)으로 다시 보냅니다.
표준 접근 방식은 무엇입니까?
- 표준에 대해서는 잘 모르겠지만 이것이 가장 쉬운 방법 인 것 같습니다. 표준은 항상 더 나은 방법이 있기 때문에 항상 변합니다. 작업이 완료되는 한 나중에 개선하십시오.
Node.JS를 databse의 프록시로 사용해야합니까?
- 나는 nodeJ를 많이 사용하지 않았기 때문에 당신이 정말로 의미하는 바를 모르겠습니다. 그러나 그것이 도움이된다면-나는 ajax 요청을 수신하는 서버에서 php를 사용하고 mysql 데이터베이스로 인증을 처리하고 모바일 앱에 응답을 반환합니다.
내가 이것에 대해 잘못된 방향으로 가고 있습니까?
- 초기 설정을 보지 못했습니다. 앱에서 상태를 변경할 때마다 인증하는 한 성공적인 로그인 후 localStorage를 사용하여 사용자 정보를 저장할 수 있습니다. 로그 아웃시 localStorage를 지 웁니다. 따라서 사용자가 로그인했는지 확인하기 위해 localStorage에 값이 있는지 확인하기 만하면됩니다.
내 잠재적 장애물은 무엇입니까?
- 앱 만들기를 시작하면 곧 알게 될 것입니다. 전체적으로 ionic + cordova는 일을 매우 간단하게 만들고 앱 개발에 대한 대부분의 장애물을 제거합니다.
CORS는 하이브리드 애플리케이션과 어떻게 작동합니까?
- Cordova는 기본적으로 교차 도메인 요청을 허용하므로 교차 도메인 요청에 문제가 없으므로 직접 인증을 위해 서버에 액세스 할 수 있습니다.
내가 놓친 것이 있습니까?
IonicFramework 는 단지 프론트 엔드 HTML5 프레임 워크입니다. 그것만으로는 모바일 앱이 될 수 없으며, 작업하기에 좋은 UI를 제공합니다. IonicFramework는 각도를 사용하여 구현하는 몇 가지 멋진 자바 스크립트 기능 을 제공합니다 . 따라서 ionic을 최대한 활용하려면 angularJs에 능숙해야합니다. 각도를 배우는 것은 노력할만한 가치가 있습니다.
실제 앱은 Cordova에서 컴파일합니다. Cordova는 일반 html / css / javascript 파일을 Android apk 또는 iphone ipa로 패키징하여 각 OS에 기본 앱으로 설치할 수 있도록합니다.
Cordova를 사용하면 카메라, 갤러리, 연락처 등과 같은 기본 전화 기능에 액세스 할 수 있습니다.
2015 년 6 월 3 일 업데이트 됨
토큰 기반 인증 : 대안이라고 생각합니다. 이제 쉽게 사용할 수있는보다 깨끗하고 안전한 인증 처리 방법입니다.
자세한 내용은 다음 링크를 확인하십시오.
- Angular jwt (프런트 엔드에서 각도를 사용하는 앱용)
- Video Talk : JWT를 사용하여 앱을 안전하게 만들기 (jwt.io 제작자 제공)
- Jwt.io (jwt 공식 웹 사이트)
- Laravel 용 Jwt-Auth (백엔드에서 Laravel을 사용하는 경우)
토큰 기반 접근 방식을 사용하면 어떤 이점이 있습니까?
Cross-domain / CORS: cookies + CORS don't play well across different domains. A token-based approach allows you to make AJAX calls to any server, on any domain because you use an HTTP header to transmit the user information. Stateless (a.k.a. Server side scalability): there is no need to keep a session store, the token is a self-contanined entity that conveys all the user information. The rest of the state lives in cookies or local storage on the client side.
CDN: you can serve all the assets of your app from a CDN (e.g. javascript, HTML, images, etc.), and your server side is just the API. Decoupling: you are not tied to a particular authentication scheme. The token might be generated anywhere, hence your API can be called from anywhere with a single way of authenticating those calls.
Mobile ready: when you start working on a native platform (iOS, Android, Windows 8, etc.) cookies are not ideal when consuming a secure API (you have to deal with cookie containers). Adopting a token-based approach simplifies this a lot. CSRF: since you are not relying on cookies, you don't need to protect against cross site requests (e.g. it would not be possible to your site, generate a POST request and re-use the existing authentication cookie because there will be none).
Performance: we are not presenting any hard perf benchmarks here, but a network roundtrip (e.g. finding a session on database) is likely to take more time than calculating an HMACSHA256 to validate a token and parsing its contents.
Login page is not an special case: If you are using Protractor to write your functional tests, you don't need to handle any special case for login. Standard-based: your API could accepts a standard JSON Web Token (JWT). This is a standard and there are multiple backend libraries (.NET, Ruby, Java, Python, PHP) and companies backing their infrastructure (e.g. Firebase, Google, Microsoft). As an example, Firebase allows their customers to use any authentication mechanism, as long as you generate a JWT with certain pre-defined properties, and signed with the shared secret to call their API.
nathvarun gave a very complete answer, but I'd like to share the steps I do for authentication in my app.
- Send
email
+password
via ajax to the server - Generate a
token
in the server and send it back to the app - Store
email
+token
inlocalStorage
- For every single request I make to the server I send
email
+token
viaPOST
- In the server I verify authenticity of that user with that token, if
true
the method is executed, iffalse
I send back to the app an error (401) - If app receives success, then it's ok, if receives error I redirect to login screen.
Nice thing is that when the app is open, you can get the email
+ token
from localStorage
, send to the server, if that token is ok for that user, redirect to main screen, otherwise redirect to login. Then whenever user clears the cache of the app, he is redirected to login screen.
I actually needed something like that for a few apps I'm working on. I spent quite some time investigating this and was able to achieve that.
I'm pretty happy with the result, in addition to email/password authentication I've added some social authentication which works in the same way.
- open url on client side with the provider's (facebook/twitter/instagram) url for login
- the user logs in and is redirected to the server's callback url (my server is written in nodejs)
- once I've got the access token from the provider. I save this token and then create a token for the client to reuse every time the user wants to access a protected ressource.
Download the apk and test it.
If this is what you're looking for you can checkout both the client side code at : https://github.com/malikov/Authenticate.me-client-cordova-ionic
And the server side code at : https://github.com/malikov/Authenticate.me-Node-Server
참고URL : https://stackoverflow.com/questions/22165024/authentication-in-ionic-cordova-app
'Development Tip' 카테고리의 다른 글
NDK에서 애플리케이션 디렉토리를 찾을 수 없습니다. (0) | 2020.11.17 |
---|---|
Python 처리 socket.error : [Errno 104] 피어에서 연결 재설정 (0) | 2020.11.17 |
속성 내부 보간을 해결하는 방법이 제거되었습니다. (0) | 2020.11.17 |
Flutter에서 "젖빛 유리"효과를 어떻게하나요? (0) | 2020.11.17 |
직렬화에는 숨겨진 필드가 포함되지 않습니다. (0) | 2020.11.17 |