ความคิดเห็น: วันนี้เนื้อหาของเราเกี่ยวกับวิธีการสร้างเว็บแอปพลิเคชันออฟไลน์ ข้อได้เปรียบคืออนุญาตให้เบราว์เซอร์ดาวน์โหลดทรัพยากรเว็บที่เราระบุเพื่อให้ผู้ใช้สามารถใช้เว็บไซต์ของเราได้ตามปกติขณะออฟไลน์
วันนี้เนื้อหาของเราเกี่ยวกับวิธีการสร้างเว็บแอปพลิเคชันออฟไลน์ ข้อได้เปรียบคือเบราว์เซอร์สามารถดาวน์โหลดทรัพยากรเว็บที่เราระบุเพื่อให้ผู้ใช้สามารถใช้เว็บไซต์ของเราได้ตามปกติขณะออฟไลน์
1. กำหนดรายการ
เราใช้รายการเพื่อแสดงรายการทรัพยากรที่ต้องเข้าถึงเมื่อออฟไลน์ มันเป็นไฟล์ประเภทข้อความ บรรทัดแรกมักจะเป็นแคชอย่างชัดเจนจากนั้นแสดงรายการทรัพยากรที่เราต้องการหนึ่งต่อบรรทัด ไม่มีกฎการตั้งชื่อคงที่สำหรับไฟล์และไม่มีข้อกำหนดสำหรับชื่อต่อท้าย ข้อกำหนดเพียงอย่างเดียวคือการกำหนดชื่อคำต่อท้ายบนฝั่งเซิร์ฟเวอร์เป็นประเภท MIME ของข้อความ/แคช-manifest
หากเป็นเซิร์ฟเวอร์ IIS 7 ให้ทำตามขั้นตอนด้านล่าง:
1. ตัวอย่างเช่นหากคำต่อท้ายคือ. AppCache, เปิด IIS7 และเลือกโหนดรูท (จะสืบทอดมาจากเว็บไซต์ทั้งหมดและยังสามารถกำหนดค่าสำหรับไซต์เดียว);
2. ดับเบิลคลิกประเภท MIME ทางด้านขวา
3. คลิกขวาเพื่อเพิ่มประเภท MIME เพื่อให้การกำหนดค่าเสร็จสมบูรณ์
หลังจากการกำหนดค่าเซิร์ฟเวอร์เสร็จสมบูรณ์แล้วเพิ่มไฟล์รายการ
แคชที่ประจักษ์
manifestfile.html
img/1.jpg
img/2.jpg
img/3.jpg
จากนั้นมาดูตัวอย่างต่อไปนี้
<! doctype html>
<html manifest = "manifest.appcache">
<head>
<title> ตัวอย่าง </title>
<style>
IMG
-
เส้นขอบ: สีดำสองเท่าขนาดกลาง;
ช่องว่าง: 5px;
มาร์จิ้น: 5px;
-
</style>
</head>
<body>
<img src = "img /1.jpg" />
<div>
<button> car1 </utks>
<button> car2 </utks>
<button> car3 </kout>
</div>
<script>
ปุ่ม var = document.getElementsByTagname ('ปุ่ม');
สำหรับ (var i = 0; i <buttons.length; i ++) {
ปุ่ม [i] .onclick = handlebuttonpress;
-
ฟังก์ชั่น handlebuttonpress (e) {
document.getElementById ('imgtarget'). src = 'img/' + e.target.id + '.jpg';
-
</script>
</body>
</html>
เมื่อโปรแกรมทำงานขึ้นอยู่กับเบราว์เซอร์เบราว์เซอร์บางตัวจะถามคุณว่าคุณอนุญาตให้บันทึกข้อมูลออฟไลน์ในเครื่องหรือไม่ แอปพลิเคชั่นออฟไลน์แบบง่าย ๆ ดังกล่าวถูกสร้างขึ้น
2. คำตอบสำหรับข้อสงสัย
ฉันยังพบปัญหาและข้อสงสัยบางอย่างเมื่อเรียนรู้ส่วนนี้ของความรู้เช่น:
1. ทำไมฉันถึงใช้ VS2010 โดยตรง (สภาพแวดล้อมการพัฒนาของฉัน) และแอปพลิเคชันออฟไลน์ไม่ทำงานอย่างถูกต้อง?
2. ฉันจะรู้ได้อย่างไรว่าแอปพลิเคชันออฟไลน์ถูกสร้างขึ้นสำเร็จหรือไม่?
3. ฉันจะรู้ได้อย่างไรว่าแอปพลิเคชันปัจจุบันออฟไลน์?
4. หลังจากหยุดบริการ IIS มันควรจะออฟไลน์ ทำไมฉันถึงรายงานข้อผิดพลาด 404 เมื่อฉันรีเฟรชหน้า?
ตอนนี้ฉันจะตอบคำถามเหล่านี้ที่ฉันพบ
2.1. อธิบายคำถามแรกก่อน เกี่ยวกับปัญหานี้จุดสำคัญคือการกำหนดค่ารายการการกำหนดค่าเว็บแอปพลิเคชันของคุณ หากคุณใช้รูปแบบของเซิร์ฟเวอร์การพัฒนา VS เราไม่มีวิธีตั้งค่าประเภท MIME สำหรับมันดังนั้นในกรณีนี้แอปพลิเคชันออฟไลน์ของเราไม่สามารถใช้งานได้ สำหรับวิธีการกำหนดค่าเว็บที่เหลืออีกสองวิธีตราบใดที่คุณทำตามวิธีการประเภท MIME ที่ฉันแนะนำข้างต้นเพื่อกำหนดค่าเซิร์ฟเวอร์ IIS แอปพลิเคชันออฟไลน์ของคุณจะทำงานอย่างถูกต้อง
2.2. ปัญหาที่สองอธิบายไว้ด้านล่าง ที่นี่เราจำเป็นต้องใช้เครื่องมือการดีบักของเบราว์เซอร์ Chrome ใช้เบราว์เซอร์ Chrome เพื่อเปิดโปรแกรมเว็บของเรากด F12 และเปลี่ยนไปใช้แท็บทรัพยากร ตราบใดที่ข้อมูลการกำหนดค่าของเราพบได้ภายใต้แอปพลิเคชันแคชและไฟล์แคชสามารถพบได้ก็พิสูจน์ได้ว่าแอปพลิเคชันออฟไลน์ของเราถูกสร้างขึ้นเรียบร้อยแล้ว
2.3. หรือใช้เครื่องมือการดีบักของ Chrome หรือในแท็บทรัพยากรโปรดสังเกตว่าขดลวดสีแดงอาศัยอยู่ในสถานที่ออนไลน์หมายถึงออนไลน์
ถอดปลั๊กเคเบิลเครือข่ายและแสดงออฟไลน์ซึ่งหมายถึงออฟไลน์ ในเวลานี้สามารถแสดงผลของแอปพลิเคชันออฟไลน์ได้
2.4. เกี่ยวกับคำถามสุดท้ายเรายังต้องใช้เครื่องมือการดีบักของเบราว์เซอร์ Chrome เมื่อเราหยุดบริการ IIS ชั่วคราวเราจะดูการแสดงผลของแท็บทรัพยากร มันยังออนไลน์อยู่ แต่เปลี่ยนจากการไม่ได้ใช้งานไปจนถึงล้าสมัยในภายหลัง สิ่งนี้ยังอธิบายได้ว่าทำไมเอฟเฟกต์ออฟไลน์ของแอปพลิเคชันออฟไลน์จึงไม่สามารถแสดงได้เมื่อ IIS ท้องถิ่นหยุดชั่วคราว
นี่คือเนื้อหาของส่วนนี้