@choiceform/os-client-core 2.1.65 → 2.1.69

package/dist/infer.js

@@ -1,414 +1,414 @@
-const inferCommander = {
-  /**
-   * 接受子任务发来的数据结果池
-   * 可能一下子接到很多工人发来的结果，来不及上传
-   * 先积累到这里
-   */
-  accumulated: [],
-
-  /**
-   * 是否开始了消耗数据结果池
-   */
-  consumingStarted: false,
-
-  /**
-   * 是否已经完成
-   */
-  ended: false,
-
-  /**
-   * 当前已发起并等待结果的请求数量
-   */
-  postingCount: 0,
-
-  /**
-   * 查询参数
-   * @type {{
-   *   max_try_count:string;
-   *   max_error_count:string;
-   *   thread: string;
-   *   dry: string;
-   *   max_skip_count: string;
-   *   sid: string;
-   *   fake_port: string;
-   *   real_port: string;
-   *   dev: string;
-   *   time_range: string;
-   *   status: string;
-   *   collector_id: string;
-   * }}
-   */
-  queryObj: null,
-
-  /**
-   * 派遣的工人个数
-   * @type {number}
-   */
-  iframeCount: 0,
-  /**
-   * 开始时间
-   * @type {number}
-   */
-  startTime: 0,
-  /**
-   * 消息展示div
-   * @type {HTMLElement}
-   */
-  messageDiv: null,
-  /**
-   * 错误展示div
-   * @type {HTMLElement}
-   */
-  errorDiv: null,
-  /**
-   * 工人状态展示div
-   * @type {HTMLElement}
-   */
-  workersDiv: null,
-  /**
-   *  消息颜色表
-   */
-  typeColorMap: {
-    error: 'red',
-    skip: 'orange',
-  },
-  /**
-   * 已成功次数
-   */
-  successCount: 0,
-  /**
-   * 已跳过次数
-   */
-  skipCount: 0,
-  /**
-   * 已错误次数
-   */
-  errorCount: 0,
-  /**
-   * 已尝试次数
-   */
-  tryCount: 0,
-  /**
-   * 已被拒绝次数
-   */
-  rejectCount: 0,
-
-  /**
-   * 要求的数量
-   */
-  requireCount: 0,
-
-  /**
-   * 时间日志
-   * @type {HTMLElement}
-   */
-  timeLog: null,
-
-  /**
-   * 开始运行
-   */
-  start() {
-    this.queryObj = this.queryToObj();
-    this.iframeCount = this.queryObj.thread || 10;
-    this.startTime = Date.now();
-    this.progressDiv = document.getElementById('message');
-    this.errorDiv = document.getElementById('error');
-    this.workersDiv = document.getElementById('workers');
-    this.timeLog = document.querySelector('#time-log tbody');
-    window.addEventListener('message', (e) => {
-      const { name, id, progress, round } = e.data;
-      if (name === 'infer_worker') {
-        this.accumulate(e.data);
-      } else if (name === 'infer_progress') {
-        this.updateWorkerStatus(progress, id, round);
-      }
-    });
-
-    this.requireCount = Number(this.queryObj.count);
-    this.iframeCount = Math.min(this.requireCount, this.iframeCount);
-    this.workersDiv.innerHTML = `<div>使用${this.iframeCount}个工人执行任务</div>`;
-    this.iframes = [];
-    for (let i = 0; i < this.iframeCount; i++) {
-      const iframe = document.createElement('iframe');
-      let src = `../infer-worker.html?sid=${this.queryObj.sid}&infer_id=${i}`;
-      const {
-        fake_port,
-        real_port,
-        dev,
-        time_range,
-        status,
-        collector_id,
-      } = this.queryObj;
-      if (fake_port) {
-        src += `&fake_port=${fake_port}`;
-      }
-      if (real_port) {
-        src += `&real_port=${real_port}`;
-      }
-      if (dev) {
-        src += `&dev=${dev}`;
-      }
-      if (time_range) {
-        src += `&infer_time_range=${time_range}`;
-      }
-      if (status) {
-        src += `&infer_status=${status}`;
-      }
-      if (collector_id) {
-        src += `&infer_collector_id=${collector_id}`;
-      }
-      iframe.src = src;
-      iframe.style.display = 'none';
-      this.iframes.push(iframe);
-      document.body.appendChild(iframe);
-
-      const html = `<span>工人${i + 1}:</span>
-          <span class='worker_status'>准备中...</span>
-          <span class='worker_progress'></span>`;
-      const div = document.createElement('div');
-      div.setAttribute('id', 'infer_id_' + i);
-      div.innerHTML = html;
-      this.workersDiv.appendChild(div);
-    }
-  },
-
-  /**
-   * 是否允许立刻发起后续的任务
-   * 如果可以发起则会立即发送下一个任务,不会等待当前任务的完整与否,
-   * 这样可以更多并发请求,速度更快
-   * 单页要注意不能导致成功总数超标
-   */
-  enableImmediateNextTask() {
-    // 如果当前已经发起并在等待中的任务数小于剩余要求的任务数时才发起
-    // 否则先不要发起,如果已发出的人有失败的场合则会继续发起.
-    // 如果不这样则可能发送过得的请求导致最终的成功总数大于期望数量
-    const result = this.postingCount < this.requireCount - this.successCount;
-    // console.log(postingCount, requireCount - successCount, result);
-    return result;
-  },
-
-  /**
-   * 接受子任务的数据并防止到数据池中,同时尝试开启/唤醒消耗数据的任务
-   * @param {*} data
-   */
-  accumulate(data) {
-    this.accumulated.push(data);
-    // console.log('receive and accumulate', data.type, accumulated.length)
-    if (!this.consumingStarted) {
-      // console.log('start/resume consume')
-      this.consumingStarted = true;
-      this.consume();
-    }
-  },
-
-  /**
-   * 消耗任务
-   */
-  consume() {
-    if (this.ended) {
-      return;
-    }
-    if (!this.enableImmediateNextTask()) {
-      this.consumingStarted = false;
-      return;
-    }
-    const data = this.accumulated.shift();
-    if (data) {
-      this.tryCount++;
-      const { type, message } = data;
-
-      if (type === 'END') {
-        if (this.queryObj.dry) {
-          this.successCount++;
-          this.handleProgress('success');
-          const count = data.data.result.answers.length;
-          const time = data.data.result.cost_time;
-          const avg = Math.round(time / count);
-          console.log(time, count, avg); // eslint-disable-line
-          const row = document.createElement('tr');
-          row.innerHTML = `<td>${this.successCount}</td>
-            <td>${time}</td><td>${count}</td><td>${avg}</td>`;
-          this.timeLog.appendChild(row);
-          // console.log('dry run');
-        } else {
-          // console.log('start to post data');
-          this.postData(data.data)
-            .then(() => {
-              // console.log('post data success');
-              this.successCount++;
-              this.handleProgress('success');
-            })
-            .catch((err) => {
-              // console.error('post data error');
-              if (err === 'rejected') {
-                this.rejectCount++;
-                this.handleProgress('reject');
-              } else {
-                this.errorCount++;
-                this.handleProgress('error', message);
-              }
-            });
-          // console.log('immediately start next concurrent consume')
-          this.consume();
-        }
-      } else {
-        if (type === 'ERROR' || type === 'NEXT_FAIL' || type === 'TIMEOUT' || type === 'ABANDON') {
-          this.errorCount++;
-          this.handleProgress('error', message);
-        } else if (type === 'CHECK_END') {
-          this.skipCount++;
-          this.handleProgress('skip', message);
-        }
-      }
-    } else {
-      // console.log('consume out all, pause');
-      this.consumingStarted = false;
-    }
-  },
-
-  /**
-   * 发起请求
-   */
-  postData(data) {
-    this.postingCount++;
-    return new Promise((resolve, reject) => {
-      const req = new XMLHttpRequest();
-      req.onload = () => {
-        this.postingCount--;
-        if (req.status >= 200 && req.status < 300) {
-          resolve();
-        } else {
-          reject();
-        }
-      };
-      req.onerror = () => {
-        this.postingCount--;
-        reject();
-      };
-      req.open('POST', data.url);
-      req.setRequestHeader('content-type', 'application/json');
-      req.setRequestHeader('Authorization', 'bearer ' + data.jwt);
-      req.send(JSON.stringify(data.result));
-      return req;
-    });
-  },
-
-  /**
-   * URL参数转换
-   */
-  queryToObj() {
-    const query = location.href.split('?')[1];
-    const parts = query.split('&');
-    const obj = {};
-    parts.forEach((part) => {
-      const pair = part.split('=');
-      obj[pair[0]] = pair[1];
-    });
-    return obj;
-  },
-
-  /**
-   * 是否应该终止任务
-   */
-  shouldEnd() {
-    if (this.successCount >= this.requireCount || this.rejectCount) {
-      // console.log('should abandon', successCount, tryCount)
-      return true;
-    }
-    const { max_error_count, max_try_count, max_skip_count } = this.queryObj;
-    if (max_try_count && this.tryCount >= max_try_count) {
-      return true;
-    }
-    if (max_error_count && this.errorCount >= max_error_count) {
-      return true;
-    }
-    if (max_skip_count && this.skipCount >= max_skip_count) {
-      return true;
-    }
-    return false;
-  },
-
-  /**
-   * 更新工人状态
-   * @param {*} progress
-   * @param {*} id
-   * @param {*} round
-   */
-  updateWorkerStatus(progress, id, round) {
-    if (this.ended) {
-      return;
-    }
-    if (window.parent === window) {
-      const { percent, fullLength, index } = progress;
-      const elem = this.workersDiv.querySelector('#infer_id_' + id);
-      elem.querySelector('.worker_status').textContent = `轮次: ${round} `;
-      elem.querySelector(
-        '.worker_progress'
-      ).textContent = `进度: ${index}/${fullLength} ${percent}%`;
-    }
-  },
-
-  /**
-   * 处理进度
-   * @param {*} type
-   * @param {*} message
-   */
-  handleProgress(type, message) {
-    // console.log('consumed ', tryCount, successCount);
-    if (this.shouldEnd()) {
-      // console.log('complete and abandon', accumulated.length)
-      this.ended = true;
-      let pop = this.iframes.pop();
-      while (pop) {
-        document.body.removeChild(pop);
-        pop = this.iframes.pop();
-      }
-      const statusList = this.workersDiv.querySelectorAll('.worker_status');
-      const progressList = this.workersDiv.querySelectorAll('.worker_progress');
-      statusList.forEach((item) => (item.innerHTML = '收工'));
-      progressList.forEach((item) => (item.innerHTML = ''));
-    }
-    if (window.parent !== window) {
-      window.parent.postMessage(
-        {
-          name: 'infer_result',
-          requireCount: this.requireCount,
-          successCount: this.successCount,
-          skipCount: this.skipCount,
-          errorCount: this.errorCount,
-          tryCount: this.tryCount,
-          rejectCount: this.rejectCount,
-          ended: this.ended,
-          cost: this.ended ? Date.now() - this.startTime : undefined,
-          type,
-          message,
-        },
-        '*'
-      );
-    } else {
-      const text = [
-        this.ended
-          ? `<div>已结束,耗时: ${(Date.now() - this.startTime) / 1000}s</div>`
-          : `<div>运行中...</div>`,
-        `<div>要求总数量:${this.requireCount}</div>`,
-        `<div>已尝试次数:${this.tryCount}</div>`,
-        `<div style='color: green'>已成功次数:${this.successCount}</div>`,
-        `<div style='color: red'>出错误次数:${this.errorCount}</div>`,
-        `<div style='color: orange'>被甄别次数:${this.skipCount}</div>`,
-        `<div style='color: tomato'>被拒绝次数:${this.rejectCount}</div>`,
-      ].join('\n');
-      this.progressDiv.innerHTML = text;
-      if (message) {
-        const error = `<div style='color: ${this.typeColorMap[type]}'>${message}</div>`;
-        this.errorDiv.innerHTML += error;
-      }
-    }
-
-    if (!this.ended) {
-      // console.log('next consume start');
-      this.consume();
-    }
-  },
-};
-
-inferCommander.start();
+const inferCommander = {
+  /**
+   * 接受子任务发来的数据结果池
+   * 可能一下子接到很多工人发来的结果，来不及上传
+   * 先积累到这里
+   */
+  accumulated: [],
+
+  /**
+   * 是否开始了消耗数据结果池
+   */
+  consumingStarted: false,
+
+  /**
+   * 是否已经完成
+   */
+  ended: false,
+
+  /**
+   * 当前已发起并等待结果的请求数量
+   */
+  postingCount: 0,
+
+  /**
+   * 查询参数
+   * @type {{
+   *   max_try_count:string;
+   *   max_error_count:string;
+   *   thread: string;
+   *   dry: string;
+   *   max_skip_count: string;
+   *   sid: string;
+   *   fake_port: string;
+   *   real_port: string;
+   *   dev: string;
+   *   time_range: string;
+   *   status: string;
+   *   collector_id: string;
+   * }}
+   */
+  queryObj: null,
+
+  /**
+   * 派遣的工人个数
+   * @type {number}
+   */
+  iframeCount: 0,
+  /**
+   * 开始时间
+   * @type {number}
+   */
+  startTime: 0,
+  /**
+   * 消息展示div
+   * @type {HTMLElement}
+   */
+  messageDiv: null,
+  /**
+   * 错误展示div
+   * @type {HTMLElement}
+   */
+  errorDiv: null,
+  /**
+   * 工人状态展示div
+   * @type {HTMLElement}
+   */
+  workersDiv: null,
+  /**
+   *  消息颜色表
+   */
+  typeColorMap: {
+    error: 'red',
+    skip: 'orange',
+  },
+  /**
+   * 已成功次数
+   */
+  successCount: 0,
+  /**
+   * 已跳过次数
+   */
+  skipCount: 0,
+  /**
+   * 已错误次数
+   */
+  errorCount: 0,
+  /**
+   * 已尝试次数
+   */
+  tryCount: 0,
+  /**
+   * 已被拒绝次数
+   */
+  rejectCount: 0,
+
+  /**
+   * 要求的数量
+   */
+  requireCount: 0,
+
+  /**
+   * 时间日志
+   * @type {HTMLElement}
+   */
+  timeLog: null,
+
+  /**
+   * 开始运行
+   */
+  start() {
+    this.queryObj = this.queryToObj();
+    this.iframeCount = this.queryObj.thread || 10;
+    this.startTime = Date.now();
+    this.progressDiv = document.getElementById('message');
+    this.errorDiv = document.getElementById('error');
+    this.workersDiv = document.getElementById('workers');
+    this.timeLog = document.querySelector('#time-log tbody');
+    window.addEventListener('message', (e) => {
+      const { name, id, progress, round } = e.data;
+      if (name === 'infer_worker') {
+        this.accumulate(e.data);
+      } else if (name === 'infer_progress') {
+        this.updateWorkerStatus(progress, id, round);
+      }
+    });
+
+    this.requireCount = Number(this.queryObj.count);
+    this.iframeCount = Math.min(this.requireCount, this.iframeCount);
+    this.workersDiv.innerHTML = `<div>使用${this.iframeCount}个工人执行任务</div>`;
+    this.iframes = [];
+    for (let i = 0; i < this.iframeCount; i++) {
+      const iframe = document.createElement('iframe');
+      let src = `../infer-worker.html?sid=${this.queryObj.sid}&infer_id=${i}`;
+      const {
+        fake_port,
+        real_port,
+        dev,
+        time_range,
+        status,
+        collector_id,
+      } = this.queryObj;
+      if (fake_port) {
+        src += `&fake_port=${fake_port}`;
+      }
+      if (real_port) {
+        src += `&real_port=${real_port}`;
+      }
+      if (dev) {
+        src += `&dev=${dev}`;
+      }
+      if (time_range) {
+        src += `&infer_time_range=${time_range}`;
+      }
+      if (status) {
+        src += `&infer_status=${status}`;
+      }
+      if (collector_id) {
+        src += `&infer_collector_id=${collector_id}`;
+      }
+      iframe.src = src;
+      iframe.style.display = 'none';
+      this.iframes.push(iframe);
+      document.body.appendChild(iframe);
+
+      const html = `<span>工人${i + 1}:</span>
+          <span class='worker_status'>准备中...</span>
+          <span class='worker_progress'></span>`;
+      const div = document.createElement('div');
+      div.setAttribute('id', 'infer_id_' + i);
+      div.innerHTML = html;
+      this.workersDiv.appendChild(div);
+    }
+  },
+
+  /**
+   * 是否允许立刻发起后续的任务
+   * 如果可以发起则会立即发送下一个任务,不会等待当前任务的完整与否,
+   * 这样可以更多并发请求,速度更快
+   * 单页要注意不能导致成功总数超标
+   */
+  enableImmediateNextTask() {
+    // 如果当前已经发起并在等待中的任务数小于剩余要求的任务数时才发起
+    // 否则先不要发起,如果已发出的人有失败的场合则会继续发起.
+    // 如果不这样则可能发送过得的请求导致最终的成功总数大于期望数量
+    const result = this.postingCount < this.requireCount - this.successCount;
+    // console.log(postingCount, requireCount - successCount, result);
+    return result;
+  },
+
+  /**
+   * 接受子任务的数据并防止到数据池中,同时尝试开启/唤醒消耗数据的任务
+   * @param {*} data
+   */
+  accumulate(data) {
+    this.accumulated.push(data);
+    // console.log('receive and accumulate', data.type, accumulated.length)
+    if (!this.consumingStarted) {
+      // console.log('start/resume consume')
+      this.consumingStarted = true;
+      this.consume();
+    }
+  },
+
+  /**
+   * 消耗任务
+   */
+  consume() {
+    if (this.ended) {
+      return;
+    }
+    if (!this.enableImmediateNextTask()) {
+      this.consumingStarted = false;
+      return;
+    }
+    const data = this.accumulated.shift();
+    if (data) {
+      this.tryCount++;
+      const { type, message } = data;
+
+      if (type === 'END') {
+        if (this.queryObj.dry) {
+          this.successCount++;
+          this.handleProgress('success');
+          const count = data.data.result.answers.length;
+          const time = data.data.result.time_consuming;
+          const avg = Math.round(time / count);
+          console.log(time, count, avg); // eslint-disable-line
+          const row = document.createElement('tr');
+          row.innerHTML = `<td>${this.successCount}</td>
+            <td>${time}</td><td>${count}</td><td>${avg}</td>`;
+          this.timeLog.appendChild(row);
+          // console.log('dry run');
+        } else {
+          // console.log('start to post data');
+          this.postData(data.data)
+            .then(() => {
+              // console.log('post data success');
+              this.successCount++;
+              this.handleProgress('success');
+            })
+            .catch((err) => {
+              // console.error('post data error');
+              if (err === 'rejected') {
+                this.rejectCount++;
+                this.handleProgress('reject');
+              } else {
+                this.errorCount++;
+                this.handleProgress('error', message);
+              }
+            });
+          // console.log('immediately start next concurrent consume')
+          this.consume();
+        }
+      } else {
+        if (type === 'ERROR' || type === 'NEXT_FAIL' || type === 'TIMEOUT' || type === 'ABANDON') {
+          this.errorCount++;
+          this.handleProgress('error', message);
+        } else if (type === 'CHECK_END') {
+          this.skipCount++;
+          this.handleProgress('skip', message);
+        }
+      }
+    } else {
+      // console.log('consume out all, pause');
+      this.consumingStarted = false;
+    }
+  },
+
+  /**
+   * 发起请求
+   */
+  postData(data) {
+    this.postingCount++;
+    return new Promise((resolve, reject) => {
+      const req = new XMLHttpRequest();
+      req.onload = () => {
+        this.postingCount--;
+        if (req.status >= 200 && req.status < 300) {
+          resolve();
+        } else {
+          reject();
+        }
+      };
+      req.onerror = () => {
+        this.postingCount--;
+        reject();
+      };
+      req.open('POST', data.url);
+      req.setRequestHeader('content-type', 'application/json');
+      req.setRequestHeader('Authorization', 'bearer ' + data.jwt);
+      req.send(JSON.stringify(data.result));
+      return req;
+    });
+  },
+
+  /**
+   * URL参数转换
+   */
+  queryToObj() {
+    const query = location.href.split('?')[1];
+    const parts = query.split('&');
+    const obj = {};
+    parts.forEach((part) => {
+      const pair = part.split('=');
+      obj[pair[0]] = pair[1];
+    });
+    return obj;
+  },
+
+  /**
+   * 是否应该终止任务
+   */
+  shouldEnd() {
+    if (this.successCount >= this.requireCount || this.rejectCount) {
+      // console.log('should abandon', successCount, tryCount)
+      return true;
+    }
+    const { max_error_count, max_try_count, max_skip_count } = this.queryObj;
+    if (max_try_count && this.tryCount >= max_try_count) {
+      return true;
+    }
+    if (max_error_count && this.errorCount >= max_error_count) {
+      return true;
+    }
+    if (max_skip_count && this.skipCount >= max_skip_count) {
+      return true;
+    }
+    return false;
+  },
+
+  /**
+   * 更新工人状态
+   * @param {*} progress
+   * @param {*} id
+   * @param {*} round
+   */
+  updateWorkerStatus(progress, id, round) {
+    if (this.ended) {
+      return;
+    }
+    if (window.parent === window) {
+      const { percent, fullLength, index } = progress;
+      const elem = this.workersDiv.querySelector('#infer_id_' + id);
+      elem.querySelector('.worker_status').textContent = `轮次: ${round} `;
+      elem.querySelector(
+        '.worker_progress'
+      ).textContent = `进度: ${index}/${fullLength} ${percent}%`;
+    }
+  },
+
+  /**
+   * 处理进度
+   * @param {*} type
+   * @param {*} message
+   */
+  handleProgress(type, message) {
+    // console.log('consumed ', tryCount, successCount);
+    if (this.shouldEnd()) {
+      // console.log('complete and abandon', accumulated.length)
+      this.ended = true;
+      let pop = this.iframes.pop();
+      while (pop) {
+        document.body.removeChild(pop);
+        pop = this.iframes.pop();
+      }
+      const statusList = this.workersDiv.querySelectorAll('.worker_status');
+      const progressList = this.workersDiv.querySelectorAll('.worker_progress');
+      statusList.forEach((item) => (item.innerHTML = '收工'));
+      progressList.forEach((item) => (item.innerHTML = ''));
+    }
+    if (window.parent !== window) {
+      window.parent.postMessage(
+        {
+          name: 'infer_result',
+          requireCount: this.requireCount,
+          successCount: this.successCount,
+          skipCount: this.skipCount,
+          errorCount: this.errorCount,
+          tryCount: this.tryCount,
+          rejectCount: this.rejectCount,
+          ended: this.ended,
+          cost: this.ended ? Date.now() - this.startTime : undefined,
+          type,
+          message,
+        },
+        '*'
+      );
+    } else {
+      const text = [
+        this.ended
+          ? `<div>已结束,耗时: ${(Date.now() - this.startTime) / 1000}s</div>`
+          : `<div>运行中...</div>`,
+        `<div>要求总数量:${this.requireCount}</div>`,
+        `<div>已尝试次数:${this.tryCount}</div>`,
+        `<div style='color: green'>已成功次数:${this.successCount}</div>`,
+        `<div style='color: red'>出错误次数:${this.errorCount}</div>`,
+        `<div style='color: orange'>被甄别次数:${this.skipCount}</div>`,
+        `<div style='color: tomato'>被拒绝次数:${this.rejectCount}</div>`,
+      ].join('\n');
+      this.progressDiv.innerHTML = text;
+      if (message) {
+        const error = `<div style='color: ${this.typeColorMap[type]}'>${message}</div>`;
+        this.errorDiv.innerHTML += error;
+      }
+    }
+
+    if (!this.ended) {
+      // console.log('next consume start');
+      this.consume();
+    }
+  },
+};
+
+inferCommander.start();