การใช้ JavaScript ใน Internet Explorer ฝ่าย Client ในการเรียกและแสดงข้อมูลข่าวไทยสาร
ใช้ Technique คล้าย ASP Code ตัวอย่าง โดยมีการเรียก ActiveX Object MSXML ที่ฝั่ง Client เพื่อทำการการ Parse เอกสาร การเข้าถึงข้อมูลในเอกสาร และการแปลงเอกสารด้วย XSL Template
Browser ที่ฝั่ง client จะต้อง support - JavaScript, ActiveX Control และ MSXML Object Version 3.0 ขึ้นไป
เฉพาะ Internet Explorer version 6.0 ขึ้นไปเท่านั้นที่จะ support features เหล่านี้โดยไม่ต้องลง components เพิ่มเติม
แต่จากสถิติที่ผู้ใช้ Internet (โดย truehits.net) เราพบว่ามีผู้ใช้ IE version 6 ขึ้นไปเพียง 10% เท่านั้น
ดังนั้นถ้าท่านต้องการแน่ใจว่าข่าวบนเว็บไซต์สามารถแสดงได้ ก็ควรจะทำการแปลงรูปแบบข่าวที่ฝั่ง Server
ตัวอย่าง Code JavaScript ข้างล่างจึงเหมาะสำหรับผู้ที่ต้องการนำเสนอข่าวของไทยสาร แต่ไม่สามารถที่จะ run code บน server
ได้ (เช่นในกรณีที่ใช้ web hosting ที่มีการป้องกันการใช้ code php หรือ asp เอาไว้) หรือกรณีที่ท่านไม่สามารถใช้ feature บางอย่างได้
(เช่น php module บน webserver ไม่ support การใช้ XML Parser หรือไม่สามารถ Install MSXML หรือ URLFetch Object ลงบน IIS Server
ได้)
ข่าวที่แสดงอยู่ในหน้านี้ใช้ Code ที่ให้เป็นตัวอย่างในการเสนอ ท่านสามารถ click เพื่อ view source ของหน้านี้เพื่อดูตัวอย่างการวาง JavaScript
ถ้าในกรณีที่ไม่มีข่าวแสดงในหน้านี้ ก็จะมี Error พร้อมเหตุผลที่ไม่สามารถแสดงข่าวบน Browser นี้แทน
คำเตือน ผลการทดลองใช้ code ในหน้านี้กับหน้าเว็บบนโดเมนอื่นพบว่า code ดังกล่าวไม่สามารถทำงานได้ เนื่องจาก Default Setting ของ
Internet Explorer มีการป้องกันการดึงข้อมูลจากโดเมนอื่นอยู่ จำเป็นที่จะต้องมีการ set เป็น promt หรือ enable
(เข้าไปที่ Tools -> Internet Options -> Security -> Custom Level -> Miscellaneous -> Access data sources across domains)
ขณะนี้ทางผู้จัดทำยังไม่สามารถทำให้ Internet Explorer อนุญาติการดึงข้อมูลจากไทยสารโดยอัตโนมัติได้
Function ข้างล่างจะทำการเรียกข้อมูลข่าวจาก URL ที่กำหนดโดย newsLocation และทำการแปลงข่าวนั้นจาก XML ให้เป็น HTML เพื่อให้สามารถแสดงบน
web browser ได้ โดยการแปลงเอกสารดังกล่าวจะใช้ XSL Template ที่อยู่ที่ xslLocation (สามารถอยู่ใน local disk ของ server ได้) Code ของ Function นี้
ควรจะอยู่ระหว่าง <HEAD> และ </HEAD> ใน ASP Code ของหน้าที่จะแสดงข่าว
<script language="javascript">
function getMSXMLVersion() {
var xml = "<?xml version='1.0' encoding='UTF-16'?><cjb></cjb>";
var x = null;
var versions = new Array("Msxml2.DOMDocument.4.0", "Msxml2.DOMDocument.3.0",
"Msxml2.DOMDocument", "Msxml.DOMDocument");
for (i = 0; i < versions.length; i++) {
try {
objectName = versions[i];
x = new ActiveXObject(objectName);
x.loadXML(xml);
return objectName;
} catch(e) {
}
};
return "Not supported";
}
var MSXMLVersion = getMSXMLVersion();
function checkValidVersion() {
switch(MSXMLVersion) {
case "Not supported":
return false;
case "Msxml.DOMDocument":
return false;
default:
return true;
}
}
function showNews(newsLocation, xslLocation)
{
if (checkValidVersion())
{
var xmlNews = new ActiveXObject(MSXMLVersion);
var xslNews = new ActiveXObject(MSXMLVersion);
// Load news
xmlNews.async = false;
xmlNews.load(newsLocation);
// Load the XSL
xslNews.async = false;
xslNews.load(xslLocation);
// Transform
return xmlNews.transformNode(xslNews);
}
else
{
if (MSXMLVersion != "Not supported")
{
return "This browser does not support .";
}
else
{
return "This browser only support older version .";
}
}
}
</script>
|
เมื่อต้องการแสดงข่าวก็ทำการเรียก Function ดังกล่าว เช่น
<script language = "javascript">
document.write(showNews("http://thaisarn.com/services/distributor/xml_distributor.php?category=รัฐบาล&
nlatest=7","http://www.thaisarn.com/xsl/news.xsl"));
</script>
|
ผลจากการ execute code ขั้นต้นเป็นดังนี้
ในกรณีที่ Browser ท่านได้ disable JavaScript, ActiveX Control หรือไม่ได้ติดตั้ง MSXML เอาไว้ก็จะไม่สามารถดูข่าวได้ แต่จะแสดง error ขึ้นมาแทน)
โดย Error ที่ Code ขั้นต้นสามารถดักได้ ได้แก่
- Error ที่แสดงว่า client browser ไม่ support ActiveX Control หรือ MSXML Class; และ
- Error ที่แสดงว่า client browser ใช้ MSXML Class Version เก่ากว่า 3.0
ในกรณีที่ Client Browser (ซึ่งเป็น IE ที่ run บนระบบปฏิบัติการ windows) support ActiveX Control แต่ไม่มี MSXML Object ลงไว้
การแทรก code ข้างล่างนี้ไว้สามารถทำให้ browser ทำการ load MSXML (จาก thaisarn.com ในกรณีนี้) โดยอัตโนมัติ เพื่อให้ code JavaScript ขั้นต้นทำงานได้
<object id="MSXML3" classid="clsid:f5078f32-c551-11d3-89b9-0000f81fe221"
codebase="http://thaisarn.com/classes/msxml3.cab#version=8,00,7820,0"
type="application/x-oleobject"
STYLE="display: none">
</object>
|
Code ขั้นต้นสามารถทำงานได้กับ IE version ตั้งแต่ 4.0 ขึ้นไป โดยที่ file ที่ต้องทำการ download มา (msxml3.cab) มีขนาดประมาณ 500 KB
เช่นเดียวกับ ASP Code ตัวอย่าง
ท่านสามารถกำหนดการแปลงเอกสารด้วย XSL Template ได้โดยการเปลี่ยน parameter ตัวที่สองของ function showNews ให้เป็นตำแหน่งของ XSL Template ที่ต้องการดูลงของการใช้ XSL Template อื่นข้างล่าง
ใช้ XSL Template marquee.xsl ผลที่ได้เป็นดังนี้
ใช้ XSL Template selectbox.xsl ผลที่ได้เป็นดังนี้
ติดต่อได้ที่ E-Mail : ThaiSarn.com Web Master
|
หมวดข่าวหลัก
