Администрирование WEB SQL DB в Chrome

    image

    Прочитав однажды вот этот пост, после покопавшись в черновиках w3c, начал потиху в этом пытаться разбираться.
    Сразу оговорюсь, что технология хранения данных на стороне клиента — штука не новая. А в этом варианте, так ещё и, в большей степени, вебкитная (webkit) да и под html5, так что может многих отпугнуть.
    Рассказывать как она работает я не буду (есть ссылки чуть выше, там всё подробно описано), а хотел бы обратить выше внимание на администрирование БД при помощи браузера Chrome

    Ну что ж, приступим. Напомню, что бы запустить нашу «админку» просто нажмите Ctrl+Shift+I
    Окно разделено на 3 части: в левой — список БД с таблицами, в правой — окно ввода sql-скриптов, в нижней — окно для ввода js-скриптов

    Для того, чтобы создать (ну или подключить нашу, ранее созданную базу), необходимо в консоли написать следующий js скриптик

    openDatabase("Test", "1.01", "Chrome DB",20000)

    (о синтаксисе подробнее тут )

    а далее по простому алгоритму:
    создадим таблицу
    image


    как видим она малость пуста…
    image


    … наполним её написав обычный insert
    image


    Когда таблица готова, мы можем провести с ней разные манипуляции (select, update...)
    image


    Кроме как создавать, той же командой мы можем присоединить и ранее созданную БД с готовыми, «рабочими таблицами»
    image


    Файлы с БД хранятся в XP по адресу C:\Documents and Settings\user\Local Settings\Application Data\Google\Chrome\User Data\Default\databases\file__0\

    Вот так просто администрировать (пусть так громко, но термин есть термин) web sql db при помощи нашего любимого chrome.
    Надеюсь эти небольшие знания помогут вам создавать интересные локальный приложения для своих целей, а так же красивые, мощные расширения.
    Спасибо за внимание!
    Поделиться публикацией
    Похожие публикации
    Реклама помогает поддерживать и развивать наши сервисы

    Подробнее
    Реклама
    Комментарии 36
    • –22
      Спасибо, а еще есть SQLite Administrator.
      • +9
        sqlite и то, о чём написал автор — разные вещи.
        • 0
          Хехе, Webkit использует SQLite для хранения баз данных, так что ээээ не обижайте человека.
      • +2
        А есть опыт реального использования? Было бы интересно почитать.
        • +1
          есть опыт реального использования.
          У нас киоски (ну типа апаратов quiwi или как там их) работают не как у всех на flash и adobe air а именно на Chromium. Опыт положительный, но еще не время публикации этой инфы для широкомасштабной публики. Через месяц-полтора опубликуем статью.

          Пока более ничего не скажу.
          • 0
            А какой макс. объём данных можно хранить в одной базе (в браузере)?

            Если будет переполнение, что делать? Можно ли увеличить объём?

            • 0
              У нас там всего лишь корзина, ну и кэш по некоторым данным продуктов (это своеобразный инет-магазин). Не думаю, что наша база превышает 10М. На переполнение не тестировали, но идея хорошая — надо бы.

              Не забудьте, что при openDatabase вы задаете нужный вам объем…
              • 0
                Я проверил в Хроме — там 5 мегов ограничение, хотя проставил 100 Мб. Проставил 100 Кб, всё равно 5 Мб предел. Не работает это в Хроме.

                Проверять на ошибки записи (в том числе переполнение) можно, обрабатывая функции ошибку (третья):

                                chrome.extension.getBackgroundPage().Storage.db.transaction(
                                	function (tx) {
                                             //.... тут записываем в базу
                                        },
                                    function(sqlError) {
                //.. тут находимся, значит ошибка какая либо. код ошибки в .code
                                    },
                                    function() {
                                    	}
                                    }
                


                В других браузерах пока не успел проверить.

                Но в Хроме также можно хранить в localStorage, поэтому это ещё +5Мб. Он не проверяет на общее ограничение памяти.

                Это я создаю одно расширение для Хрома, Оперы и Firefox. Сначала использовал localStorage, но памяти маловато и много уходит на экранировку и повторы ключей. Поэтому решил перейти на sqlite…

                Какие ещё есть варианты увеличения объёма?
                • 0
                  В Хроме можно обойти ограничение, используя в манифесте

                  «permissions»: [
                  «unlimitedStorage»
                  ],

                  А вот в Опере ограничение 5 Мб и похоже ничем это не увеличить…
        • +1
          Добавлю также, что по умолчанию размер базы данных равен 5 Мб. Можно и больше, но при попытке создать БД размером больше 5 Мб, браузер выдаст соответствующее предупреждение.
          • +1
            Спасибо за статью.

            Было бы неплохо добавить статью реальными примерами, где это могло понадобиться.
            • +1
              я бы тоже почитал статью о опыте кто уже это применяет, поскольку достаточно часто сталкиваешься с ситуацией когда загружаешь достаточно большое кол-во данных клиенту, а затем с ними необходимо манипулировать (фильтарция, сортировки, поиск и пр.), сейчас реализуется за частую аякс запросами к серверу и повторной подгрузкой результата… но почему бы и не организовать на клиенте.
              • +1
                ну вот вам пример:
                при обрыве связи и неудачной посылке данных на сервер продолжать работу локально, а при возобновлении синхронизироваться и продолжить работу дальше.
                • 0
                  в смысле пример на html+js
                • 0
                  Я пока пользуюсь массивами. Работает даже на IE6…
                  • +1
                    нажал F5 и нет массивов ;)
                    • 0
                      Для этого есть актуальные данные на сервере… :) А фильтрация, сортировка и поиск не изменяют данные :)
                • 0
                  на мобильных браузерах с поддержкой Geolocation API можно сохранять данные, по которым потом можно построить gps трек передвижений.
                  • 0
                    Использую данную технологию в мобильном клиенте для своего приложения. В связке с jQTouch получается красиво и функционально.
                  • 0
                    в ie следует ожидать движок ms sql compact, в mozilla точно sqlite, а какой в хроме?
                    • 0
                      Хром наверняка тоже использует sqlite как бекенд к web sqli db.
                      • 0
                        Угу, он самый.
                    • –4
                      а так же красивые, мощный расширения.

                      Исправьте, пожалуйста, уж очень сильно бросается в глаза.
                      • 0
                        вроде это не только в Хроме, а во всех WebKit based браузерах
                        • +1
                          нравится!!! надо опробовать
                          • +1
                            Спасибо! Будем пробовать.
                            • +2
                              Казалось бы, причем здесь Chrome, в Safari тоже самое есть. Это функционал WebKit.
                              • 0
                                осталось найти какой-нибудь удобный jquery плагин для работы и можно быть довольным
                                • 0
                                  Есть ли способы определения, поддерживает ли браузер WEB SQL DB?
                                • 0
                                  Поддержат ли это другие браузеры? Станет ли такое хранение данных на стороне клиента стандартом?
                                  Интересно было бы устроить тест производительности этой базы…
                                  • 0
                                    это часть стандарта html5 так что к году этак 2022 (вроде так) будут поддерживать большинство.
                                    Ну а про тестирование производительности… как-то даже и не задумывался об этом. Не те задачи. не с mysql ем же сравнивать
                                    • 0
                                      Работает в сафари и айфон сафари.
                                    • 0
                                      Посмотрел C:\Users\1\AppData\Local\Google\Chrome\User Data\Default\databases\file__0\ там файлы под номерами… там 6,7
                                      можно как-то управлять создаваемым именем?
                                      я думал он будет называться как моя БД
                                      скажем я написал db = openDatabase(«MyDB», «1.0, „My DB.“, 5 * 1024 * 1024);
                                      а в папке файл называется просто 8
                                      (
                                      • 0
                                        а на андроиде chrome где базу сохранит кто-нибудь знает?

                                        Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.