Many developers I talk to are either using Docker actively or planning to adopt containers in their environment. Containers are an important trend in our industry and .NET is part of that. Microsoft and Docker have been working together so that you’ll have a great experience using Docker with .NET apps.
افرادی که بیشتر از 3000 تا اعتبار دارند، می‌توانند نامزد شوند.
public IActionResult Get()
{
var userData = new User
{
Name = "Farhad",
Family = "Zamani"
};
_logger.LogInformation($"ValuesController called. Name:{userData.Name}, Family:{userData.Family}");
return Ok();
} 
اگر بخواهیم مرتب سازی و یا فیلتری را بر روی Name و یا Family انجام دهیم، کار آسانی نخواهد بود و وقت‌گیر خواهد بود؛ زیرا باید با یک فیلد رشته ( message )، که تمامی لاگ درون آن قرار دارد، کار کنیم. اما با استفاده از قابلیت Structured Logging مربوط به Serilog، می‌توانیم آبجکت userData را به ILogger پاس دهیم و پراپرتی‌های آن را به صورت فیلدهای جدا نمایش دهیم.
برای این کار باید آبجکت موردنظر خود را درون {} قرار دهیم و قبل از نام متغییر آن یک @ قرار دهیم. بدین صورت: {userData@} و سپس دیتای موردنظر را در پارامتر دوم logger قرار دهیم.
_logger.LogInformation("ValuesController called. {@userData}", userData); اگر کد نوشته شده مربوط به ثبت لاگ را به صورت زیر اصلاح کنیم:
public IActionResult Get()
{
var userData = new User
{
Name = "Farhad",
Family = "Zamani"
};
_logger.LogInformation("ValuesController called. {@userData}", userData);
return Ok();
} در پنل کیبانا به راحتی می‌توان عملیات مرتب سازی و یا فیلتر را بر روی پراپرتی‌های Name و Family انجام دهیم. اکنون اگر پنل کیبانا را تماشا کنید چنین لاگی را مشاهده میکنیم:
هرکدام از پراپرتی‌های userData به صورت یک فیلد جدا ارسال شده‌است که به راحتی می‌توانید مرتب سازی، فیلتر و... را بر روی هرکدام از فیلدها انجام دهید.
تنظیمات مربوط به Serilog:
public static void Main(string[] args)
{
var configuration = new ConfigurationBuilder()
.AddJsonFile("appsettings.json", optional: false, reloadOnChange: true)
.Build();
Log.Logger = new LoggerConfiguration()
.Enrich.FromLogContext()
.Enrich.WithMachineName()
.Filter.ByExcluding(Matching.FromSource("Serilog"))
.Filter.ByExcluding(Matching.FromSource("System.Net.Http"))
.Filter.ByExcluding(Matching.FromSource("Microsoft.AspNetCore"))
.WriteTo.Console()
.ReadFrom.Configuration(configuration)
.CreateLogger();
CreateHostBuilder(args).Build().Run();
}
public static IHostBuilder CreateHostBuilder(string[] args) =>
Host.CreateDefaultBuilder(args)
.UseSerilog()
.ConfigureWebHostDefaults(webBuilder =>
{
webBuilder.UseStartup<Startup>();
}); فایل appsettings.json:
{
"Logging": {
"LogLevel": {
"Default": "Information",
"Microsoft": "Warning",
"Microsoft.Hosting.Lifetime": "Information"
}
},
"AllowedHosts": "*",
"Serilog": {
"WriteTo": [
{
"Name": "Elasticsearch",
"Args": {
"nodeUris": "http://127.0.0.1:9200;",
"indexFormat": "structuredlogging-{0:yyyy.MM}",
"templateName": "structuredlogging"
}
}
]
}
} فایل docker-compose برای اجرای Elasticsearch و Kibana:
version: '3'
services:
elasticsearch:
container_name: elasticsearch
image: elasticsearch:7.14.2
environment:
- discovery.type=single-node
ports:
- 9200:9200
- 9300:9300
- 8200:8200
kibana:
container_name: kibana
image: kibana:7.14.2
ports:
- 5601:5601
منابع استفاده شده:
// The getDate() function returns a nested function which refers the 'date' variable defined
// by outer function getDate()
function getDate() {
var date = new Date(); // This variable stays around even after function returns
// nested function
return function () {
return date.getMilliseconds();
}
}
// Once getDate() is executed the variable date should be out of scope and it is, but since // the inner function // referenes date, this value is available to the inner function. var dt = getDate(); alert(dt()); alert(dt());
function myNonClosure() {
var date = new Date();
return date.getMilliseconds();
}
var MyDate = function () {
var date = new Date();
var getMilliSeconds = function () {
return date.getMilliseconds();
}
}
var dt = new MyDate();
alert(dt.getMilliSeconds()); // This will throw error as getMilliSeconds is not accessible.
// This is closure
var MyDate = function () {
var date = new Date(); // variable stays around even after function returns
var getMilliSeconds = function () {
return date.getMilliseconds();
};
return {
getMs : getMilliSeconds
}
}
var dt = new MyDate(); alert(dt.getMs()); // This should work.
(function($) {
// $() is available here
})(jQuery);
// file1.js
function saveState(obj) {
// write code here to saveState of some object
alert('file1 saveState');
}
// file2.js (remote team or some third party scripts)
function saveState(obj, obj2) {
// further code...
alert('file2 saveState");
}
<script src="file1.js" type="text/javascript"></script> <script src="file2.js" type="text/javascript"></script>
function App() {
var save = function (o) {
// write code to save state here..
// you have acces to 'o' here...
alert(o);
};
return {
saveState: save
};
}
var app = new App();
app.saveState({ name: "rajesh"});
fetchProducts(categoryId?: number) {
console.log(categoryId);
this.products = [];
if (categoryId === undefined || categoryId.toString() === "undefined") {
return;
} 
> npm install ng2-toasty --save
npm ERR! Error: EPERM: operation not permitted, rename
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"../node_modules/ng2-toasty/bundles/style-bootstrap.css",
"styles.css"
], import { ToastyModule } from "ng2-toasty";
@NgModule({
imports: [
BrowserModule,
ToastyModule.forRoot(), <ng2-toasty [position]="'top-right'"></ng2-toasty>
import { ToastyService, ToastOptions } from "ng2-toasty";
export class ProductGroupComponent implements OnInit {
constructor(
private productItemsService: ProductItemsService,
private toastyService: ToastyService) { }
fetchProducts(categoryId?: number) {
console.log(categoryId);
this.products = [];
if (categoryId === undefined || categoryId.toString() === "undefined") {
this.toastyService.error(<ToastOptions>{
title: "Error!",
msg: "Please select a category.",
theme: "bootstrap",
showClose: true,
timeout: 5000
});
return;
} 
this.productItemsService.getCategories().subscribe(
data => {
this.categories = data;
},
err => console.log("get error: ", err)
); > ng g cl app.error-handler
installing class create src\app\app.error-handler.ts
import { ErrorHandler } from "@angular/core";
export class AppErrorHandler implements ErrorHandler {
handleError(error: any): void {
console.log("Error:", error);
}
} import { NgModule, ErrorHandler } from "@angular/core";
import { AppErrorHandler } from "./app.error-handler";
@NgModule({
providers: [
{ provide: ErrorHandler, useClass: AppErrorHandler }
] [HttpGet("[action]/{categoryId:int}")]
public async Task<IActionResult> GetProducts(int categoryId)
{
throw new Exception(); this.productItemsService.getProducts(categoryId).subscribe(
data => {
this.products = data;
this.isLoadingProducts = false;
}// ,
// err => {
// console.log("get error: ", err);
// this.isLoadingProducts = false;
// }
); 
import { ToastyService, ToastOptions } from "ng2-toasty";
import { ErrorHandler } from "@angular/core";
export class AppErrorHandler implements ErrorHandler {
constructor(private toastyService: ToastyService) {
}
handleError(error: any): void {
// console.log("Error:", error);
this.toastyService.error(<ToastOptions>{
title: "Error!",
msg: "Fatal error!",
theme: "bootstrap",
showClose: true,
timeout: 5000
});
}
} Uncaught Error: Can't resolve all parameters for AppErrorHandler: (?).
import { ErrorHandler, Inject } from "@angular/core";
export class AppErrorHandler implements ErrorHandler {
constructor(
@Inject(ToastyService) private toastyService: ToastyService
) {
} import { ToastyService, ToastOptions } from "ng2-toasty";
import { ErrorHandler, Inject, NgZone } from "@angular/core";
import { LocationStrategy, PathLocationStrategy } from "@angular/common";
export class AppErrorHandler implements ErrorHandler {
constructor(
@Inject(NgZone) private ngZone: NgZone,
@Inject(ToastyService) private toastyService: ToastyService,
@Inject(LocationStrategy) private locationProvider: LocationStrategy
) {
}
handleError(error: any): void {
// console.log("Error:", error);
const url = this.locationProvider instanceof PathLocationStrategy ? this.locationProvider.path() : "";
const message = error.message ? error.message : error.toString();
this.ngZone.run(() => {
this.toastyService.error(<ToastOptions>{
title: "Error!",
msg: `URL:${url} \n ERROR:${message}`,
theme: "bootstrap",
showClose: true,
timeout: 5000
});
});
// IMPORTANT: Rethrow the error otherwise it gets swallowed
// throw error;
}
} 
>npm install >ng build --watch
>dotnet restore >dotnet watch run
public class Service
{
public int ServiceId { get; set; }
public string ServiceName { get; set; }
} public interface ICoreService
{
Service LoadDefaultService();
} An unhandled exception occurred while processing the request InvalidOperationException: Unable to resolve service for type 'WebApplication1.Models.ICoreService' while attempting to activate 'WebApplication1.Controllers.HomeController' Microsoft.Extensions.Internal.ActivatorUtilities.GetService(IServiceProvider sp, Type type, Type requiredBy, Boolean isDefaultParameterRequired)
namespace Microsoft.Extensions.DependencyInjection
{
//
// Summary:
// Specifies the lifetime of a service in an Microsoft.Extensions.DependencyInjection.IServiceCollection.
public enum ServiceLifetime
{
//
// Summary:
// Specifies that a single instance of the service will be created.
Singleton = 0,
//
// Summary:
// Specifies that a new instance of the service will be created for each scope.
//
// Remarks:
// In ASP.NET Core applications a scope is created around each server request.
Scoped = 1,
//
// Summary:
// Specifies that a new instance of the service will be created every time it is
// requested.
Transient = 2
}
} public void ConfigureServices(IServiceCollection services)
{
ServiceDescriptor descriptor = new ServiceDescriptor(typeof(ICoreService),typeof(CoreServise),ServiceLifetime.Transient);
services.Add(descriptor);
services.AddMvc();
} 
ساخت یک Service Descriptor و اضافه کردن آن به سرویسها، فلسفه وجودی میان افزارها را زیر سوال می‌برد. پس بجای ایجاد یک Service Descriptor، از متدهای الحاقی تدارک دیده شده استفاده میکنیم. مثلا بجای دو خط کد بالا می‌توان از کد زیر استفاده نمود:
services.AddTransient<ICoreService,CoreServise>();
حال که یک دید کلی از نحوه کار مکانیزم تزریق وابستگی بدست آوردیم، میخواهیم این مکانیزم را با StructureMap جایگزین کنیم. بدین منظور ابتدا پکیج StructureMap را نصب میکنم.
در مرحله اول باید کلاسهایی را تدارک ببینیم که اینترفیس‌های بالا را پیاده سازی نمایند. یعنی کلاسهای ما باید بتوانند همان کاری را انجام دهند که مکانیزم پیش فرض MVC انجام می‌دهد.
اولین مورد، کلاس StructureMapServiceProvider می‌باشد.
internal class StructureMapServiceProvider : IServiceProvider
{
private readonly IContainer _container;
public StructureMapServiceProvider(IContainer container, bool scoped = false)
{
_container = container;
}
public object GetService(Type type)
{
try
{
return _container.GetInstance(type);
}
catch
{
return null;
}
}
} مورد دوم کلاس StructureMapServiceScope می‌باشد:
internal class StructureMapServiceScope : IServiceScope
{
private readonly IContainer _container;
private readonly IContainer _childContainer;
private IServiceProvider _provider;
public StructureMapServiceScope(IContainer container)
{
_container = container;
_childContainer = _container.GetNestedContainer();
_provider = new StructureMapServiceProvider(_childContainer, true);
}
public IServiceProvider ServiceProvider => _provider;
public void Dispose()
{
_provider = null;
if (_childContainer != null)
_childContainer.Dispose();
}
} مورد سوم StructureMapServiceScopeFactory می‌باشد:
internal class StructureMapServiceScopeFactory : IServiceScopeFactory
{
private IContainer _container;
public StructureMapServiceScopeFactory(IContainer container)
{
_container = container;
}
public IServiceScope CreateScope()
{
return new StructureMapServiceScope(_container);
}
} مورد بعدی کلاس StructureMapPopulator می‌باشد. وظیفه این کلاس جمع آوری اطلاعات مربوط به سرویسها می‌باشد.
internal class StructureMapPopulator
{
private IContainer _container;
public StructureMapPopulator(IContainer container)
{
_container = container;
}
public void Populate(IEnumerable<ServiceDescriptor> descriptors)
{
_container.Configure(c =>
{
c.For<IServiceProvider>().Use(new StructureMapServiceProvider(_container));
c.For<IServiceScopeFactory>().Use<StructureMapServiceScopeFactory>();
foreach (var descriptor in descriptors)
{
switch (descriptor.Lifetime)
{
case ServiceLifetime.Singleton:
Use(c.For(descriptor.ServiceType).Singleton(), descriptor);
break;
case ServiceLifetime.Transient:
Use(c.For(descriptor.ServiceType), descriptor);
break;
case ServiceLifetime.Scoped:
Use(c.For(descriptor.ServiceType), descriptor);
break;
}
}
});
}
private static void Use(GenericFamilyExpression expression, ServiceDescriptor descriptor)
{
if (descriptor.ImplementationFactory != null)
{
expression.Use(Guid.NewGuid().ToString(), context => { return descriptor.ImplementationFactory(context.GetInstance<IServiceProvider>()); });
}
else if (descriptor.ImplementationInstance != null)
{
expression.Use(descriptor.ImplementationInstance);
}
else if (descriptor.ImplementationType != null)
{
expression.Use(descriptor.ImplementationType);
}
else
{
throw new InvalidOperationException("IServiceDescriptor is invalid");
}
}
} و در آخر کلاس StructureMapRegistration می‌باشد:
public static class StructureMapRegistration
{
public static void Populate(this IContainer container, IEnumerable<ServiceDescriptor> descriptors)
{
var populator = new StructureMapPopulator(container);
populator.Populate(descriptors);
}
} نهایتاً باید متد ConfigurationServices در کلاس StartUp را اندکی تغییر دهیم.
public IServiceProvider ConfigureServices(IServiceCollection services)
{
services.AddMvc();
var container = new Container();
container.Configure(configure =>
{
configure.For<ICoreService>().Use<CoreServise>();
});
container.Populate(services);
return container.GetInstance<IServiceProvider>();
} در کد بالا، متد ConfigurationServices به جای آنکه Void برگرداند، نمونه‌ای از اینترفیس IServiceProvider را برمی‌گرداند. حال اگر برنامه را اجرا کنیم، وابستگی‌ها توسط StructureMap تزریق شده و برنامه بدون هیچ مشکلی اجرا میشود.
using (var converter = new Converter())
{
converter.ConvertToPdf(new ConvertUri(SourcePath),
"output.pdf",
new PageSettings(PaperFormat.A4)
{
DisplayHeaderFooter = true,
HeaderTemplate = header,
FooterTemplate = footer,
PrintBackground = true,
});
converter.ConvertToImage(new ConvertUri(tempSourcePath),
"output.png",
new PageSettings(PaperFormat.A6));
} var header = """
<div class="text center" style="color: lightgray;border-bottom: solid lightgray 0.1px; width: 100%; font-family: 'Samim'; font-size:7px;">
<span class="title"></span>
</div>
""";
var footer = """
<div class="text center" style="color: lightgray; font-family: 'Samim'; font-size:7px;">
<span class="pageNumber"></span>/<span class="totalPages"></span>
</div>
"""; var HTML = "<HTML code>";
using (Converter converter = new Converter())
using (MemoryStream stream = new MemoryStream())
{
// This is necessary when running on Docker
converter.AddChromeArgument("--no-sandbox");
// Create PDF out of HTML string
converter.ConvertToPdf(html, stream, new ChromeHtmlToPdfLib.Settings.PageSettings());
// Return file to user
return File(stream.ToArray(), MediaTypeNames.Application.Pdf, "Report.pdf");
} bower install chosen
{
"name": "asp-net-mvc5x-angular2x",
"version": "1.0.0",
"authors": [
"DNT"
],
"license": "MIT",
"ignore": [
"node_modules",
"bower_components"
],
"dependencies": {
"chosen": "1.4.2"
},
"devDependencies": {
}
} <script src="~/node_modules/jquery/dist/jquery.min.js"></script> <script src="~/node_modules/bootstrap/dist/js/bootstrap.min.js"></script> <script src="~/bower_components/chosen/chosen.jquery.min.js"></script> <link href="~/bower_components/chosen/chosen.min.css" rel="stylesheet" type="text/css" />
declare var jQuery: any;
constructor(private _el: ElementRef) {
} import { Component, ElementRef, AfterViewInit } from "@angular/core";
declare var jQuery: any; // untyped
@Component({
templateUrl: "app/using-jquery-addons/using-jquery-addons.component.html"
})
export class UsingJQueryAddonsComponent implements AfterViewInit {
dropDownItems = ["First", "Second", "Third"];
selectedValue = "Second";
constructor(private _el: ElementRef) {
}
ngAfterViewInit() {
jQuery(this._el.nativeElement)
.find("select")
.chosen()
.on("change", (e, args) => {
this.selectedValue = args.selected;
});
}
} <select>
<option *ngFor="let item of dropDownItems"
[value]="item"
[selected]="item == selectedValue">
{{item}} option
</option>
</select>
<h4> {{selectedValue}}</h4> 
npm install -g typings typings install jquery --save --ambient
/// <reference path="../typings/browser/ambient/jquery/index.d.ts" />
// declare var jQuery: any; // untyped declare var jQuery: JQueryStatic; // typed
interface JQuery {
//...
chosen(options?:any):JQuery;
}
declare module "jquery" {
export = $;
} npm ERR! Windows_NT 10.0.10586 npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install" "-g" "@angular/cli" npm ERR! node v7.10.0 npm ERR! npm v4.2.0 npm ERR! Cannot read property 'path' of null npm ERR! npm ERR! If you need help, you may report this error at: npm ERR! <https://github.com/npm/npm/issues> npm ERR! Please include the following file with any support request: npm ERR! C:\Users\payervand\AppData\Roaming\npm-cache\_logs\2017-05-13T05_43_04_935Z-debug.log
