我正在開發一個HTML5網絡應用程序,用於使用移動Safari和「添加到主屏幕」功能在iPad2上離線使用。我可以在桌面版Chrome中使用cache.manifest文件實現脫機緩存,但無法在iOS移動版Safari中使用它。HTML5網絡應用程序無法在iOS緩存Safari離線使用
該應用程序運行流暢在iPad上同時在線,但一旦我下線,我得到這些錯誤消息:「MyApp的不能打開,因爲它沒有連接到互聯網」(「添加到主屏幕」中在iPad上觀看)和「Safari無法打開該頁面,因爲它未連接到互聯網」(在同一iPad上的Safari瀏覽器中)。
我已經在網上閱讀了數百個疑難解答/問題頁面和清單教程,試圖解決這個問題,並沒有任何建議工作。在閱讀了這麼多關於這個功能之後,它應該很容易實現,但在這裏我是。
這裏是我已經完成/嘗試/使用到目前爲止沒有成功的總結。我已經嘗試了所有的下方同時使用cache.manifest和manifest.appcache變化沒有成功,但爲了簡單起見,我將只記錄了cache.manifest情況:
我開發和利用最新的XAMPP的Apache測試的Windows服務器上的Win10 x64的本地安裝
目標設備一個iPad2運行iOS 8.4版和移動版Safari版本8.我的完整用戶代理字符串是:
Mozilla/5.0 (iPad; CPU OS 8_4 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Version/8.0 Mobile/12H143 Safari/600.1.4
在XAMPP我已經更新httpd.conf文件,包括
AddType text/cache-manifest .manifest
在XAMPP我已經下XAMPP更新mime.types文件正確的MIME類型.manifest的
\ apache的\的conf \包括正確的MIME類型.manifest的text/cache-manifest manifest
在XAMPP,因爲我的web應用程序使用TTF,WOFF,ICO,PNG,JPG,JS,MP3和css文件,我已經在XAMPP驗證mime.types文件\ apache的\的conf \,以確保它包括MIME類型爲:
application/x-font-ttf ttf ttc application/x-font-woff woff image/x-icon ico image/png png image/jpeg jpeg jpg jpe application/javascript js audio/mpeg mpga mp2 mp2a mp3 m2a m3a
我已經把.htaccess文件中的網絡應用程序根公共HTML目錄正確的MIME類型.manifest的
AddType text/cache-manifest .manifest*
我已經包含在索引頁面的HTML元素的manifest屬性:
<!DOCTYPE html> <html lang="en" manifest="cache.manifest"> <head>
我試圖去除申報的index.html這一行,但它沒有工作:
<meta name="apple-mobile-web-app-capable" content="yes">
在切換到飛行模式和刷新之前,我已經有足夠的時間讓應用在Safari中緩存。我正在使用Windows機器,因此無法使用Web Inspector進行調試。我使用Jonathan Stark's Debugging Script和JSConsole來嘗試和調試,但它並沒有真正提供很多有用的信息,只是它沒有被緩存,我知道它是無效的。
我已經創建了一個cache.manifest文件,並將其放置在Web應用程序的根公共HTML目錄中。我已經包括其中許多來自其他計算器衍生的問題的其他解決方案,的建議,其中包括:
- 主要是我一直堅持的多個消息來源告知移動Safari瀏覽器將igrnore一切 的cache.manifest名
- 不包括它引用.manifest的
- 清單下的高速緩存部分
- 包括網絡後,*所有資源index.html文件:
- 包括所有章節標題,即使不使用
- 僅用於相對URI的
- 清單文件的內容是相對於清單文件(它是在網絡應用可以與index.html的根目錄)
- 清單文件正在從同一產地擔任主
- 確保所有文件都可用,以避免錯誤並丟棄.manifest。正如我提到的離線緩存,在桌面版Chrome工作這驗證清單的內容
- 清單文件沒有列出清單文件
清單的內容是:
CACHE MANIFEST
# ver 0.0.8
CACHE:
data/apple-touch-icon.png
data/favicon.ico
data/fnt0.ttf
data/fnt0.woff
data/fnt1.ttf
data/fnt1.woff
data/fnt2.ttf
data/fnt2.woff
data/fnt3.ttf
data/fnt3.woff
data/html5.png
data/html5-unsupported.html
data/img0.jpg
data/img1.png
data/img10.jpg
data/img11.jpg
data/img12.png
data/img13.png
data/img14.png
data/img15.png
data/img16.jpg
data/img17.png
data/img18.png
data/img19.png
data/img2.png
data/img20.png
data/img21.png
data/img22.png
data/img23.png
data/img24.png
data/img25.png
data/img26.png
data/img27.png
data/img28.png
data/img29.png
data/img3.png
data/img30.png
data/img31.png
data/img4.png
data/img5.png
data/img6.png
data/img7.png
data/img8.png
data/img9.png
data/player.js
data/slide1.css
data/slide1.js
data/slide10.css
data/slide10.js
data/slide11.css
data/slide11.js
data/slide12.css
data/slide12.js
data/slide13.css
data/slide13.js
data/slide14.css
data/slide14.js
data/slide15.css
data/slide15.js
data/slide16.css
data/slide16.js
data/slide17.css
data/slide17.js
data/slide18.css
data/slide18.js
data/slide2.css
data/slide2.js
data/slide3.css
data/slide3.js
data/slide4.css
data/slide4.js
data/slide5.css
data/slide5.js
data/slide6.css
data/slide6.js
data/slide7.css
data/slide7.js
data/slide8.css
data/slide8.js
data/slide9.css
data/slide9.js
data/sound1.mp3
NETWORK:
*
FALLBACK:
我真的很感謝在這個問題上有一些新的眼光,我只是看不出問題在哪裏。
有關此主題的任何新聞?我似乎有同樣的問題 - 除iPad Safari(iPad Chrome作品)外,其他地方都適用。 – fnagel
@fnagel在這個階段沒有消息,我走了另一條不太適合我需要的路,所以我打算很快再次選擇它。這一次,我打算從一個基本的應用程序開始,最小化到沒有任何資產,然後建立起來。這應該可以簡化問題 – DarkSpectrum