1

当我尝试使用 Service Worker 在 Chrome 中访问 IndexedDB 时出现异常。我没有使用网络服务器，所以我在浏览器上本地执行我的 html 文件，所以我的 url 类似于

file:///D:/Dev/web/sample-sw/index.html

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

这是一个例外：

未处理的拒绝：OpenFailedError：SecurityError 无法在“IDBFactory”上执行“打开”：在此上下文中拒绝访问索引数据库 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>

我很感激一些帮助。谢谢你。

4

2 回答 2

2

使用标志 --allow-file-access-from-files 启动 chromium

于 2017-04-07T12:56:24.643 回答
1

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

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

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

于 2017-03-15T09:54:05.317 回答