JS埋点式数据采集

　　在Windows环境下，用apache服务器做一个简单的js埋点式数据采集，用logstash工具接受并记录数据，notepad3工具编辑文件

步骤图：

bzt
文章所需工具： JS埋点式数据采集文件、 Notepad3 （方便查看代码）

准备工作：新建一个文件夹为：Server-JS 把下载好的三个压缩文件解压到里面

一、修改js-sdk文件

1.1 打开 js-sdk/webapp 里的 index.html 找到function下的 ma.src = "http://localhost:8099/js/ma.js" 修改端口号为 8079
1+x_js_1.1
1.2 修改之后我们回到当前目录的 js 目录下，修改 ma.js 文件内最后边var src = 'http://localhost:5043/的端口号为： 5043 1+x_js_1.2

二、修改Apache配置文件

打开 Apache24/conf 里的 httpd.conf 文件（此代码内容过多，建议用Ctrl+F查找功能）
2.1 查找 Define SRVROOT 把后面引号里的内容修改为你Apache文件夹路径
2.1
2.2 查找 Listen 把后面引号里的端口80修改为8079
2.2
2.3 查找 DocumentRoot、Directory 把后面引号里的内容修改为你 webapp 文件夹路径
2.3
2.4 启动 apache 服务器：进入 Apache24/bin 目录，在地址栏输入cmd回车，弹出cmd窗口后输入 httpd.exe 回车即可启动
2.4
ps：怎么查看文件夹的路径？
2.x

三、修改logstash配置文件

3.1 回到 Server-JS 目录新建 output 文件夹（接收采集数据）
3.2 进入 logstash-6.8.7/config 目录内，复制一份 logstash-sample.conf 命名为 logstash-httpJS-csv.conf 用 notepad3 打开修改文件，并将 path 引号内路径修改为你 output 路径

input {
  http {
    port => 5043
    response_headers => {
      "Access-Control-Allow-Origin" => "*"
      "Content-Type" => "text/plain"
      "Access-Control-Allow-Headers" => "Origin, X-Requested-With, Content-Type, Accept"
    }
  }
}

filter {
    urldecode{
        field => headers
    }
    grok {
      match => [
          # /?args=domain=127.0.0.1&title=js-sdk&referrer=&sh=768&sw=1366&cd=24&lang=zh-CN&account=web-uuid
          "[headers][request_path]", "/\?args=domain=(?<domain>[^&]*)&title=(?<title>[^&]*).*"
     ]
  }
}

output {      
      csv {
            path => "E:\Server\elk\output\js-sdk-file.csv"
            fields => ["domain" ,"title"]
            csv_options => {"col_sep" => "    "}
        }
    stdout{
        codec => rubydebug
    }
}

3.1
3.3 启动 logstash：在 logstash-6.8.7/bin 目录地址栏输入cmd，弹出cmd窗口后输入 logstash -f 然后回到 logstash-6.8.7/config 目录内将 logstash-httpJS-csv.conf 拖入cmd窗口
3.2