Webbased CS Model

Chia sẻ bởi Vũ Trung Kiên | Ngày 19/03/2024 | 3

Chia sẻ tài liệu: Webbased CS Model thuộc Công nghệ thông tin

Nội dung tài liệu:

Webbased CS Model
Webbased CS Model
XD ?ng d?ng trờn n?n WWW
D?t v?n d?
Về những khó khăn khi xây dựng và phát triển CSS
Phức tạp, đòi hỏi có kinh nghiệm khi
Phân tích thiết kế xây dựng và cài đặt hệ thống.
Bảo trì và phát triển mở rộng.
? Don gi?n hoỏ
Normalization
Mỏy Server
Cỏc mỏy Client
Giải pháp
3 tier C/S System
Normalization
Máy
Application
Server
(Terminal Server)
Cỏc mỏy Thin Client (Terminals)

C.trình ứng dụng
QLCB
C.trình ứng dụng
QLTV
C.trình ứng dụng
QLCV
Database Server
Data
Access
Data
Access
Data
Access
Máy
DataBase
Server
Gi?i phỏp
Ch? c?n m?t chuong trỡnh client cho m?i chuong trỡnh ?ng d?ng.
Khụng c?n thay d?i chuong trỡnh client khi phỏt tri?n m? r?ng.
Th?ng nh?t trờn ph?m vi r?ng.
M?c tiờu

Normalization
Chương trình phục vụ
Quản lý Cán bộ
Chương trình phục vụ
Quản lý Tài vụ
Chương trình phục vụ
Quản lý Công văn
Mỏy Server

Cỏc mỏy Client

Software Model?
Normalization CS Model
Normalization
World Wide Web
Dịch vụ cung cấp thông tin trên nền siêu văn bản

Xây dựng theo mô hình Client/ Server
Ph?n m?m ph?c v? phớa server
Web Server
(HTTP Server)
Web Browser
Web Browser
Ph?n m?m phớa mỏy khỏch
Cỏc t?p
siờu van b?n
T? ch?c giao ti?p & trỡnh di?n

Cung c?p siờu van b?n v?i HyperText Transport Protocol
WWW
How Web Server Work
WWW
WWW
Client requests a document
After retrieving the document, The Web Browser renders the
document & dipslays it
Query String & Response String
HyperText
HTTP Server
Web
Browser
Web
Browser
Web
Browser
SERVER
CLIENTS
HyperText
HyperText
Cõu h?i
Tr? l?i
Tr? l?i
trờn n?n HTLM

WWW
Number of Hits in a while
HyperText
HTTP Server
Web
Browser
Web
Browser
Web
Browser
SERVER
CLIENTS
HyperText
HyperText
WWW

millions hits in an hours!
WebBased CS Model
Mụ hỡnh xõy d?ng ?ng d?ng trờn n?n WWW
Mụ hỡnh Client Server chu?n hoỏ v?i Common Gateway l� WebServer

Chương trình phục vụ
Quản lý Cán bộ
Chương trình phục vụ
Quản lý Tài vụ
Chương trình phục vụ
Quản lý Công văn
Mỏy Server
Web Browser
Cỏc mỏy Client
Common Gateway
Web Browser
Web Browser
Web Server
WebBased CSS
CGI
HyperText
HTTP Server
HyperText
HyperText
CGI
Common Gateway Interface
Mỏy Server
DataBase Server
WebBased CSS
Chuong trỡnh ?ng d?ng
HyperText
HTTP Server
HyperText
HyperText
CGI
DataBase Server

DBAPI
Web
Browser
Web
Browser
Web
Browser
Mỏy SERVER
CLIENTS
Chuong trỡnh ?ng d?ng
DBAPI - DataBase Application Programming Interface
CGI
WebBased CSS
Chương trình ứng dụng dùng CGI
HyperText
HTTP Server
HyperText
HyperText
CGI
DataBase Server

