【问题标题】:Session killed while editing Summernote编辑 Summernote 时会话终止
【发布时间】:2021-09-15 00:10:47
【问题描述】:

如果计算机无人看管,我的视图有一行返回登录屏幕:

<meta http-equiv="refresh" content="120; url=/auth/login/" />

问题是,如果我在 Summernote 框中写的时间过长,会话就会终止。这是一个很长的文本,编辑它很容易超过 2 分钟。 如果用户在该 summernote 中使用键盘,我如何避免终止会话?

谢谢!

【问题讨论】:

    标签: php codeigniter session


    【解决方案1】:

    我们可以在 JavaScript 中处理它,而不是使用 meta 标签来处理重定向。

    const sn = document.getElementById('summernote');
    let redirecTimer, stopTypingTimer;
    
    sn.addEventListener('keyup', function() {
      console.log(this.value);
    
      /* Clear previous timers to prevent overlaps */
      stopTimer(redirecTimer);
      stopTimer(stopTypingTimer);
    
      stopTypingTimer = window.setTimeout(function() {
        console.log('Stopped Typing');
        startTimer();
      }, 5000); // Assume it takes 5 secs for a user to stop typing
    });
    
    
    function startTimer() {
      redirecTimer = window.setTimeout(function() {
        console.log("User is not typing. So Redirect..");
        //window.location = "http://www.google.com";
      }, 3000); // Redirect in 3 seconds. For 2 minutes set it to 120000
    }
    
    function stopTimer(timer) {
      clearTimeout(timer);
    }
    &lt;textarea id="summernote"&gt;&lt;/textarea&gt;

    更新:将事件应用于 DOM 中的所有元素

    const sn = document.getElementById('summernote');
    let redirecTimer, stopTypingTimer;
    
    /* Extend the events as per the need and elements you have in DOM.
       `change` and `keyup` should capture all possible input elements
    */
    
    ['change', 'keyup'].forEach(function(e) {
      document.addEventListener(e, function() {
        console.log('User is interacting with the page');
    
        /* Clear previous timers to prevent overlaps */
        stopTimer(redirecTimer);
        stopTimer(stopTypingTimer);
    
        stopTypingTimer = window.setTimeout(function() {
          console.log('Stopped Typing');
          startTimer();
        }, 5000); // Assume it takes 5 secs for a user to stop typing
      });
    });
    
    
    function startTimer() {
      redirecTimer = window.setTimeout(function() {
        console.log("User is not typing. So Redirect..");
        //window.location = "http://www.google.com";
      }, 3000); // Redirect in 3 seconds. For 2 minutes set it to 120000
    }
    
    function stopTimer(timer) {
      clearTimeout(timer);
    }
    <textarea id="summernote"></textarea>
    <input type="checkbox">Hi
    <input type="text"/>
    <input type="radio"/>I am Radio button
    <select>
      <option value="1">1</option>
      <option value="2">2</option>
    </select>

    【讨论】:

    • 我喜欢这个想法,但有没有办法为整个视图实现它?我对 3 个夏季笔记、文本字段、复选框等有相同的看法。我不想为所有人复制这么多。是否可以在一个像对象一样的对象中完成,也许是整个 DOM?
    • 是的,这是可能的。检查我更新的答案。
    • 完美。奇迹般有效。谢谢萨米尔!
    • 很高兴我能帮上忙!编码愉快!
    猜你喜欢
    • 2016-11-05
    • 1970-01-01
    • 2013-12-19
    • 2017-01-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-08-22
    相关资源
    最近更新 更多