@manhng

Welcome to my blog!

SqlDependency & SignalR in ASP.NET MVC

May 24, 2020 08:16

SqlDependency + SignalR in ASP.NET MVC 5 (edit)

Based on this articles:

https://www.codeproject.com/Tips/1075852/ASP-NET-MVC-SignalR-SqlDependency-and-EntityFramew

https://drive.google.com/file/d/115P2kaeFtScZP7Sn2gaQXTV2Tlj62hu7/ (v1)

https://drive.google.com/file/d/10jM9RVklYbAn_FRVT61y8cnuecnyl5Fj/ (v2)

https://github.com/mewanindula/SignalR-SQL_Dependency/

https://hendrikbulens.com/2015/05/26/developing-real-time-applications-with-signalr-and-sqldependency-in-asp-net-mvc-and-c/

https://docs.microsoft.com/en-us/previous-versions/sql/sql-server-2008-r2/ms181122(v=sql.105)?redirectedfrom=MSDN

ALTER DATABASE [SignalRDemo] SET ENABLE_BROKER;

Errors:

Error 1: The SQL Server Service Broker for the current database is not enabled, and as a result query notifications are not supported.  Please enable the Service Broker for this database if you wish to use notifications.

Error 2: The model backing the 'SignaRTestContext' context has changed since the database was created. Consider using Code First Migrations to update the database (http://go.microsoft.com/fwlink/?LinkId=238269).

How to enable, disable and check if Service Broker is enabled on a database?

To enable Service Broker run:
ALTER DATABASE [Database_name] SET ENABLE_BROKER;

alter database [<dbname>] set enable_broker with rollback immediate;

If the SET ENABLE_BROKER hangs and never completes read the previous article:
SET ENABLE_BROKER never completes in SQL Server

If you get an error when trying to enable Service Broker read the related blog post:
SQL Server Service Broker cannot be enabled – error

To disable Service Broker:
ALTER DATABASE [Database_name] SET DISABLE_BROKER;

To check if Service Broker is enabled on a SQL Server database:
SELECT is_broker_enabled FROM sys.databases WHERE name = 'Database_name';

How to Enable-Migrations

PM> Enable-Migrations
Checking if the context targets an existing database...
Detected database created with a database initializer. Scaffolded migration '202005240124271_InitialCreate' corresponding to existing database. To use an automatic migration instead, delete the Migrations folder and re-run Enable-Migrations specifying the -EnableAutomaticMigrations parameter.
Code First Migrations enabled for project SignalRWebApp.

PM> Update-Database -Verbose
Using StartUp project 'SignalRWebApp'.
Using NuGet project 'SignalRWebApp'.
Specify the '-Verbose' flag to view the SQL statements being applied to the target database.
Target database is: 'SignalRDemo' (DataSource: Localhost, Provider: System.Data.SqlClient, Origin: Configuration).
No pending explicit migrations.
Applying automatic migration: 202005240709176_AutomaticMigration.
ALTER TABLE [dbo].[Products] ADD [IsActive] [bit] NOT NULL DEFAULT 0
ALTER TABLE [dbo].[Products] ADD [IsDeleted] [bit] NOT NULL DEFAULT 0
ALTER TABLE [dbo].[Products] ADD [Created] [int] NOT NULL DEFAULT 0
ALTER TABLE [dbo].[Products] ADD [CreatedBy] [datetime] NOT NULL DEFAULT '1900-01-01T00:00:00.000'
ALTER TABLE [dbo].[Products] ADD [Modified] [int] NOT NULL DEFAULT 0
ALTER TABLE [dbo].[Products] ADD [ModifiedBy] [datetime] NOT NULL DEFAULT '1900-01-01T00:00:00.000'
INSERT [dbo].[__MigrationHistory]([MigrationId], [ContextKey], [Model], [ProductVersion])
VALUES (N'202005240709176_AutomaticMigration', N'SignalRWebApp.Models.SignaRTestContext', 0x1F8B0800000000000400CD58DB6EE336107D2FD07F10F4D402593397976D20EFC2B193C2E826F146DEDD675A1A3B44295225A9C0FEB67DE827F5173AD4FDE29B9C2C5A0408ACD1F0CCE1903C3CF63FDFFFF63EAE23EEBC80D24C8AA17B3138771D10810C99580DDDC42CDFBD773F7EF8F927EF368CD6CED722EFCAE6E148A187EEB331F135213A788688EA41C40225B55C9A4120234243492ECFCF7F2317170410C2452CC7F19E12615804E9033E8EA508203609E5F73204AEF338BEF15354E78146A0631AC0D0F5D94A50FEF40D16A3381E64F9AE33E28C22171FF8D275A810D250834CAFBF68F08D9262E5C718A07CBE8901F396946BC867705DA51F3B99F34B3B19520D2CA082441B19F504BCB8CABB43DAC34FEAB15B760FFB778B7D361B3BEBB4874377A6649804C675DAB5AEC75CD9BCED1D1EE4E3CE9CC6DBB3724BE0CEB17F67CE38E126513014901845F999334B169C057FC0662EFF04311409E7758A4812DF350218C2723128B379826593F874E23AA4399CB4C797A3BB43B3194E85B9BA749D07A442171CCAFD50EB866FA482DF4180A206C2193506142EE73484B4A31D12AD92F67F510D37209E26D7B9A7EB4F2056E679E8E247D7B9636B088B48CEE08B6078F8709051091C2A82C966A65850569A40C022CA5D67A6F0537EA4DFBB8E1F503BCB6D53DE5FE17342F3E9FEA002533D0A0C7B2967702325072A4EC09900075CA9D7028D15D01ACCAE9D7214C84DD5377C9C33BB257A22E1E9634BF65A3E054A6F421EA904A42B2B28DB86323C227999541A9EE6A08D7D03EB6D2A83829C0B8DCE3779937986EC83699E5D94F88A49A6F38352CAB6312EB9557709C92E93E2D2213B6E1DEF9EC6311ED8DA2D94471C3FBB82C6EFFCFECA1C651824D05B04BA645B5642F9A12B68BDC5D2C8F48E296D7001E982DAF51A875127ADBB123BBA5CD46B35BB2DC755EF8B01F6736DD5775C176DA0AA977738BD08B5349D29947CAA0BAA333275039453B55BDDC792279138705FECC3CA64BB0E93458E47A869721DA6163E1EAB52DF3A54153D1EA992D93A5215ED83540A6D13AA0C1F8F556A6D1DA90CF6C6B9D96C45BAE9D5A94A70EB5055B43F529B563DDE45F348EB80B48F22E99CC5961B6A9FED7DE2D84E29AB9722D912432F17A6C33EBDA354598AB50EF28585A94A6DB48168601306FE5F7CCC19CEB74AB8A7822D51C232DFE8A251BE6C19FDFF8FE9265A87FC38E7FD1F7B5F665B7CD0DDF6341875BB2B5EA80A9EA9FA25A2EB5FEB482759DAF0475BDA372FD0B6B40B665E6F674F016959D974E15F6B64437C346F61644F61D3B5B147D2E96763BB1EEB288BBACFA166DA877C1712A9673C2B677BA27FED4AB147EA3FAC7813D0E8CD4A08FB338B80C06A5C055AE44CC55216EDC6A9D5191529EDD50043B1FF74A40C5BD2008FAD0C40EBF4ABEE57CA134CB98D16104EC56362E2C48CB48668C11BB79E47F6D74F4D7A93B3F718DB27FD1653409ACC6EA1477193301E96BCEFB66CA11D1076B3E4428AACF0AB3EC2AD3625D283144702E5ED9B400CC2CAF01CA29823987E143EB56AD29F1B7ED7FA042B1A6C8A1B7537C8E18568B6DD9B30BA5234D2394635DEFE5848ECAF851FFE0559DE863A5F140000 , N'6.1.3-40302')

Running Seed method.

PM> Add-Migration Change_CRUD_Fields
Scaffolding migration 'Change_CRUD_Fields'.
The Designer Code for this migration file includes a snapshot of your current Code First model. This snapshot is used to calculate the changes to your model when you scaffold the next migration. If you make additional changes to your model that you want to include in this migration, then you can re-scaffold it by running 'Add-Migration Change_CRUD_Fields' again.
PM> Error

Solution Explorer > Delete code in Migrations folder

PM> Enable-Migrations -Force
Checking if the context targets an existing database...
Code First Migrations enabled for project SignalRWebApp.

PM> Update-Database –Verbose
Using StartUp project 'SignalRWebApp'.
Using NuGet project 'SignalRWebApp'.
Specify the '-Verbose' flag to view the SQL statements being applied to the target database.
Target database is: 'SignalRDemo' (DataSource: MANHNV83\MSSQL14, Provider: System.Data.SqlClient, Origin: Configuration).
No pending explicit migrations.
Unable to update database to match the current model because there are pending changes and automatic migration is disabled. Either write the pending model changes to a code-based migration or enable automatic migration. Set DbMigrationsConfiguration.AutomaticMigrationsEnabled to true to enable automatic migration.
You can use the Add-Migration command to write the pending model changes to a code-based migration.
PM> 

Code First Approach

https://dzone.com/articles/steps-to-add-new-field-with-code-first-approach-in

Sql column default value

https://stackoverflow.com/questions/27038524/sql-column-default-value-with-entity-framework

Knowledge Base: Limitations of SQL Dependency

https://techbrij.com/database-change-notifications-asp-net-signalr-sqldependency

https://stackoverflow.com/questions/7588572/what-are-the-limitations-of-sqldependency

The most complete list I can find (from here) is as follows:

  • The projected columns in the SELECT statement must be explicitly stated, and table names must be qualified with two-part names. Notice that this means that all tables referenced in the statement must be in the same database.
  • The statement may not use the asterisk (*) or table_name.* syntax to specify columns.
  • The statement may not use unnamed columns or duplicate column names.
  • The statement must reference a base table.
  • The statement must not reference tables with computed columns.
  • The projected columns in the SELECT statement may not contain aggregate expressions unless the statement uses a GROUP BY expression. When a GROUP BY expression is provided, the select list may contain the aggregate functions COUNT_BIG() or SUM(). However, SUM() may not be specified for a nullable column. The statement may not specify HAVING, CUBE, or ROLLUP.
  • A projected column in the SELECT statement that is used as a simple expression must not appear more than once.
  • The statement must not include PIVOT or UNPIVOT operators.
  • The statement must not include the UNION, INTERSECT, or EXCEPT operators.
  • The statement must not reference a view.
  • The statement must not contain any of the following: DISTINCT, COMPUTE or COMPUTE BY, or INTO.
  • The statement must not reference server global variables (@@variable_name).
  • The statement must not reference derived tables, temporary tables, or table variables.
  • The statement must not reference tables or views from other databases or servers.
  • The statement must not contain subqueries, outer joins, or self-joins.
  • The statement must not reference the large object types: text, ntext, and image.
  • The statement must not use the CONTAINS or FREETEXT full-text predicates.
  • The statement must not use rowset functions, including OPENROWSET and OPENQUERY.
  • The statement must not use any of the following aggregate functions: AVG, COUNT(*), MAX, MIN, STDEV, STDEVP, VAR, or VARP.
  • The statement must not use any nondeterministic functions, including ranking and windowing functions.
  • The statement must not contain user-defined aggregates.
  • The statement must not reference system tables or views, including catalog views and dynamic management views.
  • The statement must not include FOR BROWSE information.
  • The statement must not reference a queue.
  • The statement must not contain conditional statements that cannot change and cannot return results (for example, WHERE 1=0).
  • The statement can not specify READPAST locking hint.
  • The statement must not reference any Service Broker QUEUE.
  • The statement must not reference synonyms.
  • The statement must not have comparison or expression based on double/real data types.
  • The statement must not use the TOP expression.

Additional reference:

SignalR Database Update Notifications in ASP.NET MVC using SQL Dependency

https://www.codeproject.com/articles/874240/signalr-database-update-notifications-in-asp-net-m

https://github.com/venkatbaggu/signalrdatabasenotifications (HAY HAY HAY)

https://stackoverflow.com/questions/25845380/real-time-update-with-sqldependency-and-signalr-in-mvc-with-foreign-key/

https://forums.asp.net/t/2013051.aspx?Real+time+update+with+SqlDependency+and+SignalR+in+MVC+with+foreign+key

Showing Data Changes Using SQLDependency With SignalR In ASP.NET MVC

https://www.c-sharpcorner.com/blogs/showing-data-changes-using-sqldependency-with-signal-r

Database Change Notifications In ASP.NET (MVC) Using SignalR & SQL Dependency

https://github.com/mewanindula/SignalR-SQL_Dependency (HAY HAY HAY)

Real-time applications with SignalR and SQLDependency in ASP.NET MVC

https://hendrikbulens.com/2015/05/26/developing-real-time-applications-with-signalr-and-sqldependency-in-asp-net-mvc-and-c/

Track changes in records in the database using SignalR and SQLTableDependency

http://programmersought.com/article/78561358427/

Hangfire

https://www.hangfire.io/

Hangfire một trong những cách dễ nhất để thực hiện xử lý nền trong ứng dụng .NET và .NET Core.

https://helpex.vn/article/cach-tich-hop-hangfire-voi-asp-net-core-1-1-5c54c69d507419248c9af1c3

https://www.dotnetcoban.com/2019/08/introduction-to-hangfire.html

https://nhatkyhoctap.blogspot.com/2017/10/hangfire-thuc-thi-background-task-voi.html

https://www.hocviendaotao.com/2015/11/hangfire-cong-cu-tao-tien-trinh-ngam.html

Quartz.net

https://www.quartz-scheduler.net/documentation/quartz-2.x/tutorial/using-quartz.html

https://www.codeproject.com/Articles/860893/Scheduling-With-Quartz-Net

https://bytefish.de/blog/scheduling_with_quartz_net/

https://stackoverflow.com/questions/29343587/automatically-handling-job-and-trigger-changes-in-quartz-net-using-adojobstore

Quartz 2.4.1

Làm sao để tạo một task chạy theo lịch trong ứng dụng web?

https://tedu.com.vn/lap-trinh-aspnet/tu-dong-thuc-thi-tac-vu-theo-lich-trong-aspnet-voi-quartznet-87.html

https://tech.ebayinc.com/engineering/performance-tuning-on-quartz-scheduler/

https://medium.com/better-programming/asp-net-core-windows-service-task-quartz-net-with-database-5972722ab044

Tôi đã cài đặt gói Quartz 2.4.1 vì tôi muốn một trình lập lịch nhẹ trong ứng dụng web của mình mà không cần cơ sở dữ liệu SQL Server riêng.

Tôi cần lên lịch cho các phương pháp 

  • SendUserEmails để chạy mỗi tuần vào Thứ Hai 17: 00, Thứ Ba 17:00 và Thứ Tư 17:00
  • SendAdminEmails để chạy mỗi tuần vào Thứ Năm 09:00, Thứ Sáu 9:00

Tôi cần mã nào để lên lịch cho các phương thức này bằng Quartz trong ASP.NET Core? Tôi cũng cần biết cách khởi động Quartz trong ASP.NET Core vì tất cả các mẫu mã trên internet vẫn đề cập đến các phiên bản trước của ASP.NET.

https://laptrinhvb.net/bai-viet/chuyen-de-csharp/---Csharp----Huong-dan-su-dung-thu-vien-Quartz-lap-lich-cong-viec-hang-ngay/2a2c3a0217802c78.html

Chart + SignalR + Real-time

July 31, 2018 10:01

Chart + SignalR + Real-time (edit)

16 JavaScript Libraries for Creating Beautiful Charts
https://www.sitepoint.com/15-best-javascript-charting-libraries/

https://viblo.asia/p/chia-se-ve-su-dung-thu-vien-highcharts-MgNeWoqyeYx
Các loại biểu đồ: line, spline, area, areaspline, column, bar, pie & scatter

Data Visualization: Hình ảnh hóa dữ liệu
https://google-developers.appspot.com/chart/interactive/docs/gallery
https://developers.google.com/chart/interactive/docs/gallery

Combo Chart
https://google-developers.appspot.com/chart/interactive/docs/gallery/combochart

Material Column Charts
https://google-developers.appspot.com/chart/interactive/docs/gallery/columnchart

Material Bar Charts
https://google-developers.appspot.com/chart/interactive/docs/gallery/barchart

Google Chart
https://techbrij.com/google-chart-dynamic-series-column-javascript-array

Creating a chart to display real-time/live data using SignalR, jQuery Flot and ASP.NET MVC
https://github.com/techbrij/Flot-SignalR-ASPNET-MVC

Thay đổi tệp XML, Maps thay đổi theo
https://techbrij.com/realtime-google-maps-bing-xml-signalr-file-changes

Thay đổi DB sẽ báo ngay
https://techbrij.com/database-change-notifications-asp-net-signalr-sqldependency

Tutorial: Getting Started with SignalR 2
+ Visual Studio 2013
+ .NET 4.5
+ SignalR version 2
https://docs.microsoft.com/en-us/aspnet/signalr/overview/getting-started/tutorial-getting-started-with-signalr

Learn How to implement Real-Time Chart using HTML5 Push Notification (SSE) and ASP.NET Web API. For more information, visit our website
https://github.com/techbrij/HTML5-Push-Flot-Chart-ASPNET-WEBAPI


https://www.strathweb.com/2012/05/native-html5-push-notifications-with-asp-net-web-api-and-knockout-js/
https://github.com/filipw/html5-push-asp.net-web-api/

https://techbrij.com/database-change-notifications-asp-net-signalr-sqldependency

SignalR MVC 4
https://code.msdn.microsoft.com/SignalR-Getting-Started-b9d18aa9

SignalR MVC 5
https://code.msdn.microsoft.com/Getting-Started-with-c366b2f3

ChartJS
http://www.chartjs.org/

MULTI-LINE LABELS
http://gionkunz.github.io/chartist-js/examples.html

EXTREME RESPONSIVE CONFIGURATION
http://gionkunz.github.io/chartist-js/examples.html

highcharts: Interactive JavaScript charts for your webpage (https://www.highcharts.com/)
chartjs: Open source HTML5 Charts for your website (https://www.chartjs.org)


Chartist.js
D3.js
Google Charts
Peity: Mã nguồn mở theo MIT License.
Easy Pie Chart: Mã nguồn mở theo MIT License.
FusionCharts
jqPlot
jQuery Sparklines: Mã nguồn mở. Free cho mọi mục đích sử dụng.
jQuery.Gantt
Flot
Morris.js
CanvasJS jQuery
Cytoscape.js

C3.js is a great way to graph realtime data
https://c3js.org/examples.html

Combination Chart (Bar Chart + Line Chart)
https://c3js.org/samples/chart_combination.html

Chart Size
https://c3js.org/samples/options_size.html

C3.js: D3-based reusable chart library
https://c3js.org/

D3.js: Data-Driven Documents
https://d3js.org

Data Color
https://c3js.org/samples/data_color.html

AdminLTE: AdminLTE - Free Premium Admin control Panel Theme Based On Bootstrap 3.x
+ https://adminlte.io/themes/AdminLTE/index.html
+ https://adminlte.io/themes/AdminLTE/index2.html
+ https://adminlte.io/themes/dev/AdminLTE/index3.html
+ https://github.com/almasaeed2010/AdminLTE/releases
+ https://github.com/almasaeed2010/AdminLTE/
+ Combination Chart (Bar Chart + Line Chart): tạo biểu đồ kết hợp 2 loại chart
Gentelella Alela: https://colorlib.com/polygon/gentelella/index.html


Hầu như các lập trình viên đều biết đến 4 tính chất cơ bản trong OOP:
Tính trừu tượng
Tính bao đóng
Tính kế thừa
Tính đa hình

SOLID bao gồm 5 nguyên tắc chính sau đây:
1/ Single responsibility principle: Một class chỉ nên có một lý do duy nhất để thay đổi, có nghĩa là class đó chỉ chịu một trách nhiệm duy nhất
2/ Open/closed principle: nên viết class mở rộng class cũ (bằng cách kế thừa) chứ không nên sửa đổi class đó
+ Open cho việc mở rộng có nghĩa là chúng ta có thể thêm các tính năng hoặc thành phần mới vào mà không vi phạm code hiện tại
+ Closed cho việc sửa đổi có nghĩa là chúng ta không nên thay đổi quá nhiều chức năng hiện có, bởi vì nó sẽ bắt buộc ta phải tái cấu trúc rất nhiều đoạn code
3/ Liskov substitution principle: Trong một chương trình, các object của class con có thể thay thế class cha mà không làm thay đổi tính đúng đắn của chương trình
4/ Interface segregation principle: Thay vì dùng 1 interface lớn, ta nên tách thành nhiều interface nhỏ, với nhiều mục đích cụ thể
5/ Dependency inversion principle
+ Các module cấp cao không nên phụ thuộc vào các modules cấp thấp. Cả 2 nên phụ thuộc vào abstraction.
+ Interface (abstraction) không nên phụ thuộc vào chi tiết, mà ngược lại. ( Các class giao tiếp với nhau thông qua interface, không phải thông qua implementation.)

Load Balancer
Load Balancing with HAProxy
HAProxy is free, open source software that provides a high availability load balancer and proxy server for TCP and HTTP-based applications that spreads requests across multiple servers.

HAProxy (High Availability Proxy) is able to handle a lot of traffic.
HAProxy can handle a large number of concurrent requests.


https://serversforhackers.com/c/load-balancing-with-haproxy

Vì sao Load Balancer lại quan trọng với doanh nghiệp?
https://tech.vccloud.vn/vi-sao-load-balancer-lai-quan-trong-voi-doanh-nghiep-20180727112222729.htm

DisplayJS
Framework nhỏ này giúp việc đồng bộ dữ liệu với DOM dễ dàng hơn. Thay vì phải tự thiết lập và cập nhật nội dung của trang, với DisplayJS, bạn có thể ánh xạ các biến JavaScript với các phần tử HTML cụ thể, tương tự như cách React hoặc Vue.js xử lý template.

Front end Optimization – 9 tips để cải thiện Web Performance
https://techtalk.vn/front-end-optimization-9-tips-de-cai-thien-web-performance.html
-----------------------------------------------------------------------------------

30 Trang web nên theo dõi nếu bạn là một lập trình viên web
https://techtalk.vn/30-trang-web-nen-theo-doi-neu-ban-la-mot-lap-trinh-vien-web.html
-----------------------------------------------------------------------------------

15 thư viện JavaScript và CSS hấp dẫn trong tháng 9 năm 2017
https://techtalk.vn/15-thu-vien-javascript-va-css-hap-dan-trong-thang-9-nam-2017.html
-----------------------------------------------------------------------------------
Trowel
Một bản SASS mở rộng cung cấp một cách mới để viết các biến scss. Nó cho phép bạn nhóm nhiều biến thành một đối tượng, làm cho scss của bạn dễ đọc và viết hơn.

Vivify
Vivify là thư viện animation dành riêng cho CSS. Bạn chỉ cần thêm lớp vivify vào phần tử bạn muốn sinh động. Bạn cũng có thể thêm các lớp infinite để làm cho các hình động lặp lại theo vòng lặp. Thư viện cung cấp cho bạn hơn 50 animation với các hiệu ứng cc và di chuyển.

Push
Push là thư viện tốt nhất để quản lý thông báo trên màn hình JavaScript. Nó dựa trên Notification API mạnh mẽ nhưng cũng hoạt động như một giải pháp kiểm tra chéo trình duyệt (Cross Browser) đáng tin cậy và sẽ trở lại các triển khai cũ hơn nếu trình duyệt của người dùng không hỗ trợ cho API mới.
Source tại đây: https://github.com/Nickersoft/push.js
Demo tại đây: https://pushjs.org

Tons of Checkboxes
Một bộ sưu tập các checkbox component chỉ dành cho CSS. Có nhiều kiểu khác nhau bao gồm Toggles, Switches, Circles và Squares. Tất cả các checkbox có bốn kích cỡ từ nhỏ đến rất lớn. Tương thích với tất cả các trình duyệt hiện đại bao gồm IE9 +.
Source tại đây: https://github.com/hunzaboy/CSS-Checkbox-Library
Demo tại đây: https://hunzaboy.github.io/CSS-Checkbox-Library/

Syncing IndexedDB Database with Online Database using ASP.NET Web API
https://techbrij.com/
https://github.com/techbrij/SyncIndexedDB

Tăng sức mạnh JavaScript với lodash
https://toidicodedao.com/2015/04/16/tang-suc-manh-cho-javascript-voi-lodash/

Làm nổi bật code với thư viện sau
https://o7planning.org/vi/10375/lam-noi-bat-code-voi-thu-vien-javascript-syntaxhighlighter

SqlDependency + SqlCacheDependency
https://dielel.wordpress.com/2017/02/05/sqldependency-theo-doi-thay-doi-tren-database/
https://stackoverflow.com/questions/7588572/what-are-the-limitations-of-sqldependency


JavaScript cơ bản
https://ngocminhtran.com/javascript-co-ban/
-----------------------------------------------------

Thực hành tạo thư viện trong JavaScript
-----------------------------------------------------
Mở trình soạn thảo (Visual Studio, Eclipse, Notepad, v.v.) và nhập đoạn mã sau:

var MyLibrary = {};
MyLibrary.sendAlert = function(mesg) {
alert(mesg);
};

Lưu thành tập tin library.js và đóng.

Mở tập tin HTML (ví dụ librarypage.html) liên kết và sử dụng thư viện library.js như sau:

<!doctype html>
<html>
<head>
<title>A Basic Example</title>
<script type="text/javascript" src="library.js"></script>
</head>
<body>
<script type="text/javascript">
MyLibrary.sendAlert("hello, this is the message");
</script>
</body>
</html>

Chú ý khi tạo thư viện không sử dụng trùng tên hàm hay từ khoá được cung cấp bởi JavaScript (trong đặc tả ECMA).

Categories