DBAPI
Web
Browser
Web
Browser
Web
Browser
Máy SERVER
CLIENTS
Chương trình ứng dụng
DBAPI - DataBase Application Programming Interface
Siờu van b?n du?c sinh m?t cỏch "d?ng" theo yờu c?u c?a ngu?i dựng
CGI
WebBased CSS
Chuong trỡnh ?ng d?ng dựng CGI
HyperText
HTTP Server
HyperText
HyperText
CGI
DataBase Server
Web
Browser
Web
Browser
Web
Browser
Mỏy SERVER
CLIENTS
Chg trỡnh ?ng d?ng
ODBC
ODBC - Open DataBase Conectivity
CGI
WebBased CSS
Chương trình ứng dụng dùng CGI
HyperText
HTTP Server
HyperText
HyperText
CGI
DataBase Server
DBAPI
ODBC
Web
Browser
Web
Browser
Web
Browser
Mỏy SERVER
CLIENTS
Chương trình ứng dụng
Ngôn ngữ lập trình có thể sử dụng:
- Tất cả các ngôn ngữ lập trình hỗ trợ các hàm vào ra chuẩn và hàm lấy biến môi trường.
- Có thư viện DBAPI của DataBase Server hoặc hỗ trợ giao tiếp ODBC.

CGI
WebBased CSS
Web Server v?i CGI Applications
WWW
connection is closed
WebBased CSS
CGI
Sessions - cỏc phiờn giao ti?p
M?i ?ng d?ng s? lý d? li?u trờn n?n Web s? du?c ti?n h�nh qua nhi?u phiờn giao ti?p:
M?i phiờn b?t d?u b?ng m?t yờu c?u k?t n?i t? client,
Phiờn giao ti?p k?t thỳc ngay sau khi client nh?n du?c thụng tin h?i dỏp t? Web Server.

Server khụng luu tr? cỏc k?t qu? (d? li?u tớnh toỏn trung gian c?a ?ng d?ng) c?a phiờn giao ti?p. L?p trỡnh viờn ph?i ch? d?ng t? ch?c luu tr? cỏc k?t qu? n�y ho?c trờn server ho?c trờn form giao ti?p.

WebBased CSS
CGI
HyperText form với ứng dụng dùng CGI
HyperText form du?c dựng d? thi?t k? giao di?n v?i ngu?i dựng

WebBased CSS
CGI
HyperText form với ứng dụng dùng CGI
Cỏc th? t?o form

textbox
WebBased CSS
CGI
HyperText form với ứng dụng dùng CGI
Cỏc th? t?o form

