Question

当我尝试使用Service Workers访问Chrome中的IndexedDB时，我遇到了异常。我没有使用网络服务器，所以我在浏览器本地执行我的html文件，所以我的网址就像

文件：/// d：/Dev/web/sample-sw/index.html

我不知道为什么代码适用于Firefox，但它不适用于Chrome。

这是一个例外：

未处理拒绝：OpenFailedError：SecurityError无法执行 “IDBFactory”上的“open”：拒绝访问Indexed Database API 在这种情况下。

我的index.html是这样的：

<html>
<head>
    <title>Offline Google Analytics Demo</title>
</head>
<body>

    <button type="button" onclick="startWorker()" id="btnStart">
      Start WebWorker
  </button>

  <button type="button" onclick="stopWorker()" id="btnStop">
      Stop WebWorker
  </button>


<p id="demo"></p>

<!-- Include Dexie -->
<script src="https://unpkg.com/dexie@latest/dist/dexie.js"></script>
<!-- Include JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>


<script id="worker" type="javascript/worker">

importScripts("https://unpkg.com/dexie@latest/dist/dexie.js");

var started = false;
var timer;

onmessage = function (event)
{
    var orden = event.data.toString();

    switch (orden)
    {
        case 'start':
            start();
            break;

        case 'stop':
            stop();
            break;

        default:
        notRecognized(orden);
            break;
    }
}


function start() {
    if(! started)
    {
        timer = setInterval(function(){ job() }, 3000);
        started = true;
    }
}

function stop() {
    if(started)
    {
        clearInterval(timer);
        started = false;
    }
}

function job()     
{

    var db = new Dexie("ga_offline");
    //db.delete();                               

    db.version(1).stores({
            urls: '++id,url,fecha'
        });


    db.urls.put({url: "home.html", fecha: '2017-03-07 10:00:00'});
    db.urls.put({url: "home2.html", fecha: '2017-03-07 10:00:00'});

}

function notRecognized(orden)
{
    var mensaje = 'Comando no reconocido';
    selt.postMessage(mensaje + ': ' + orden);
}

</script>


  <script type="text/javascript">

      var myWorker;

      //Al cargar la pagina, se llama al onload, que carga el WebWorker
      window.onload = function () {

         //carga de js externos no permitido en chrome, hay q programarlo inline con Blob
          //myWorker = new Worker("worker1");

          //creo un elemento al vuelo con el contenido del script que contiene al worker
            var blob = new Blob([ document.querySelector('#worker').textContent ], {type : 'text/javascript'});
            //creo el worker
            myWorker = new Worker(window.URL.createObjectURL(blob));

          //Cuando se recibe un mensaje del worker, se ejecuta esto
          myWorker.onmessage = function (event) {
              document.getElementById("demo").textContent = event.data; //cambiamos el texto del <p>
              console.log("Got: " + event.data + "\n");
          };

          //cuando se produzca un pedo en el worker, se invoca esto
          myWorker.onerror = function (error) {
              console.log("Worker error: " + error.message + "\n");
              throw error;
          };
      };//fin onload

    //click en botón iniciar, mandamos 'start' al worker
    function startWorker() {
        myWorker.postMessage('start');
    }
    //click en botón parar, mandamos 'stop' al worker
    function stopWorker() {
        myWorker.postMessage('stop');
    }

  </script>

</body>

我感谢一些帮助。谢谢。

Answer 1

使用标志--allow-file-access-from-files

启动chrome

Answer 2

可能是您没有通过网络提供服务。如果您安装了npm，请尝试从shell或命令提示符执行此操作，看看是否有帮助：

npm install http-server -g
cd <your web root>
http-server -c .

然后启动浏览器http://localhost:8080/并在浏览器中查看控制台。

在此上下文中拒绝访问索引数据库API

2 个答案: