Slide 1

互動式多媒體網頁製作技術之
內涵現況與趨勢
戴建耘
www.ntnu.edu.tw/tvc/www/index.html
[email protected]


Slide 2

主要大綱
壹、Internet/Intranet/Extranet之標準協定與發展
貳、分散式軟體平台之概念與內涵
參、三層式主從架構

肆、 Internet/Intranet資料存取技術
伍、網頁製作工具與檔案
陸、結論與建議

柒、Q&A


Slide 3

壹、Internet/Intranet/Extranet
之協定與發展
• Internet/Intranet/Extranet之定義
項 目

特 性

對 象 與 結 果

Internet

開放式

全世界最大的電腦系統

Intranet

非開放式 企業內網路系統

Extranet 非開放式 企業間網路系統


Slide 4

Internet/Intranet/Extranet之關係
• Intranets/Extranets offer many of the
features, services and technologies that
are available on the Internet.

Internet

Open
Non-Open

Intranet
A

Firewall

Intranet
Intranet
B
C
Extranet


Slide 5

Internet/Intranet/Extranet
之標準協定
• TCP/IP
(Transmission Control Protocol / Internet
Protocol )

• HTTP-HTML
(HyperText Transfer Protocol - HyperText
Markup Language)

• SMTP
(Simple Mail Transmission Protocol )


Slide 6

PING www.epa.gov.tw

Route print


Slide 7

貳、分散式軟體平台之概念與內涵

ActiveX Platform


Slide 8

什麼是ActiveX技術?

物件1

COM
物
件
導
向
技
術

物件2

COM (Component Object Model)
物件與物件間溝通的機制


Slide 9

什麼是ActiveX技術?
ActiveX：提供豐富網頁內容
• 進階網站應用
•使用者互動性
OLE：桌上應用軟體整合軟體元件

COM
OLE：Object Linking & Embedding


Slide 10

ActiveX Platform架構

Active Server

Active Client
主從架構

標準協定 與

ActiveX


Slide 11

ActiveX Platform架構
Active Client
HTML
+
Scripting
+
Components

+
System Services

標準協定 與

Active Server
HTML
+
Scripting
+
Components
+
System Services

ActiveX

VBScript
JavaScript


Slide 12

ActiveX Platform特性
•Component-Base應用軟體架構
•提供網頁開發與多媒體特效與
良好的互動性
•可供使用者需求產生動態式網頁

•可引用現有控制項重新產生新控制項
•塑造軟體元件工業的好環境


Slide 13

ActiveX Client
-ActiveX Platform的Client端支援技術
軟體工程師
軟體元件1

整合

軟體元件2
軟體元件3

Web軟體開發者
傳統靜態資訊

Web使用者
快速

資訊傳遞
新一代軟體應用架構

互動


Slide 14

ActiveX Client的特性（一）
HTML

Scripting
整合與跨
Components

Network
Services

平台傳送


Slide 15

ActiveX Client的特性（二）
根據World Wide Web Consortium
最新HTML標準
發展

Ｄynamic HTML技術
（DHTML）


Slide 16

ActiveX Client的特性（三）
不受語言限制的Script環境
ActiveX Scripting
VB Script
Engine

Java Script
Engine


Slide 17

ActiveX Client的特性（四）
ＡctiveX
Controls控制項
ＡctiveX
Controls控制項
ＡctiveX
Controls控制項
ＡctiveX
Controls控制項
ＡctiveX
ＡctiveXControls控制項
Controls控制項
ＡctiveX
Controls控制項
ＡctiveX
Controls控制項
ＡctiveX
ＡctiveXControls控制項
Controls控制項


Slide 18

ActiveX Client的特性（五）

Java
applets

Microsoft
Java
Virtual
Machine

整合
應用


Slide 19

ActiveX Server應用軟體開發
ActiveX元件
ActiveX元件

ActiveX
開發
應用
程式

ActiveX元件

介面

撰寫低
階程式
（介面）

Server

Client

HTML
DCOM

Transaction
Server

（Distributive COM）

Message
Queue

Unix或
其它系統


Slide 20

ActiveX Platform
對等式發展架構
Client

Script

Server

Component

利用熟悉技術與工具專注解決問題


Slide 21

參、三層式主從架構
３－Tiers Client／Server Architecture


Slide 22

傳統應用軟體運作模式
Client

Server應用軟體

Data Source

RDBMS

ISAM

Browser


Slide 23

新運作模式：Apps+TP Monitor
Server應用軟體

Client

Data Source

DCOM
RDBMS

(VB,Office)

ISAM
HTTP

Browser

TP Monitor
(Transaction Process)


Slide 24

更新運作模式：
Apps+TP Monitor＋單一資料存取
Server應用軟體

Client

Data Source

DCOM

(VB,Office)

ADO/
OLE
DB

RDBMS

ISAM

HTTP

(Browser)

MTS
Microsoft (Transaction
Process)


Slide 25

ActiveX Platform與多層式架構
Ｂrowser/Client

Server應用軟體
(Internet Information Server)
HTTP

IIS

SNA
Server

Data Source

LUG2

RDBMS
OLETX

ISAM
DCOM

nt
ActiveX
Compone

XA


Slide 26

ActiveX Platform與多層式架構
-多層式應用軟體
-簡化應用軟體開發過程

•元件導向
•交易監控
•Internet整合
•延展性
•後端主機整合性


Slide 27

三層式主從架構實例
Static
HTML
Pages

Client
Browser

SQL Server

IIS

Active
Server
Pages

ActiveX Enables
Web Browser
ActiveX

ActiveX
ActiveX

ActiveX

ActiveX
ActiveX


Slide 28

三層式主從架構之特點
一．三層式系統架構
•應用軟體開發有彈性

（提高企業／校園競爭力）
•可適用於不同前端
（開放式結構）
•維護容易
(Reuse程式碼）


Slide 29

三層式主從架構之特點
二．運用Transaction Server
•資源有效運用
（大量用戶資源共用）
•資料一致完整
（分散式處理與運算）


Slide 30

三層式主從架構之特點
三．縮短開發時間
•元件共用規格 DCOM
•運用熟悉工具


Slide 31

肆、Internet/Intranet資料存取技術
一．DAO/Jet
(Data Access Object)

二．DAO ODBCDirect
(Open Database Connectivity Direct)
三．RDO/RDC

(Remote Data Object /Control )
四．VBSQL API
五．ODBC API

六．ADO/ADC (ActiveX Data Object
/Control)


Slide 32

資料存取技術與方式
DAO
DAO/Jet

ODBC
Direct

應用程式

應用程式

DAO 3.5

DAO 3.5

RDO

VBSQL

ODBC

ADO

RDC

API

API

ADC

應用程式

應用程式

應用程式

DB LIB

ODBC

Declares

Declares

應用程式

Jet
Database
Engine

RDO 2.0

RDO 2.0

ODBC
Driver
Manager

ODBC
Driver
Manager

ODBC
Driver
Manager

ODBC
Driver

ODBC
Driver

ODBC
Driver

LIB
Library

Network
Interface

ADO 1.5
OLE DB

ODBC
Driver
Manager

Kagera

ODBC
Driver

ODBC
Driver


Slide 33

資料存取技術與方式
• ODBC
• DAO-->RDO

• OLE DB
• ADO


Slide 34

伍、網頁製作工具與檔案
•工具演進實例
Office 97-IA

•主要相關檔案
•HTML
•GIF

FrontPage 98

•HTML

•GIF
•DHTML
Visual InterDev

Site Server

•VB Script
•Java Script
•ASP (ActiveX Server
Page)
•ASF ( ActiveX Server
File)


Slide 35

多媒體網頁製作工具與檔案
.WAV

.GIF

.AVI

.MID

.ASF

.RA
.IDC
.HTX

Active Server Page
DHTML
HTML

.Script


Slide 36

多媒體網頁製作工具剖析實例
•CRS

Visual FoxPro

•CA

Visual Basic

•PS

Visual C++

•ILS

Visual J++

•MSA
•MVA

Visual InterDev

Visual InterDev

•Web Page Creator
•Web Site Administrator
•Image Composer
•Music Producer
•Media Manager
•GIF Animator


Slide 37

陸、結論與建議
一．新軟體開發觀念與技術降臨
二．儘速推廣與落實Internet/Intranet基礎平台之建置技術
三．Internet/Intranet的網頁軟體開發重要工具
．Visual InterDev（含FrontPage）
．VB Script/Java Script
四，認識HTML是製作多媒體網頁的基礎
五．應開辦互動式多媒體網頁製作技術之研習會


Slide 38

主要參考文獻
１、Microsoft Press(1997中文版）,

VB與SQL,松崗圖書代理
２、台灣微軟(1997), Create Power Web Application,
研習會資料
３、 戴建耘(民86),我愛ActiveX與VB Script,松崗圖書
４、張炳雄等(民86),我愛HTML與多媒體網頁製作,
松崗圖書


Slide 39

柒、Ｑ ＆

Ａ