软件技术学习笔记

使用Nginx搭建前端静态资源服务时，有时想在服务端收集一些前端的严重错误。如果不想搭建或引用其它服务来处理上报的错误日志，可以将简要的错误信息放到HTTP Header中，然后使用Nginx的 $http_xxx 变量打印到 access_log 中。在没有新增其它Nginx模块时，Nginx是无法直接访问HTTP Body中的内容，但是Header中内容可以直接访问。

Nginx配置：

log_format  reportError escape=none  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for" '
                      '"$http_fe_href" "$http_fe_error"';

server {
    location = /api/reportError {
        # Methods Limit
        limit_except POST {
          deny all;
        }

        expires epoch;

        ### Log the error
        access_log  /var/log/nginx/access.log  reportError;
        return 200;
    }
}

前端上报错误JS：

function reportError(msg) {
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/api/reportError');
    xhr.setRequestHeader('fe-href', location.href);
    xhr.setRequestHeader('fe-error', msg);
    xhr.send();
}