【问题标题】:How to solve the invalid problem of electron's setInterval?如何解决electron的setInterval无效问题?
【发布时间】:2021-05-06 01:52:30
【问题描述】:

我在尝试编写电子应用程序时遇到了一个难题。以下是问题的详细描述: 我打算在电子渲染过程的页面上加载一个时钟。就像我们的系统时间一样,每秒会刷新一次,60秒就是一分钟,以此类推,但是我不使用系统时间,我使用了一个当前的Time API,这个API接口返回的json数据就是当前的时间。我在主进程main.js中写了一组异步执行函数来获取这个API传递的数据。以下是主流程main.js 异步获取时间API代码:

const request = net.request('http://api.k780.com:88/?app=life.time&appkey=10003&sign=b59bc3ef6191eb9f747dd4e83c99f2a4&format=json')

  request.on('response', (response) => {
    console.log(response.statusCode);
    console.log(response.headers);

    response.on('data', (chunk) => {
      let result = JSON.parse(chunk).result;
      let datetime = result.datetime_1;
      let week = result.week_4;
      console.log(datetime, week)
      mainWindow.webContents.send('datetime', { datetime, week });
    })

    response.on('end', () => {
      console.log('end');

    })

  })
  request.end();

主进程显示的控制台信息如下:

200
{
  server: 'nginx',
  date: 'Thu, 06 May 2021 01:38:00 GMT',
  'content-type': 'application/json; charset=utf-8;',
  'transfer-encoding': 'chunked',
  connection: 'keep-alive',
  'access-control-allow-origin': '*'
}
2021-05-06 09:38:01 Thursday
end

然后在请求这个 API 之后,它会以当前时间的时间戳进行响应。主进程获取到这个时间戳后,会通过webContents.send发送给我的渲染进程。以下是主进程发送给渲染进程的代码:

mainWindow.webContents.send('datetime', { datetime, week });

渲染进程通过ipcRenderer.on获取主进程发送的时间数据,然后将这个时间戳格式化输出到我的渲染进程页面。我把这组代码写成一个函数如下:

function getNetTime() {
    //Get the date and time passed by the main process
        ipcRenderer.on('datetime', (event, arg) => {
            let datetime = arg.datetime; //Get date and time
            let week = arg.week; //Get the day of the week
            let year = datetime.substring(0, 4); //Get year
            let month = datetime.substring(5, 7); //Get month
            let day = datetime.substring(8, 10); //Get the day
            let hour = datetime.substring(10, 13); //Get hour
            let min = datetime.substring(14, 16); //Get minutes
            let sec = datetime.substring(17, 19); //Get seconds
            let weekday = ""; //Get Chinese weekday
            const timeText = document.querySelector('#timeText')
            // console.log(datetime);
            // console.log(week);
            // console.log(year,month,day,hour,min);
            switch (week) {
                case'Monday':
                    weekday ='Monday';
                    break;
                case'Tuesday':
                    weekday ='Tuesday';
                    break;
                case'Wednesday':
                    weekday ='Wednesday';
                    break;
                case'Thursday':
                    weekday ='Thursday';
                    break;
                case'Friday':
                    weekday ='Friday';
                    break;
                case'Saturday':
                    weekday ='Saturday';
                    break;
                case'Sunday':
                    weekday ='Sunday';
                    break;
            }
            timeText.innerHTML =`${year}year${month}month${day}day ${weekday}${hour}:${min}:${sec}`;

        });

现在遇到的问题是当前时间虽然可以在渲染进程的页面上正常显示,但是不能自动刷新。我想通过setTimeout或者setInterval设置为每1000毫秒刷新一次,相当于时钟1秒走一步。但它没有效果。当前时间只能在程序重新打开时显示,不能自动刷新。下面是setInterval的代码:

window.onload = () => {
    getNetTime();
    setInterval(getNetTime(),1000)
    
}

以上是我现在遇到的问题。 Electron 也刚刚取得联系。我在网上找了很久。但是没有用。请帮助或尝试提供一些想法如何实现这一目标。

【问题讨论】:

标签: javascript request electron settimeout setinterval


【解决方案1】:

您遇到的问题与 Electron 或您如何从 API 请求数据无关。这是关于如何设置间隔。

setInterval() function 需要一个函数或一串代码作为参数。但是,您指定 getNetTime() 作为它应该调用的代码。这不是一个功能。这是一个函数调用,将在setInterval() 被调用之前进行评估。这不会做任何事情,因为getNetTime() 的返回类型是undefined

要缓解这种情况,您可以使用函数、箭头函数或省略括号。随心所欲,随心所欲。

setInterval (getNetTime, 1000);
// or
setInterval (() => getNetTime (), 1000);
// or
setInterval (function () { getNetTime (); }, 1000);

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-10-25
    • 2021-08-07
    • 2012-07-05
    • 2017-11-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-06-26
    相关资源
    最近更新 更多