default_text_value </textara><br>WebBased CSS<br>CGI<br>HyperText form với ứng dụng dùng CGI<br>Cỏc th? t?o form<br><input type="file" name="data_field_name" ...><br><input type="hidden" name="cmd_name" value="hidden_value" ...><br>WebBased CSS<br>CGI<br>HyperText form với ứng dụng dùng CGI<br>Web Server chuy?n d? li?u du?c di?n trong form cho ?ng d?ng CGI nh? ch? th? action trong th? khai bỏo form:<br><br><form name="form_name" method="post">	action="http://domain_name/CGI_App_name"><br>	<br>	...<br><br><br></form><br>Ch? th?: method="post" quy?t d?nh phuong th?c trao d?i thụng tin gi?a Web Browser v� Web Server l� "post"<br>WebBased CSS<br>CGI<br>Ba công việc của một ứng dụng CGI<br>Phõn tớch d? li?u nh?n du?c t? form	<br>X? lý d? li?u<br>Tr? l?i cho client<br>- 	Khi du?c g?i, ?ng d?ng CGI ph?i phõn tớch cỏc d? li?u nh?n du?c t? form, trong dú cú cỏc giỏ tr? c?a cỏc "command button" v� bi?t du?c Client yờu c?u di?u gỡ.<br>-	Sau khi bi?t du?c yờu c?u c?a Client, ?ng d?ng CGI ph?i th?c hi?n cỏc tớnh toỏn c?n thi?t, cú th? ph?i truy xu?t co s? d? li?u qua DBAPI hay ODBC d? cú du?c cỏc k?t qu? c?n thi?t theo yờu c?u c?a client<br>-	D? tr? l?i cho Client, ?ng d?ng CGI ph?i biờn t?p l?i k?t qu? d?t du?c du?i d?ng m?t siờu van b?n v� g?i ra Standard Output cho Web Server.<br><br>Khi form du?c submit v? Server, nh? ch? th? action trong khai bỏo form, Web Server bi?t s? ph?i g?i t?i ?ng d?ng CGI n�o.<br>WebBased CSS<br>CGI<br>Ví dụ<br>V?i form cú hai ch?c nang nh?p d? li?u v� xem d? li?u<br>WebBased CSS<br>CGI<br>Ví dụ<br>?ng d?ng CGI du?c g?i d?n s? ph?i th?c hi?n cỏc cụng vi?c:<br>-Xác định xem button “Nhập” hay button “Xem DS” đã được bấm,<br>Nếu “Nhập” được bấm thì phải lấy các dữ liệu từ các trường Họ và tên, Địa chỉ liên lạc, Điện thoại nhà riêng và Ghi chú.<br>-N?u "Nh?p" du?c b?m thỡ ph?i nh?p cỏc d? li?u t? cỏc tru?ng H? v� tờn, D?a ch? liờn l?c, Di?n tho?i nh� riờng v� Ghi chỳ v�o co s? d? li?u. <br>- N?u "Xem DS" du?c b?m thỡ d?c cỏc thụng tin t? co s? d? li?u.<br>- N?u "Nh?p" du?c b?m thỡ g?i cho client form siờu van b?n d? client nh?p d? li?u ti?p. <br>- N?u "Xem DS" du?c b?m thỡ biờn t?p cỏc thụng tin dó l?y t? co s? d? li?u th�nh m?t siờu van b?n v� g?i cho client.<br><br>Phân tích<br>Xử lý theo yêu cầu<br>Trả lời theo yêu cầu<br>WebBased CSS<br>CGI<br>Hai d?nh hu?ng phỏt tri?n<br>HyperText<br>HTTP Server<br>HyperText<br>HyperText<br>CGI<br>DataBase Server<br>API<br>ODBC<br>Web<br>Browser <br>Web<br>Browser <br>Web<br>Browser <br>Mỏy SERVER<br>CLIENTS<br>Chương trình ứng dụng<br>1. Bổ sung vào các ngôn ngữ lập trình các hàm hỗ trợ hypertext và giao tiếp trong suốt với CGI.<br>2. Bổ sung vào WEB Server các modules thông dịch các tài liệu mở rộng của siêu văn bản – Web Server Programming Interface (WSAPI).<br>WSAPI<br>CGI/ WSAPI<br>CGI<br>Cỏc gi?i phỏp phỏt tri?n <br>1. Theo hướng bổ sung các hàm hỗ trợ siêu văn bản và giao tiếp trong suốt với CGI:<br>	Java, Perl, C, Basic, FoxPro, NetData, PHP, JSP, ... trên các môi trường Unix, Windows NT, Novell, ... <br>2. Theo hướng bổ sung WSAPI:<br>	- Netscape API cho Netscape Server<br>	- ISAPI cho IIS trên Windows NT: ASP<br>	- Domino của IBM cho Lotus Note<br>	- PHP, JSP<br>	- ...<br><br>WSAPI<br>CGI<br>Các giải pháp phát triển <br>1a. Theo hu?ng b? sung cỏc h�m h? tr? siờu van b?n v� giao ti?p trong su?t v?i CGI:<br>	S? d?ng cỏc h�m hay cỏc bi?n b? sung d? l?y giỏ tr? d? li?u t? form nh?p, dựng cỏc h�m k?t xu?t ra standard output d? t?o th? siờu van b?n.	<br><br>2a. Theo hu?ng b? sung WSAPI:<br>	Nh? h? tr? c?a cỏc modules b? sung m� cú th? "nhỳng" cỏc do?n chuong trỡnh v�o siờu van b?n.<br><br>WSAPI<br>CGI<br>H? tr? siờu van b?n <br>1a. 	print htheader( "Example");<br>		/* $cmd= formfield( "cmd") */<br>		switch( $cmd) {<br>			case "Xem DS"<br>				print "<h2>Danh sách Cán bộ</h2><hr>";<br>				print TableContent();<br>				break;<br>			case "Nhập"<br>				dbupdate();<br>				print FormContent();<br>		}	<br>		print htclose();<br>WSAPI<br>CGI<br>H? tr? siờu van b?n<br>2a. 	<html><head><title>Example</title></head><br>		<body><br>			<%	$cmd= request.form( "cmd") <br>				select case( $cmd) <br>					case "Xem DS" <br>			%><br>						<h2>Danh sách Cán bộ</h2><hr><br>						<% =TableContent() %><br>			<%		case "Nhập"<br>						=FormContent()<br>				end select	<br>			%><br>		</body>	</html><br>WSAPI<br>CGI<br>Truy xu?t co s? d? li?u <br>1b. Theo hu?ng b? sung cỏc h�m h? tr? siờu van b?n v� giao ti?p trong su?t v?i CGI:<br> 	Truy xu?t co s? d? li?u th?c hi?n theo cỏc phuong th?c quy d?nh b?i DBAPI hay ODBC.<br><br>2b. Theo hu?ng b? sung WSAPI:<br>	Truy xu?t co s? d? li?u th?c hi?n theo phuong th?c m� cỏc modules b? sung cung c?p. <br>WSAPI<br>CGI<br>Truy xu?t co s? d? li?u<br>1b.<br>		function TableContent<br>		{<br>			$db= mysql_connect( "Phancipang", "root");<br>			mysql_select_db( "test", $db);<br>			$result= mysql_query( "select * from dscb");<br>	<br>			...<br>	<br>		}<br>WSAPI<br>CGI<br>Truy xu?t co s? d? li?u<br>2b.<br>		function TableContent<br>			set objDBConn= <br>				Server.CreatObject( "ADODB.connection")<br>			strConn= <br>				"driver={MyDBtype};;uid=sa;pwd=;database=test"<br>			objDB.Conn.Open strConn<br>			strCommandText=<br>				"Select * from dscb"<br>			set rsDscb= objDBConn.Execute strCommandText<br>		<br>			...<br>	<br>		end function<br>WSAPI<br>CGI<br></div>
						</div>
					</div>
					
										<div style="font-size:12px;">* Một số tài liệu cũ có thể bị lỗi font khi hiển thị do dùng bộ mã không phải Unikey ...</div>
					<hr>
					<div class="row">
						<div class="ad-container">
															
						</div>
					</div>
					<div class = 'clearfix'></div>
					<div class="row">
						<div class="col-md-6 col-xs-12">
							
							<div><b>Người chia sẻ</b>:  <a href="#">Vũ Trung Kiên </a></div>
							<div><b>Dung lượng</b>:  | 
								<b>Lượt tài</b>: 0 </div>
														<div><b>Loại file</b>:  </div>
								
							<div><b>Nguồn</b> : Chưa rõ </div>
							<div style="font-size:12px;">(Tài liệu chưa được thẩm định)</div>
							
						</div>
						<div class="col-md-6 col-xs-12">
							
							<div class="btn-preview download-file-btn" style="width:150px;background:#f26c4f;margin:3px;" data-lesson-id = "65f8b33c11f691ad6f8b533b">
								<a data-href="https://thuviengiaovien.com/lesson/download/id/65f8b33c11f691ad6f8b533b" href= "javascript:void(0)" style="color:#fff;" rel="nofollow">
									<i class="fa fa-download" aria-hidden="true" style="font-size:20px;"></i> Tải tài liệu
								</a>
							</div>
							<div><a href="#">Báo cáo sai sót </a></div>
							<div><a href="#">Đề suất chỉnh sửa , phân lại mục</a> </div>
						</div>
					</div>

