Я пытаюсь использовать новые сайты Google для веб-страницы, которую я разработал, однако у меня возникают проблемы с хранением локальных данных. Локальные файлы прекрасно работают в Windows и Apple Safari / Chrome. Попробуйте это с Сайтов Google, и не радуйтесь! Кроме того, в safari возникает ошибка: «IDBFactory.open () вызван в недопустимом контексте безопасности».
Я бы очень хотел разместить свой сайт на сайтах Google без ссылки на другой сервер. Мне особенно нужны локально постоянные данные только для нескольких небольших элементов. Я не могу заставить куки работать.
Есть предложения?
Я пробовал это на Windows 10 Surface Pro 2017, Apple iPad под управлением 12.2 Safari, Apple Mac Mini под управлением MacOs Mojave 10.14. Я использую SimpleHTTPServer из командной строки Windows 10 для обмена файлами в качестве веб-сервера. Я также посылаю файлы по электронной почте и открываю напрямую в указанных системах. Наконец, я создал новый веб-сайт Google Sites по адресу https://sites.google.com/view/gerrymap Это очень просто, просто элемент HTML для вставки с текстом ниже, скопированным в поле редактирования исходного кода. Приглашаем всех посетить эту страницу, если они того пожелают. В противном случае используйте короткий опубликованный файл ниже.
Инструкции находятся на самой странице HTML.
Весь код работает нормально из локального экземпляра HTML-файла. Может вводить новые значения для lat, long, rad и key, сохранять их и читать их. Я также могу обновить страницу, а затем прочитать их без предварительного сохранения, и это не проблема. Это доказывает, что значения не являются постоянными в сеансе.
С сайтами Google это другое дело. Я создал сайт, который использует HTML-файл в этом вопросе. Когда я ввожу новые значения и нажимаю кнопку сохранения, IndexedDB завершается ошибкой, но localStorage успешно возвращает сохраненные значения. Однако, если я нажимаю кнопку обновления, а затем считываю значения, не пытаясь сначала сохранить их, IndexedDB снова завершается ошибкой, но localStorage также завершается ошибкой, поскольку не получает никаких значений.
Я полагаю, что я правильно реализовал код (хотя некоторые могут принять исключение, я уверен. Никакой гордости здесь, критики приветствуются).
Я провел несколько поисковых запросов в Google, особенно о сайтах Google и indexeddb / localstorage, а также разместил их на справочном форуме сообщества Google. Все еще безуспешно.
В настоящее время у меня нет резервных методов, но нужно что-то относительно простое. Может ли кто-нибудь бросить мне немного радости? Заранее спасибо!
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Test Local Storage</title>
<style>
</style>
</head>
<body onload="initializeValues()">
Instructions: <br />
1. Save this sample code in an html file locally and open in a browser.<br />
2. Enter different values into the lat, long, rad, and key edit boxes.<br />
3. Press TrySave to store the values in indexedDB and localStorage.<br />
4. Refresh the webpage from the browser address line<br />
5. Press the individual Try IndexedDB and Try LocalStorage buttons to attempt<br />
6. Try inserting this code into a New Google Site, or access https://sites.google.com/view/gerrymap/home <br />
<br>
<input id="latitude" /> Latitude<br><br>
<input id="longitude" /> Longitude<br><br>
<input id="radius" /> Radius<br><br>
<input id="key" /> Key<br><br>
<button onclick="TryIndexedDB()" title="This tries to load via IndexedDB">Try IndexedDB</button><br><br>
<button onclick="TryLocalStorage()" title="This tries to load via localStorage">Try localStorage</button><br><br>
<button onclick="trySave()" title="This tries to save the data in both methods (IndexedDB, localStorage)">Try Save</button><br><br>
<button onclick="clearAll()" title="Clear the log space at the bottom of this example page">Clear Log</button><br><br>
<div id="hello">
</div>
<script>
"use strict";
function clearAll() {
document.getElementById("hello").innerHTML = "";
}
// tagBeginDefaultsReplace
var navLatitude = 39;
var navLongitude = -76.7;
var navMaxDist = 200;
var navKey = "PleaseAddYourKey";
function initializeValues() {
document.getElementById("latitude").value = navLatitude;
document.getElementById("longitude").value = navLongitude;
document.getElementById("radius").value = navMaxDist;
document.getElementById("key").value = navKey;
}
function trySave() {
navLatitude = document.getElementById("latitude").value;
navLongitude = document.getElementById("longitude").value;
navMaxDist = document.getElementById("radius").value;
navKey = document.getElementById("key").value;
// Save using indexeddb
getLocationDB(true, FinishIndexedDB);
// Save using localStorage
localStorage.setItem('latitude', navLatitude.toString());
localStorage.setItem('longitude', navLongitude.toString());
localStorage.setItem('radius', navMaxDist.toString());
localStorage.setItem('key', navKey.toString());
mylog("Done saving localStorage");
}
function getLocationDB(bSave, callbackf) {
var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB || window.shimIndexedDB;
var openDB;
try {
var myitem;
openDB = indexedDB.open("SampleDatabase", 1);
openDB.onupgradeneeded = function () {
var db = openDB.result;
var store = db.createObjectStore("SampleStore", { keyPath: "id" });
var index = store.createIndex("PosIndex", ["pos.latitude", "pos.longitude", "pos.radius", "pos.navkey"]);
};
openDB.onsuccess = function () {
// Start a new transaction var db = openDB.result;
callbackf("Successfully opened openDB");
var db = openDB.result;
var tx = db.transaction("SampleStore", "readwrite");
var store = tx.objectStore("SampleStore");
if (bSave) {
if (navLatitude != undefined && navLongitude != undefined && navMaxDist != undefined)
store.put({ id: 0, pos: { latitude: navLatitude, longitude: navLongitude, radius: navMaxDist, navkey: navKey } });
else
store.put({ id: 0, pos: { latitude: "38", longitude: "-75.7", radius: "100", navkey: "Please Enter Mapbox Key" } });
callbackf("Save indexeddb finished");
}
else {
var getNavLoc = store.get(0);
getNavLoc.onsuccess = function () {
if (getNavLoc != undefined
&& getNavLoc.result != undefined) {
callbackf("Succeeded reading from store. Result=" + JSON.stringify(getNavLoc.result));
navLatitude = parseFloat(getNavLoc.result.pos.latitude);
navLongitude = parseFloat(getNavLoc.result.pos.longitude);
navMaxDist = parseFloat(getNavLoc.result.pos.radius);
navKey = getNavLoc.result.pos.navkey;
}
else {
callbackf("Succeeded reading from store. Result=undefined");
navLatitude = navLongitude = navMaxDist = navKey = "undef";
}
initializeValues();
}
getNavLoc.onerror = function () {
callbackf("An error occurred getting indexeddb");
}
}
}
openDB.onerror = function () {
callbackf("An error occurred opening openDB");
}
}
catch (e) {
callbackf("Caught error in try block of indexeddb: " + e.Message);
}
}
function TryIndexedDB() {
getLocationDB(false, FinishIndexedDB);
}
function TryLocalStorage() {
mylog("localStorage read");
navLatitude = localStorage.getItem('latitude');
mylog("latitude=" + navLatitude);
navLongitude = localStorage.getItem('longitude');
mylog("longitude=" + navLongitude);
navMaxDist = localStorage.getItem('radius');
mylog("radius=" + navMaxDist);
navKey = localStorage.getItem('key');
mylog("key=" + navKey);
if (navLatitude == undefined)
navLatitude = "undef";
if (navLongitude == undefined)
navLongitude = "undef";
if (navMaxDist == undefined)
navMaxDist = "undef";
if (navKey == undefined)
navKey = "undef";
initializeValues();
}
function FinishIndexedDB(nSucceeded) {
mylog(nSucceeded);
}
function mylog(logstr) {
document.getElementById("hello").innerHTML += "<br>" + logstr.toString();
}
</script>
</body>
</html >