Как сохранить в локальное веб-хранилище во Flutter Web

У меня есть веб-сайт, созданный с помощью flutter для Интернета, и в настоящее время я пытаюсь сохранить в локальном веб-хранилище или cookie, но не могу найти какой-либо плагин или способ его заархивировать.


person ikben    schedule 02.06.2019    source источник


Ответы (6)


Вы можете использовать window.localStorage из dart:html

import 'dart:html';

class IdRepository {
  final Storage _localStorage = window.localStorage;

  Future save(String id) async {
    _localStorage['selected_id'] = id;
  }

  Future<String> getId() async => _localStorage['selected_id'];

  Future invalidate() async {
    _localStorage.remove('selected_id');
  }
}
person Dariusz Bacinski    schedule 18.06.2019
comment
@ dazza5000 Нет, это не работает на flutter 1.9, проверьте сами, вы увидите, что это не так - person ikben; 16.10.2019

Пакет shared_preferences dart теперь поддерживает локальное хранилище для Интернета, начиная с версии 0.5.4.7+

Подобно общему предпочтению на Android и iOS, ниже приведен фрагмент кода для локального хранилища в Интернете.

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart'; // rememeber to import shared_preferences: ^0.5.4+8


void main() {
  runApp(MaterialApp(
    home: Scaffold(
      body: Center(
      child: RaisedButton(
        onPressed: _incrementCounter,
        child: Text('Increment Counter'),
        ),
      ),
    ),
  ));
}

_incrementCounter() async {
  SharedPreferences prefs = await SharedPreferences.getInstance();
  int counter = (prefs.getInt('counter') ?? 0) + 1;
  print('Pressed $counter times.');
  await prefs.setInt('counter', counter);
}
person slamarseillebg    schedule 09.12.2019
comment
Для меня SharedPreferences prefs = await SharedPreferences.getInstance(); никогда ничего не возвращает. - person EzPizza; 01.09.2020
comment
@EzPizza попробуйте добавить явную зависимость от shared_preferences_web: ^0.1.2+7 - person Alex Kuzmin; 13.10.2020

С flutter 1.10 мы можем использовать пакет universal_html:

import 'package:universal_html/html.dart';
// ...
// read preference
var myPref = window.localStorage['mypref'];
// ...
// write preference
window.localStorage['mypref'] = myPref;

person Spatz    schedule 21.09.2019

Я столкнулся с аналогичной проблемой, когда мои предпочтения не сохранялись при выполнении. Я думал, window.localStorage сломался. Я обнаружил, что Flutter по умолчанию просто запускается каждый раз с новым номером порта, поэтому window.localStorage стирается.

В этом билете говорится о настройке явного порта. Это устранило мою проблему, и теперь window.localStorage сохраняется при выполнении:

https://github.com/Dart-Code/Dart-Code/issues/1769

В VS Code вы можете установить номер порта в вашем launch.json файле:

{
    "name": "Flutter",
    "request": "launch",
    "type": "dart",
    "args": ["--web-port", "8686"]
},
person Aaron Scherbing    schedule 13.05.2020

После обновления до flutter 1.9 'dart:html' больше не компилируется, поскольку он не является частью dart SDK, поставляемого с Flutter. В настоящий момент мы можем использовать этот пакет, поскольку он поддерживает Android, IOS и WEB: crypted_preferences

person yshahak    schedule 12.09.2019
comment
Хотя, как кто-то писал в slack, похоже, что он все еще доступен, но в анализаторе есть ошибка, из-за которой IDE выдает ошибку, но если вы ее запустите, она работает. - person yshahak; 16.09.2019
comment
Для этого пакета требуется путь. Кто-нибудь знает, что это должно быть? - person Jason Spick; 07.10.2019
comment
Это может быть что угодно, только здесь и будут сохраняться данные. Вы можете увидеть их пример, где они используют: Preferences.preferences(path: './example/prefs') - person yshahak; 10.10.2019
comment
Должен ли существовать этот файл? будет ли он создан, если этого не произойдет. Если нет, то в каком формате он должен быть и какова основа пути? - person Jason Spick; 10.10.2019
comment
он будет создан, если не существует AFAIK. ./ - это корень вашего проекта. - person yshahak; 11.10.2019

я использую пакет shared_preferences для хранения данных в хранилище местоположения

class SessionManager {
  static SessionManager manager;
  static SharedPreferences _prefs;

  static Future<SessionManager> getInstance() async {
    if (manager == null || _prefs == null) {
      manager = SessionManager();
      _prefs = await SharedPreferences.getInstance();
    }
    return manager;
  }

  void putCityId(String cityId) {
    _prefs.setString("KEY_CITY_ID", cityId);
  }

  String getCityId() {
    return _prefs.getString("KEY_CITY_ID") ?? "";
  }
}

shared_preferences хранит данные только для текущего сеанса.

Если вы хотите хранить данные постоянно, вам следует использовать cookie для хранения данных.

Cookie-файл, используемый для хранения данных в cookie-файлах браузеров.

   import 'dart:html';

   class CookieManager {
      static CookieManager _manager;

      static getInstance() {
        if (_manager == null) {
          _manager = CookieManager();
        }
        return _manager;
      }

      void _addToCookie(String key, String value) {
        // 2592000 sec = 30 days.
        document.cookie = "$key=$value; max-age=2592000; path=/;";
      }

      String _getCookie(String key) {
        String cookies = document.cookie;
        List<String> listValues = cookies.isNotEmpty ? cookies.split(";") : List();
        String matchVal = "";
        for (int i = 0; i < listValues.length; i++) {
          List<String> map = listValues[i].split("=");
          String _key = map[0].trim();
          String _val = map[1].trim();
          if (key == _key) {
            matchVal = _val;
            break;
          }
        }
        return matchVal;
      }
    }
person Dhanaji Yadav    schedule 02.06.2020