</div>
			</div>
		</div>
		
		
		<div class="u-face-cm lazy">
				<div class="fb-like" data-href="https://thuviengiaovien.com/webbased-cs-model-1059163.html" data-layout="standard" data-action="like" data-show-faces="false" data-share="true" data-width="300">
				</div>
				<div class="fb-comments" data-href="https://thuviengiaovien.com/webbased-cs-model-1059163.html" data-width="100%" data-numposts="5" data-colorscheme="light">
				</div>
		</div>

</div>
	<div class="col-lg-4 col-md-4 col-sm-12 pdr-b hidden-xs">
		<div class="u-learn-what">
			
			<div class="alert alert-success" role="alert">
				<h3>Thư Viện Giáo viên có gì ?!</h3>
				<hr style="margin:3px 0px;">
				<div><i class="fa fa-check" aria-hidden="true"></i> Thư viện tài liệu giáo viên đủ các bậc học </div>
				<hr style="margin:3px 0px;">
				<div><i class="fa fa-check" aria-hidden="true"></i> Tải và chia sẻ tài liệu miễn phí , lưu trữ không giới hạn ...  </div>
				<hr style="margin:3px 0px;">
				<div><i class="fa fa-check" aria-hidden="true"></i> Cộng đồng chia sẻ kinh nghiệm dạy học ... </div>
				<hr style="margin:3px 0px;">
				<br />
				<center><a class="unica-log-acc" href="/register">Tham gia thư viện > </a></center>
			</div>

