ng2 idle
1.0.0
وحدة للاستجابة للمستخدمين الخمول في التطبيقات الزاوية. هذا هو إعادة كتابة وحدة ng-idle. ومع ذلك ، إذا كنت تستخدم Angular 1 ، فيجب عليك استخدام هذه الوحدة.
المجتمع الزاوي يحتاجك! أبحث عن مطور أو فريق جديد لتولي صيانة هذه الوحدة. هذه هي المسؤوليات التي يجب على أي المرشحين المهتمين مراعاتها:
من الناحية المثالية ، مرشح:
يرجى الاتصال إذا كنت مهتمًا!
تفضل بزيارة https://grbsk.github.io/ng2-idle لعرض مثال بسيط مع تعليمات البداية السريعة.
@ng-idle يتم شحنها عبر NPM. يمكنك تثبيت الحزمة باستخدام الأمر التالي لأحدث إصدار مدعوم من Angular:
npm install --save @ng-idle/core
يتطلب دمج الحزمة وتكوينها في تطبيقك بضع خطوات أخرى. يرجى زيارة @ng-idle-example للحصول على المصدر والتعليمات حول كيفية الذهاب.
التطبيق الأساسي لهذه الوحدة هو اكتشاف عندما يكون المستخدمون خاملين. يمكن أيضًا استخدامه لتحذير المستخدمين من مهلة وشيكة ، ثم الوقت المناسب لهم. جوهر هذه الوحدة هو خدمة Idle التي تبذل قصارى جهدها - استنادًا إلى تكوينك - لاكتشاف متى يكون المستخدم نشطًا أو خمولًا وتمرير هذه المعلومات إلى التطبيق الخاص بك حتى يتمكن من الاستجابة بشكل مناسب.
يمكن العثور على الوظيفة الأساسية في الحزمة @ng-idle/core عبر NPM.
وحدات إضافية لتوسيع الوظائف:
@ng-idle/keepalive (انظر أدناه) في حالة الاستخدام الشائعة حيث يتم استخدامها لإدارة الجلسة ، قد تحتاج إلى الإشارة إلى الخادم بشكل دوري إلى أن المستخدم لا يزال يقوم بتسجيل الدخول ونشطه. إذا كنت بحاجة إلى هذه الوظيفة ، يمكن @ng-idle الاندماج اختياريًا مع @ng-idle/keepalive . سيقوم @ng-idle بتوجيه @ng-idle/keepalive إلى ping بينما يكون المستخدم نشطًا ، ويتوقف بمجرد خروجه من الخمول أو الوقت. عندما يستأنف المستخدم النشاط أو إعادة تعيين حالة الخمول ، فإنه سيؤدي إلى ping على الفور ثم يستأنف ping. يرجى ملاحظة أن تكامل Keepalive اختياري ، ويجب عليك تثبيت وتكوين @ng-idle/keepalive بشكل منفصل للحصول على هذه الوظيفة. يمكنك تنفيذ بنفسك عن طريق توسيع KeepaliveSvc وتكوينه كمزود في طلبك لفئة KeepaliveSvc .
المقاطعة هي أي مصدر للإدخال (عادةً من المستخدم ، ولكن يمكن أن تكون أشياء مثل علامات التبويب الأخرى أو حدث) يمكن استخدامها للإشارة إلى Idle بأنه يجب أن يتم مقاطعة ساعة الخمول أو إعادة ضبطها. على عكس ng-idle ، فإن هذه المصادر ليست متشددة ؛ يمكنك تمديد InterruptSource أو أي من المصادر المدمجة لتناسب أغراضك. هذه الميزة مفيدة أيضًا للتعامل مع ضوضاء الإدخال التي قد تصيب حالة الاستخدام الخاصة بك. يمكن أيضًا استخدامه لاستهداف عناصر محددة على الصفحة بدلاً من المستند أو النافذة بأكملها. تأتي المصادر التالية في هذه الحزمة:
InterruptSource (Abstract): نوع أساسي يمكنك تنفيذه لجعل مصدرك الخاص.EventTargetInterruptSource : أي كائن يقوم بتنفيذ EventTarget ، مثل HTMLElement أو Window . يأخذ في الكائن هو المصدر وسلسلة محددة مساحة تحتوي على الأحداث التي تسبب مقاطعة.DocumentInterruptSource : يبحث عن الأحداث (في سلسلة محددة في الفضاء) html تطفو على document.documentElement .WindowInterruptSource : يبحث عن الأحداث (في سلسلة محددة في الفضاء) التي تتقاطع إلى Window .StorageInterruptSource : يبحث فقط عن حدث Storage كائن Window . إلزامي لـ LocalStorageExpiry . ملاحظة : يجب عليك تكوين المصدر (المصدر) بنفسك عند تهيئة التطبيق. بشكل افتراضي ، لا يتم تكوين أي مقاطعة. يمكنك استخدام تكوين مماثل للإعداد الافتراضي لـ ng-idle عن طريق استيراد DEFAULT_INTERRUPTSOURCES وتمرير هذا الإشارة إلى Idle.setInterrupts(DEFAULT_INTERRUPTSOURCES); .
هناك ميزة أخرى تم نقلها من ng-idle وهي القدرة على تخزين قيمة انتهاء الصلاحية في بعض المتاجر حيث يمكن لعلامات التبويب أو النوافذ المتعددة التي تعمل بنفس التطبيق الكتابة إليها. عادة ، هذا المتجر هو localStorage ، ولكن يمكن أن يكون ملفات تعريف الارتباط أو أي شيء تريده. الغرض من هذا انتهاء الصلاحية ومتجر انتهاء الصلاحية ذو شقين: أولاً ، لمنع نافذة من عدم توقيت الخروج إذا كان ينام أو يتوقف لفترة أطول من فترة المهلة التي تم تكوينها. ثانياً ، يمكن استخدامه بحيث يمنع النشاط في علامة تبويب أو نافذة علامات تبويب أو نوافذ أخرى في نفس التطبيق من التوقيت.
بشكل افتراضي ، يتم توفير نوع LocalStorageExpiry ، والذي سيتتبع انتهاء الصلاحية في LocalStorage. وسوف تفي بجميع الأغراض المذكورة أعلاه. إذا كنت لا ترغب في دعم علامات تبويب أو Windows متعددة ، فيمكنك استخدام SimpleExpiry . بمعنى آخر ، لا ينسق SimpleExpiry النشاط الأخير بين علامات التبويب أو النوافذ. إذا كنت ترغب في تخزين قيمة انتهاء الصلاحية في متجر آخر ، مثل ملفات تعريف الارتباط ، فستحتاج إلى استخدام أو إنشاء تطبيق يدعم ذلك. يمكنك إنشاء خاص بك عن طريق توسيع IdleExpiry أو SimpleExpiry وتكوينه كمزود لفئة IdleExpiry .
يدعم حاقن التبعية في الزاوي استراتيجية الحقن الهرمية. يتيح لك ذلك إنشاء مثيل من Idle في أي نطاق تحتاجه ، ويمكن أن يكون هناك أكثر من مثيل. يتيح لك ذلك الحصول على ساعتين منفصلتين ، على سبيل المثال ، على عنصرين مختلفين على الصفحة.
إذا كنت تستخدم Expiry الافتراضي ( LocalStorageExpiry ) ، فستحتاج إلى تحديد اسم لكل خمول مع Idle.setIdleName('yourIdleName') ، وإلا فإن المفتاح نفسه سيتم استخدامه في المحلي ولن تعمل هذه الميزة كما هو متوقع.
على سبيل المثال ، فكر في تطبيق البريد الإلكتروني. لزيادة الأمان ، قد يرغب التطبيق في تحديد متى يكون المستخدم غير نشط وتسجيله ، مما يتيح لهم فرصة لتمديد جلستهم إذا ما زالوا في الكمبيوتر واشتت انتباههم للتو. بالإضافة إلى ذلك ، بالنسبة للأمان الأفضل ، يجوز للخادم إصدار جلسة المستخدم رمز أمان ينتهي بعد 5 دقائق من عدم النشاط. قد يستغرق المستخدم وقتًا أطول بكثير من ذلك لتكتب بريده الإلكتروني وإرساله. سيكون من المحبط أن تجد أنك مسجلة عندما كنت تستخدم البرنامج بنشاط!
يمكن أن يكتشف @ng-idle/core أن المستخدم ينقر ، والكتابة ، واللمس ، والتمرير ، وما إلى ذلك ، ومعرفة أن المستخدم لا يزال نشطًا. يمكن أن يعمل مع @ng-idle/keepalive لربط الخادم كل بضع دقائق للحفاظ على تسجيل الدخول. في هذه الحالة ، طالما أن المستخدم يقوم بشيء ما ، يظلون مسجلين.
يستخدم @ng-idle/core أحداث DOM على أهداف مختلفة للكشف عن نشاط المستخدم. ومع ذلك ، عند استخدام SSR/Universal Prendering ، لا يتم تشغيل التطبيق دائمًا في المتصفح ، وبالتالي قد لا يمكنه الوصول إلى أهداف DOM هذه ، مما يتسبب في تعطل تطبيقك أو رمي أخطاء محتملة لأنه يحاول استخدام كرات المتصفح مثل document window من خلال @ng-idle.
تم تصميم EventTargetInterruptSource وجميع مصادر المقاطعات التي تستمد منها (مثل DocumentInterruptSource و WindowInterruptSource و StorageInterruptSource ) لتهيئة مستمعي الحدث المستهدف بتكاسل لتوافق مع تقديم جانب الخادم. سوف يكتشف EventTargetInterruptSource ما إذا كان تطبيقك يعمل في المتصفح أو على الخادم باستخدام isPlatformServer وسيخضع تهيئة مستمعي الحدث المستهدف عند التشغيل على الخادم.
تم تطوير هذا المشروع باستخدام إصدار NodeJS الموجود في ملف .nvmrc . قد تواجه مشاكل في استخدام الإصدارات القديمة. جرب NVM أو شبيه بإدارة الإصدارات المختلفة من العقدة بشكل متزامن. إذا كنت تستخدم NVM ، يمكنك تنفيذ nvm install للتنزيل والتبديل إلى الإصدار الصحيح.
بمجرد استنساخ المستودع ، قم بتثبيت جميع الحزم باستخدام npm :
npm install
يمكنك الآن بناء وتشغيل جميع الاختبارات مرة واحدة بالتغطية.
npm test
يمكنك أيضًا إجراء اختبارات بشكل مستمر أثناء إجراء تغييرات على المشروع عن طريق تنفيذ npm run ng test <project name> أو ng test <project name> إذا تم تثبيت @angular/cli على مستوى العالم.
npm run ng test core
...
npm run ng test keepalive
ملاحظة: Keepalive يعتمد على القلب. إذا كنت تقوم بإجراء الاختبارات المستمرة أعلاه ، فستحتاج إلى npm build أو npm run ng build core أولاً وبعد إجراء تغييرات على Core. ومع ذلك ، سيقوم npm test ببناء جميع الوحدات وتشغيل الاختبارات في طلقة واحدة.
انظر دليل المساهمة.
