HTML5 в автономном режиме "Ошибка кэширования приложения: Ошибка манифеста (-1)"

Я пытаюсь написать автономное приложение HTML5, но не могу заставить Chrome принять файл манифеста кэша.

Chrome записывает следующий вывод на консоль при загрузке приложения:

Creating Application Cache with manifest http://localhost/cache.manifest
Application Cache Checking event
Application Cache Error event: Manifest fetch failed (-1) http://localhost/cache.manifest

Однако, если я удалю все строки из файла манифеста, кроме первой строки (т.е. "CACHE MANIFEST" ), Chrome принимает манифест:

Creating Application Cache with manifest http://localhost/cache.manifest
Application Cache Checking event
Application Cache Downloading event
Application Cache Progress event (0 of 0)
Application Cache Cached event

Но, как только я добавлю новую строку в манифест (даже если следующая строка пуста), Chrome возвращается к жалобе на неудачу выборки.

Все файлы обслуживаются локально с ПК с Windows 7 через Python с помощью SimpleHTTPServer на порту 80. Я обновил типы_массы в% PYTHON%/Lib/mimetypes.py со следующей строкой:

    '.manifest': 'text/cache-manifest',

манифест должен содержать следующее:

CACHE MANIFEST 
scripts/africa.js
scripts/main.js
scripts/offline.js
scripts/libs/raphael-min.js
favicon.ico
apple-touch-icon.png

Ответы

Ответ 1

Теперь я решил эту проблему, переключившись на CherryPy для обслуживания этих файлов:)

Если кто-то еще так же застрял, но хочет, чтобы часть сервера была простой, для начала работы может быть достаточно следующего Python:

import cherrypy


class SimpleStaticServer:

    @cherrypy.expose
    def index(self):
        return '<html><body><a href="index.html">Go to the static index page</a></body></html>'


cherrypy.config.update({
        # global
        'server.socket_host': '192.168.0.3',
        'server.socket_port': 80,

        # /static
        'tools.staticdir.on': True,
        'tools.staticdir.dir': "(directory where static files are stored)",
    })
cherrypy.quickstart(SimpleStaticServer())

Если вы хотите посетить "сайт" с другого устройства, вам нужно будет использовать внешний IP-адрес (для меня это было 192.168.0.3). В противном случае вы можете просто использовать "127.0.0.1" для значения "server.socket_host". Затем я указываю браузеру http://192.168.0.3/index.html, чтобы получить статическую страницу индекса.

Ответ 2

Чтобы кэшировать сайт в автономном режиме (HTML5), вам необходимо указать все файлы, необходимые для его запуска. Вкратце укажите основные компоненты сайта.

Легкий способ создания манифеста находится в Note Pad.

Примечание. CACHE MANIFEST должен быть первой строкой, и ваши файлы будут следовать за строковым пространством следующим образом:

CACHE MANIFEST

Scripts/script.js
Content/Site.css
Scripts/jquery-ui-1.8.20.min.js
Scripts/modernizr-2.5.3.js
SESOL.png
Scripts/jquery.formatCurrency-1.4.0.min.js
http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css
http://code.jquery.com/jquery-1.8.2.min.js
http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js
Content/themes/images/icons-18-white.png
Controllers/AccountController
Controllers/HomeController
Models/AccountModels
Account/Login
Home/CheckOut

Примечание2: удалите все пробелы после каждой строки. Примечание: 3 вам нужно следовать точной форме FOLDER/File или FOLDER/FOLDER/FILE ect....

Просто потому, что у вас файл манифеста не означает, что он будет загружаться. вам нужно добавить в тег следующее:

<html manifest="~/cache.manifest" type="text/cache-manifest">

Не забывайте, что после его добавления он кэшируется при первой загрузке страницы. Поэтому вам нужно зарегистрировать событие кеша в событии "mobileinit".

$(document).on("mobileinit", function () {
  //register event to cache site for offline use
cache = window.applicationCache;
cache.addEventListener('updateready', cacheUpdatereadyListener, false);
cache.addEventListener('error', cacheErrorListener, false);
function cacheUpdatereadyListener (){
    window.applicationCache.update();
    window.applicationCache.swapCache();
    }
    function cacheErrorListener() {
        alert('site not availble offline')
    }
}

Загрузите Safari и используйте веб-инспектор, чтобы найти ошибки. http://developer.apple.com/library/safari/#documentation/appleapplications/Conceptual/Safari_Developer_Guide/1Introduction/Introduction.html#//apple_ref/doc/uid/TP40007874-CH1-SW1

Совет. Инструменты разработчика Chrome "F12" покажут вам ошибки в нагрузке манифеста. т.е. файлы, которые вам нужно добавить.

Надеюсь, что это поможет, охватывает весь процесс. Я предполагаю, что если вы находитесь на этом этапе разработки, вам нужно добавить их в мобильный init:

$.mobile.allowCrossDomainPages = true; // cross domain page loading
$.mobile.phonegapNavigationEnabled = true; //Android enabled mobile
$.mobile.page.prototype.options.domCache = true; //page caching prefech rendering
$.support.touchOverflow = true; //Android enhanced scrolling
$.mobile.touchOverflowEnabled = true; // enhanced scrolling transition availible in iOS 5

Руководство разработчика Safari: https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/Client-SideStorage/Client-SideStorage.html#//apple_ref/doc/uid/TP40002051-CH4-SW4

Ответ 3

Вы пробовали что-то вроде https://manifest-validator.appspot.com/ для проверки вашего манифеста?

Я долгое время боролся с файлом манифеста, очень сложно определить, что не так. Может быть что-то столь же простое, как неправильное кодирование, до дополнительного прерывания строки в начале.

Ответ 4

Сегодня я испытал точно такую же проблему. После нескольких часов работы я получил ключевой момент: формат файла манифеста. Короче говоря, файл должен начинать новую строку ТОЛЬКО с ascii (0A), а не ascii (0D) или ascii (0D + 0A). Только таким образом я могу жить с Chrome, или я получу пустую страницу и информацию об ошибках в окне консоли.

В соответствии с w3c, (http://www.w3.org/TR/html5/offline.html), в "5.6.3.2" Написание явных проявлений кеша ", допустимы как 0A, 0D, так и 0D + 0A. Итак, мое мнение: Chrome не совместим с w3c в этой точке.

Далее, скажем, если myapp.js должен быть кэширован, он ДОЛЖЕН следовать тому же правилу: начинает новую строку только с ascii (0A), или Chrome будет бросать ту же информацию в окна консоли.

Мой Chrome - это 13.0.782.107

Ответ 5

Я только что наткнулся на эту ссылку:

http://www.kaspertidemann.com/regarding-the-manifest-fetch-failed-error-in-chrome/

Ответ 6

Я решил эту проблему в visual studio для приложения MVC. выполните следующие шаги:

Я создал файл .appcache в блокноте и копировал содержимое файла манифеста в него. (вам не нужно создавать файл манифеста или не создавать представление Manifest.cshtml. просто создайте файл .appcache в блокноте.)
укажите ссылку как <html manifest="~/example.appcache"> и проблема будет решена.

Ответ 7

Я думаю, что линия

CACHE:

отсутствует в файле манифеста (должна быть вторая строка перед списком файлов.