</div> 
		<div class="u-learn-what">
			<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4649191202673214" data-ad-slot="2171434249" data-ad-format="auto" data-full-width-responsive="true"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script>		</div>
	</div>
</div>

</div>
</div>
<br />

</main>
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">        
 <footer>
    <div id="footer2">
        <div class="container">
            <div class="row">
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr pdl" style="padding-top:20px;">
                    <span class="logo-footer">
                        <a class="navbar-brand" href="/"><img src="/images/logo/logo-tv-gv.png" width="100%"></a>
                    </span>
                    
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr pdm des-unica">
                    <h4>Về chúng tôi </h4>
                    <ul>
                        <li><a href="/gioi-thieu">Giới thiệu</a></li>
                        <li><a href="/faq">Câu hỏi thường gặp</a></li>
                        <li><a href="/dieu-khoan-dich-vu.html">Điều khoản dịch vụ</a></li>
                        <li><a href="/blog">Blog chia sẻ  </a></li>
                    </ul>
                </div>
				<div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr pdm des-unica">
                    <h4>Hoạt động</h4>
                    <ul>
                        <li><a href="/teacher">Đăng ký / Đăng nhập </a></li>
                        
                        <li><a href="#" target="_blank">Đăng ký hợp tác </a></li>
                        
						
                    </ul>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr des-unica">
                    <h4>Liên kết hữu ích </h4>
                    <ul>
                        
                        <li><a href="#">Dạy online </a></li>
                    </ul>
                    <span class="social-connect">
                        <p>Kết nối với </p>
                        <ul>
                            <li><a href="https://www.facebook.com/hoctaphay/" data-bg-color="#3B5998" style="background: rgb(59, 89, 152) !important;"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="# data-bg-color="#C22E2A" style="background: rgb(194, 46, 42) !important;"><i class="fa fa-youtube"></i></a></li>
                        </ul>
                    </span>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 pdr facebook-box">
                    <div class="fb-page fb_iframe_widget" data-href="https://www.facebook.com/hoctaphay/" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" fb-xfbml-state="rendered" fb-iframe-plugin-query="adapt_container_width=true&app_id=1639709859601244&container_width=137&hide_cover=false&href=https%3A%2F%2Fwww.facebook.com%2Funica.vn%2F&locale=vi_VN&sdk=joey&show_facepile=true&small_header=false"><span style="vertical-align: bottom; width: 180px; height: 230px;"></span></div>
                </div>
            </div>
        </div>
    </div>
    <div id="footer3">
        <div class="container">
            <div class="row">
                <div class="col-lg-10 col-md-10 col-sm-10 col-xs-12">
                    <p>© Thư viện giáo viên - Chia sẻ phướng pháp, tài liệu dạy học trực tuyến  </p>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
                   --
                </div>
            </div>
        </div>
    </div>
