Question

我正在寻找能够找到素数的解决方案，除了一个问题外，一切正常。它停在i == 373＆amp;＆amp; j == 15在web worker文件中。重新加载页面后，我的Html页面消失并执行可以恢复。但输入参数是相同的（它们存储在localStorage中）它让我发疯。经过一段时间后，执行再次停止并且html元素消失。控制台中的js也不能正常工作。没有错误被处理。我很茫然。谢谢。

MAIN.JS

    var db = openDatabase("primeNumbers", "0.1", "Prime numbers db", 200000);
    db.transaction(function (tx) {
      tx.executeSql("CREATE TABLE  IF NOT EXISTS primeNumbers (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, value INTEGER NOT NULL UNIQUE)", [], null, null);
    });
    var settings = {};
    prepareData();

    $(document).ready( function() {
      $('#start_button').click( function() {
        toggleButton();
      });
      $('#show_table_button').click(function() {
        showTableButton();
      });
      $('#show_canvas_image_button').click(function() {
        showCanvas();
      });
    });

    //check if db can be used
    if(!db){alert("Failed to connect to database.");}

    var currNumber = 2;
    var work;

    var worker = new Worker('js/worker.js');//(blobURL);

    //worker event listener
    worker.onmessage = function(event) {
      (event.data != undefined) && (settings.bFlag = true);
      finder(true);
    };

function finder(again) {
  if(settings.j == 14 && settings.i == 373) {
    console.log('70');
  };
  if(again) {
    if ( settings.bFlag ){
      settings.j = 0;
      if ( settings.iShag == 3 ){
        settings.i+=4;
        settings.iShag = 0;
      } else {
        settings.i+=2;
        settings.iShag++;
      };
      iSquare = Math.floor(Math.sqrt(settings.i));
      settings.bFlag = false;
    };
    settings.j++;
  };
  storeTempData();
  work && worker.postMessage('{\"i\":\"'+settings.i+'\",\"j\":\"'+settings.j+'\"}');
};

function toggleButton() {
  btn = $('#start_button');
  if(btn.text() != 'pause_calculations') {
    btn.text('pause_calculations');
    work = true;
    finder(false);
  } else {
    btn.text('resume_calculations');
    work = false;
  };
};

// table with data
function showTableButton() {
  //TODO: check if we can use this as parameter to function
  btn = $('#show_table_button');
  if(btn.text() == 'show_calculated_data') {
    btn.text('reload_table');
    renderTable();
  } else {
    //TODO: implement it renderTable();
  };
};

var table_data;

function renderTable() {
  getBlockOfDataFromDb( function() {
    $('#table_with_results').jqGrid({
      datatype: 'local',
      data: table_data,
      height: 230,
      width: 350,
      colNames: ['id', 'value'],
      colModel: [
        { name: 'id', index: 'id', width: 20, sorttype: 'int', align: 'right' },
        { name: 'value', index: 'value', width: 20, sorttype: 'int', align: 'right'}
      ],
      multiselect: false,
      caption: 'Prime numbers from db',
      rowNum: 10,
      pager: 'table_pager',
      pagination: true,
      gridview: true,
      edit:false,
      add:false,
      del:false
    });
  });
};

function getBlockOfDataFromDb(callback) {
  var res = [];
 db.transaction(function(tx) {
   tx.executeSql('SELECT * FROM primeNumbers', [], function(tx, result) { 
     result_length = result.rows.length;
     for(var i = 0; i < result_length; i++) {
       var json_obj = { id: result.rows.item(i).id, value: result.rows.item(i).value };
       res.push(json_obj);
     };
     table_data = res;
    callback();
   });
 });
};

Array.prototype.contains = function(k) {
    for(var p in this)
        if(this[p] === k)
            return true;
    return false;
};

function showCanvas() {
  var primeArray = [];
  var edge;
  db.transaction(function(tx) {
    tx.executeSql('SELECT * FROM primeNumbers', [], function(tx, result) { 
      result_length = result.rows.length;
      for(var i = 0; i < result_length; i++) {
        primeArray.push(parseInt(result.rows.item(i).value));
      };
      edge = parseInt(Math.sqrt(Math.max.apply(Math, primeArray))) + 1;

      canv_div = $('#canvas_div');
      $('<canvas width="'+edge+'" height="'+edge+'" id="canvas_elem"></canvas>').appendTo(canv_div);
      canv = $('#canvas_elem')[0];
      var context = canv.getContext('2d');
      var imgd = context.createImageData(edge,edge);
      var pix = imgd.data;
      var iter = 0;
      for (var i = 0; n = pix.length, i < n; i += 4) {
        pix[i] = 0;
        if(primeArray.contains(iter)) {
          pix[i+3] = 255;
        } else {
          pix[i+3] = 50;
        };
        iter++;
      }
      context.putImageData(imgd, 0,0);
    });
  });
};

function prepareData() {

  var ls = localStorage;

  if(ls.getItem('bFlag') && ls.getItem('i') && ls.getItem('j') && ls.getItem('iShag')) {
    settings.bFlag = (ls.getItem('bFlag') === 'true');
    settings.i     = parseInt(ls.getItem('i'));
    settings.j     = parseInt(ls.getItem('j'));
    settings.iShag = parseInt(ls.getItem('iShag'));
  } else {
    settings.i     = 7;
    settings.j     = 1;
    settings.iShag = 0;
    settings.bFlag = false;
    db.transaction(function(tx) {
      tx.executeSql('INSERT INTO primeNumbers (value) SELECT 2 AS value UNION SELECT 3 UNION SELECT 5');
    });
  };
};
function storeTempData() {
  localStorage.setItem('i'     , settings.i);
  localStorage.setItem('j'     , settings.j);
  localStorage.setItem('bFlag' , settings.bFlag);
  localStorage.setItem('iShag' , settings.iShag);
};

以及我的 WORKER.JS

onmessage = function(event) {
  data = JSON.parse(event.data);
  i = parseInt(data['i']);
  j = parseInt(data['j']);
  iSquare = Math.floor(Math.sqrt(i));
  run();
};
function run() {
  var db = openDatabase("primeNumbers", "0.1", "Prime numbers db", 200000);
  db.transaction(function(tx) {
    if(i == 373 && j == 15) {
      1+1;
    };
    tx.executeSql('SELECT value FROM primeNumbers WHERE id='+(j+1), [], function(tx, result) {
      val = parseInt(result.rows.item(0)['value']);
      if ( i % val == 0 ){
        self.postMessage('bFlag');
      } else if (j >= iSquare) {
        db.transaction(function(tx) {
          tx.executeSql('INSERT INTO primeNumbers (value) VALUES ('+i+')', [], function() {
            self.postMessage('bFlag');
          });
        });
      } else {
        self.postMessage();
      };
    },
    function(tx, error) {
      self.postMessage('Error processing SQL: ' + error);
    });
  }, function(error) {
    self.postMessage('Error processing Transaction: ' + error)
  });
};

我会对任何想法感到高兴。也许smb知道如何捕获错误或我需要在chrome Profiler中找到什么。我用过程写了一段视频。 youtube

Answer 1

问题已解决。我已将SELECT语句从worker移到main文件中。我认为这个问题出现在worker中的错误处理中，因为当我试图选择不存在的值（它需要算法）时，db会出现很多错误。

Html元素隐藏在脚本执行上

1 个答案: