مهدی سعیدی فر مهدی سعیدی فر
مطالب
نمایش تاریخ شمسی توسط JavaScript در AngularJS
در برنامه‌های مبتنی بر وب رایج، معمولا تبدیل تاریخ میلادی به شمسی در سمت سرور انجام می‌گیرد و تاریخ شمسی حاصل از تبدیل، به کاربر نمایش داده می‌شود. اما در برنامه‌های Single Page و یا به اختصار SPA‌ها که کلاینت فقط با یک سری داده به فرمت JSON  درگیر است، برای نمایش تاریخ شمسی به چه طریقی باید عمل کرد؟ آیا باید تاریخ را در سمت سرور به فرمت مورد نظر تبدیل کرد و یا در سمت کلاینت؟ همه‌ی این‌ها از جمله سوالاتی هست که به هنگام توسعه‌ی SPA‌ها با آن‌ها حتما درگیر خواهید شد.
   
شاید بتوان گفت که در SPA ها، هدف این است که از بار سرور تا حد ممکن کم کرد و آن را در بین کلاینت‌ها توزیع کرد. در SPA‌ها نقش اصلی سرور تامین داده هاست و بیشتر پردازش‌ها در صورت امکان در سمت کلاینت انجام می‌شود و می‌بینید که حتی رندر کردن HTML نیز به عهده‌ی قالب‌های سمت کلاینت است. البته هنوز هم می‌توان قبل از اینکه داده را به فرمت JSON سریالایز کرد، سمت سرور بر روی آن‌ها پیمایش انجام داده و تاریخ‌های میلادی را به شمسی تبدیل کرد که هدف ما این نیست و می‌خواهیم این کار را بر عهده‌ی مرورگر کاربر قرار دهیم.
   
معرفی moment.js
برای کار با داده‌هایی از جنس تاریخ در سمت کلاینت، کتابخانه‌ی جاوا اسکریپتی قدرتمندی به نام moment.js وجود دارد. این کتابخانه دارای انواع و اقسام API برای نمایش و پردازش تاریخ هست. حتی می‌تواند relative time را نیز نمایش دهد. منظور از relative time این هست که به جای نمایش تاریخ، اختلاف آن را با زمان حال نمایش دهد. برای مثال می‌نویسند فلان پست در دو ساعت پیش ارسال شده و زمان دقیق ارسال پست را نمایش نمی‌دهد.
خوشبختانه برای افزودن تاریخ شمسی به این کتاب خانه، افزونه‌ای  به نام moment-jalaali برای آن تدارک دیده شده است. کار با آن نیز بسیار راحت است. کافی است در همان API هایی که برای فرمت کردن تاریخ در moment.js استفاده می‌کردید؛ یک j در ابتدای آن‌ها قرار دهید که مثال‌های کامل استفاده از آن را در مستندات آن می‌توانید مشاهده کنید.
         
نحوه‌ی استفاده از moment.js در AngularJS و ASP.NET
در ASP.NET  فیلد هایی که از جنس DateTime هستند به شکل زیر به فرمت JSON سریالایز می‌شوند:
\/Date(1374222094520)\/
در moment.js احتیاج به کدنویسی برای parse کردن این نوع فرمت و تبدیل کردن آن به تاریخ وجود ندارد؛ چرا که moment.js به صورت تو کار از این نوع فرمت نیز پشتیبانی می‌کند و احتیاجی به کار اضافه‌تر نیست.
moment("/Date(1198908717056-0700)/"); // December 28 2007 10:11 PM
در AngularJS هر گاه قصد داشته باشیم که فرمت نمایش داده‌ها را تغییر دهیم از filter‌ها استفاده می‌کنیم. برای مثال فیلتر uppercase داده name را با حروف بزرگ نمایش می‌دهد.  
{{ name | uppercase }}
حال برای تاریخ نیز می‌خواهیم چنین کاری انجام دهیم؛ بدین صورت که یک فیلتر سفارشی به شکل زیر تعریف کرده تا تاریخ میلادی را به صورت شمسی و با فرمت دلخواهی که می‌خواهیم نمایش دهد:
{{post.date | jalaliDate:'jYYYY/jMM/jDD hh:mm' }}
تعریف فیلتر jalaliDate  نیز به شکل زیر است:
app.filter('jalaliDate', function () {
            return function (inputDate, format) {
                var date = moment(inputDate);
                return date.fromNow() + " " + date.format(format);
            }
        });
خروجی این فیلتر نیز به شکل "4 ماه پیش 1392/12/07 03:10" است و مشاهده می‌کنید که به کمک filter‌ها در AngularJS انجام این گونه از کارها بسیار ساده و لذت بخش است.
   
توجه کنید که این فقط یک ایده‌ی ابتدایی و ساده از پیاده سازی فیلتر فوق است. قطعا با کمک API‌های متنوع momentjs و پارامتر‌های ورودی فیلتر، می‌توان فیلتری بسیار پیشرفته‌تر تعریف کرد.
    
دریافت کدهای یک مثال پیاده سازی شده با استفاده از کدهای فوق
     
‫۱۰ سال و ۴ ماه قبل، چهارشنبه ۱۱ تیر ۱۳۹۳، ساعت ۲۲:۲۵
وحید نصیری وحید نصیری
نظرات مطالب
امن سازی برنامه‌های ASP.NET Core توسط IdentityServer 4x - قسمت دوازدهم- یکپارچه سازی با اکانت گوگل
یک نکته‌ی تکمیلی
- گوگل، پلتفرم Google Plus را که برای تکمیل این قسمت از آن استفاده شده، در January 28th 2019 تعطیل می‌کند. جایگزین آن در اینجا بحث شده‌است: «Google+ based auth deprecation and replacement »
‫۵ سال و ۹ ماه قبل، چهارشنبه ۱۹ دی ۱۳۹۷، ساعت ۱۴:۵۵
وحید نصیری وحید نصیری
نظرات مطالب
استفاده از پروایدر SQLite در Entity Framework 7
یک نکته‌ی تکمیلی: اگر از بانک اطلاعاتی SQLite استفاده می‌کنید، بهتر است از API غیرهمزمان EF-Core، برای کار با آن استفاده نکنید!

توصیه عمومی جهت کار با بانک‌های اطلاعاتی، استفاده از API غیرهمزمان (async) آن‌ها برای انجام هر نوع عملیات I/O مرتبط با آن‌هاست؛ اما ... SQLite، هیچگونه I/O شبکه‌ای را به همراه ندارد و همچنین پشت صحنه‌ی پیاده سازی آن نیز مبتنی بر استفاده‌ی از متدهای متداول همزمان است. برای مثال SQLite جهت پیاده سازی حالت WAL آن، از تابع همزمان ()fsync استفاده می‌کند و عملا Asynchronous I/O ای در اینجا رخ نمی‌دهد. یکی از مهم‌ترین مزایای فعال بودن حالت WAL، امکان کار چند ریسمانی با بانک اطلاعاتی SQLite، بدون دریافت خطای «Error: database is locked» است که سبب می‌شود بتوان از این بانک اطلاعاتی، بدون بروز هیچ مشکلی، در برنامه‌های وب نیز استفاده کرد.
یعنی API async آن (منظور API ای که توسط EF-Core ارائه می‌شود)، صرفا یک شبه محصور کننده‌ی blocking API همزمان آن است (یک async تقلبی!) و بیشتر سبب بروز یک سربار ناخواسته می‌شود؛ تا اینکه بهبود کارآیی خاصی را به همراه داشته باشد. به همین جهت بهتر است حین کار با بانک اطلاعاتی SQLite، از همان synchronous API معمولی و متداول آن استفاده شود.
‫۱۹ روز قبل، دوشنبه ۹ مهر ۱۴۰۳، ساعت ۱۱:۵۹
علی یگانه مقدم علی یگانه مقدم
اشتراک‌ها
Number Spinner با امکانات بسیار مناسب

در صورتی که نیاز دارید برای برنامه خود یک شمارنده که توسط کاربر تنظیم میشود قرار دهید این پلاگین جی کوئری مورد بسیار مناسبی است. تمامی پراپرتی‌ها و رویدادهایی که کاربردی و مورد نیاز هستند در این کتابخانه گنجانده شده اند.

<script>
$(document).ready(function(){
$("#number-picker").dpNumberPicker({
min: false, // Minimum value.
max: false, // Maximum value.
value: 0, // Initial value
step: 1, // Incremental/decremental step on up/down change.
format: false,
editable: true,
addText: "+",
subText: "-",
formatter: function(val){return val;},
beforeIncrease: function(){},
afterIncrease: function(){},
beforeDecrease: function(){},
afterDecrease: function(){},
beforeChange: function(){},
afterChange: function(){},
onMin: function(){},
onMax: function(){}
});
</script>


Number Spinner با امکانات بسیار مناسب
‫۴ سال و ۱ ماه قبل، یکشنبه ۲۶ مرداد ۱۳۹۹، ساعت ۰۰:۴۸
وحید نصیری وحید نصیری
نظرات مطالب
پیاده سازی JSON Web Token با ASP.NET Web API 2.x
سیستم identity یک سیستم مبتنی بر کوکی‌ها هست و زمانیکه لاگین می‌کنید، Claims کاربر در یک کوکی رمزنگاری شده درج می‌شود تا در درخواست بعدی، پردازش شده و اطلاعات شیء this.User را مقدار دهی کند. بنابراین ترکیب آن در اینجا (یک سیستم مبتنی بر توکن‌ها) فقط از دیدگاه مدیریت کاربران و نقش‌های آن معنا پیدا می‌کند و چون در طراحی این مطلب از لایه سرویس استفاده شده و لایه سطح بالاتر از پیاده سازی‌های جزئیات آن باخبر نیست و وابستگی‌های مورد نیاز را تنها از طریق تزریق وابستگی‌ها دریافت می‌کند، فقط کافی است UsersService.cs را با توجه به سیستم identity بازنویسی کنید.
‫۶ سال و ۷ ماه قبل، سه‌شنبه ۱۵ اسفند ۱۳۹۶، ساعت ۲۳:۲۰