</footer>  
<script type="text/javascript" src="/templates/default/new/js/jquery-3.2.1.min.js?ver=201904261832"></script>
<script type="text/javascript" src="/templates/default/new/js/bootstrap.min.js?ver=201904261832"></script>
<script type="text/javascript" src="/templates/default/new/js/slick.js?ver=201904261832"></script>
<script type="text/javascript" src="/templates/default/new/js/bootstrap.offcanvas.js?ver=201904261832"></script>
<script type="text/javascript" src="/templates/default/new/js/sidenav.min.js?ver=201904261832"></script>
<script type="text/javascript" src="/templates/default/new/js/amazonmenu.js?ver=201904261832"></script>
<script type="text/javascript" src="/templates/default/new/js/sticky-sidebar.js?ver=201904261832"></script>
<script type="text/javascript" src="/js/ViewerJS/viewerjs.js?ver=201904261832"></script>	<script type="text/javascript">
		$.fn.isOverflowed = function(){
			var e = this[0];
			return e.scrollHeight > e.clientHeight || e.scrollWidth > e.clientWidth;
		};
	</script>
	
	<script type="text/javascript">
<!--
$(document).ready(function() {
	$('.download-file-btn').click(function(){
		var _this = $(this);
		if(_this.data('downloading') != true){
			_this.data('downloading',true);
			_this.data('downloading-error',0);
			$(this).find('i').addClass('fa-spinner');
			$(this).find('i').addClass('fa-spin');
			var callback = function(result){
				console.log(result);
				if(result.success == true){
					_this.data('downloading',false);
					// _this.find('i').removeClass('fa-spinner');
					// _this.find('i').removeClass('fa-spin');
					window.location.href = result.href;
				}else{
					var error = _this.data('downloading-error');
					if(error < 3){
						_this.data('downloading-error',error + 1);
						getDownloadUrl({
							id : _this.data('lesson-id'),
						},callback);
					}
				}
			};
			getDownloadUrl({
				id : _this.data('lesson-id'),
			},callback);
		}
	});
});
function getDownloadUrl(options,callback){
	$.ajax({
		url : '/lesson/get-download-info',
		type : 'POST',
		data : options,
		success : function(result){
			callback(result);
		},
		error : function(){
			callback({success : false});
		}
	});
}

//-->
</script>
        <script>
			$(document).ready(function () {
				$(".remove-navibar").click(function () {
					$("#js-bootstrap-offcanvas").trigger("offcanvas.toggle");
				});
			});
			jQuery(function () {
                amazonmenu.init({
                    menuid: 'mysidebarmenu'
                })
            })
			resizeWindow();
            window.addEventListener('resize', resizeWindow);

function resizeWindow() {
                $('.slider').slick({
                    responsive: [{
                            breakpoint: 2500,
                            settings: "unslick"
                        },
                        {
                            breakpoint: 640,
                            settings: {
                                dots: true,
                                infinite: true
                            }
                        }
                    ]
                });
            }
			
			$('.u-blog-slide').slick({
			infinite: true,
			slidesToShow: 1,
			slidesToScroll: 1,
			responsive: [{
					breakpoint: 1025,
					settings: {
						slidesToShow: 1,
						slidesToScroll: 1,
						infinite: true
					}
				},
				{
					breakpoint: 769,
					settings: {
						slidesToShow: 1,
						slidesToScroll: 1
					}
				},
				{
					breakpoint: 480,
					settings: {
						slidesToShow: 1,
						slidesToScroll: 1
					}
				}
			]
    });

</script>

ga('create', 'UA-114571019-15', 'auto');
  ga('send', 'pageview');

</script>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=292835638303077";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>    
</html>