【前端超时设置】nginx超时设置 前端fetch和axios超时设置 yaml配置容器平台路由超时时间（后端也要配置）

一、前端超时配置

（1）axios

import axios from 'axios';

axios.timeout = 10000; // 毫秒

（2）fetch利用promise.race及resolve和reject

// 公共超时封装方法POST
const POST = (url, params) => {
  // const URLS = baseURL + url;
  return Promise.race([
    fetch(url, {
      method: 'POST',
      body: params,
      headers: {
        // Accept: 'application/json',
        'Content-Type': 'application/json',
        // 'Content-Type': 'application/x-www-form-urlencoded',
        // token: JSON.parse(sessionStorage.getItem("token"))
      },
      mode: 'cors', // 以CORS的形式跨域
      // cache: 'force-cache',
    }),
    new Promise((resovle, reject) => {
      setTimeout(() => {
        reject(new Error('请求超时'));
      }, 10000);
    }),
  ])
    .then((res) => {
      console.log('post res===>', res);
      // 请求成功
      return res.json();
      // if (res.code != 0) {
      //   return { code: res.code, msg: res.message };
      // } else {
      //   return res;
      // }
    })
    .catch((err) => {
      // 请求超时
      console.log(err);
    });
};

// 公共超时封装方法
const GET = (url) => {
  // const URLS = baseURL + url;
  return Promise.race([
    fetch(url, {
      method: 'get',
      // body: params,
      headers: {
        // Accept: 'application/json',
        'Content-Type': 'application/json',
        // 'Content-Type': 'application/x-www-form-urlencoded',
        // token: JSON.parse(sessionStorage.getItem("token"))
      },
      mode: 'cors', // 以CORS的形式跨域
      // cache: 'force-cache',
    }),
    new Promise((resovle, reject) => {
      setTimeout(() => {
        reject(new Error('请求超时'));
      }, 10000);
    }),
  ])
    .then((res) => {
      console.log('get res===>', res);
      // 请求成功
      return res.json();
      // if (res.code != 0) {
      //   return { code: res.code, msg: res.message };
      // } else {
      //   return res;
      // }
    })
    .catch((err) => {
      // 请求超时
      console.log(err);
    });
};

二、nginx超时设置

（1）主要的几个配置：

      proxy_connect_timeout 900;
      proxy_read_timeout 900;
      proxy_send_timeout 900;

（2）这些是其他的配置：

      keepalive_timeout 20;
      client_header_timeout 20;
      client_body_timeout 20;
      reset_timedout_connection on;
      send_timeout 20;

（3）完整nginx配置：

nginx.conf: |-
    worker_processes auto;
    daemon off;

    error_log stderr;
    events { worker_connections 2048; }

    http {
      access_log off;
      default_type application/octet-stream;
      include mime.types;
      sendfile on;
      keepalive_timeout 20;
      client_header_timeout 20;
      client_body_timeout 20;
      reset_timedout_connection on;
      send_timeout 20;
      proxy_connect_timeout 900;
      proxy_read_timeout 900;
      proxy_send_timeout 900;
      gzip on;
      tcp_nopush on;
      port_in_redirect off; # Ensure that redirects don't include the internal container PORT
      server_tokens off;

      server {
        listen 8080;
        server_name localhost;
        gzip on;
        gzip_static on;
        gzip_min_length 1k;
        gzip_buffers 4 32k;
        gzip_http_version 1.1;
        gzip_comp_level 2;
        gzip_types text/plain application/x-javascript text/css application/xml;
        gzip_vary on;
        gzip_disable "MSIE [1-6].";
        location / {
          root /opt/public;
          try_files $uri $uri/ /index.html;
          index protal.html index.html index.htm Default.htm;
          error_page 405 =200 $request_uri;
        }
        location /visualize/ {
          add_header Cache-Control no-cache;
          add_header Cache-Control private;
          expires -1s;
          proxy_pass http://xxxxxxx.cn;
        }
        location /common/ {
          add_header Cache-Control no-cache;
          add_header Cache-Control private;
          expires -1s;
          proxy_pass http://xxxxxxx.cn;
        }
      }
      #上传文件的大小限制  默认1m
      client_max_body_size 50m;
    }

---

三、yaml构建文件中，容器路由的访问超时时间配置：

（1）主要代码：

  annotations:
    haproxy.router.openshift.io/timeout: 900s

（2）完整代码：

kind: Route                         # Route 类型资源，指定一个外部路由
apiVersion: route.openshift.io/v1
metadata:
  name: asset-xxxx
  labels:
    app: asset-xxxx
  namespace: x-02-st-xxx-asset
  annotations:
    haproxy.router.openshift.io/timeout: 900s
spec:
  to:
    kind: Service
    name: asset-xxxx
  host: xxxxx.xxx.cn    # 分行用户请使用 *.bcs.cmbchina.cn 作为外部路由
  port:
    targetPort: 8080-8080          # targetPort为 service 定义的端口，可以用端口也可以用名字