two step item fetch
This commit is contained in:
parent
e7cc764fcd
commit
77821a1247
20
args.go
20
args.go
|
@ -6,12 +6,24 @@ import (
|
|||
"strconv"
|
||||
)
|
||||
|
||||
func parseFlags() (*url.URL, string, string, int) {
|
||||
target := flag.String("url", "https://jsonplaceholder.typicode.com", "Required. Set the base url you want to capture")
|
||||
type Args struct {
|
||||
url *url.URL
|
||||
port string
|
||||
dashboard string
|
||||
maxCaptures int
|
||||
}
|
||||
|
||||
var args Args
|
||||
|
||||
func parseArgs() {
|
||||
proxyURL := flag.String("url", "https://jsonplaceholder.typicode.com", "Required. Set the base url you want to capture")
|
||||
proxyPort := flag.Int("port", 9000, "Set the proxy port")
|
||||
dashboard := flag.String("dashboard", "dashboard", "Set the dashboard name")
|
||||
maxCaptures := flag.Int("max-captures", 16, "Set the max number of captures to show in the dashboard")
|
||||
flag.Parse()
|
||||
targetURL, _ := url.Parse(*target)
|
||||
return targetURL, strconv.Itoa(*proxyPort), *dashboard, *maxCaptures
|
||||
args = Args{}
|
||||
args.url, _ = url.Parse(*proxyURL)
|
||||
args.port = strconv.Itoa(*proxyPort)
|
||||
args.dashboard = *dashboard
|
||||
args.maxCaptures = *maxCaptures
|
||||
}
|
||||
|
|
38
capture.go
38
capture.go
|
@ -1,21 +1,43 @@
|
|||
package main
|
||||
|
||||
import "strconv"
|
||||
|
||||
type Capture struct {
|
||||
Url string `json:"url"`
|
||||
Path string `json:"path"`
|
||||
Method string `json:"method"`
|
||||
Status int `json:"status"`
|
||||
Request string `json:"request"`
|
||||
Response string `json:"response"`
|
||||
}
|
||||
|
||||
type Captures struct {
|
||||
items []Capture
|
||||
max int
|
||||
type CaptureRef struct {
|
||||
ID int `json:"id"`
|
||||
Path string `json:"path"`
|
||||
Method string `json:"method"`
|
||||
Status int `json:"status"`
|
||||
ItemUrl string `json:"itemUrl"`
|
||||
}
|
||||
|
||||
func (c *Captures) Add(capture Capture) {
|
||||
c.items = append([]Capture{capture}, c.items...)
|
||||
if len(c.items) > c.max {
|
||||
c.items = c.items[:len(c.items)-1]
|
||||
type Captures []Capture
|
||||
|
||||
func (items *Captures) Add(capture Capture) {
|
||||
*items = append(*items, capture)
|
||||
size := len(*items)
|
||||
if size > args.maxCaptures {
|
||||
*items = (*items)[1:]
|
||||
}
|
||||
}
|
||||
|
||||
func (items *Captures) GetRefs(itemBaseUrl string) []CaptureRef {
|
||||
refs := make([]CaptureRef, len(*items))
|
||||
for i, item := range *items {
|
||||
refs[i] = CaptureRef{
|
||||
ID: i,
|
||||
Path: item.Path,
|
||||
Method: item.Method,
|
||||
Status: item.Status,
|
||||
ItemUrl: itemBaseUrl + strconv.Itoa(i),
|
||||
}
|
||||
}
|
||||
return refs
|
||||
}
|
||||
|
|
94
dashboard.go
94
dashboard.go
|
@ -21,6 +21,28 @@ const dashboardHTML = `
|
|||
<title>Dashboard</title>
|
||||
<style>
|
||||
|
||||
:root {
|
||||
--b00: #fafafa;
|
||||
--b01: #f0f0f1;
|
||||
--b02: #e5e5e6;
|
||||
--b03: #a0a1a7;
|
||||
--b04: #696c77;
|
||||
--b05: #383a42;
|
||||
--b06: #202227;
|
||||
--b07: #090a0b;
|
||||
--b08: #ca1243;
|
||||
--b09: #d75f00;
|
||||
--b0A: #c18401;
|
||||
--b0B: #50a14f;
|
||||
--b0C: #0184bc;
|
||||
--b0D: #4078f2;
|
||||
--b0E: #a626a4;
|
||||
--b0F: #986801;
|
||||
|
||||
--e0C: #82aaff;
|
||||
--e0E: #c792ea;
|
||||
}
|
||||
|
||||
* { padding: 0; margin: 0; box-sizing: border-box }
|
||||
|
||||
html, body, .dashboard {
|
||||
|
@ -30,7 +52,7 @@ const dashboardHTML = `
|
|||
|
||||
div { display: flex; position: relative }
|
||||
|
||||
.dashboard { background: #eceff1 }
|
||||
.dashboard { background: var(--b06) }
|
||||
|
||||
.list, .req, .res {
|
||||
flex: 0 0 37%;
|
||||
|
@ -44,7 +66,7 @@ const dashboardHTML = `
|
|||
flex: 1;
|
||||
}
|
||||
.req-inner, .res-inner {
|
||||
background: #fefefe;
|
||||
background: var(--b05);
|
||||
padding: 1rem;
|
||||
}
|
||||
.req-inner { margin: 1rem 0 }
|
||||
|
@ -54,40 +76,48 @@ const dashboardHTML = `
|
|||
.list-item {
|
||||
flex-shrink: 0;
|
||||
padding: 1rem;
|
||||
color: #767676;
|
||||
background: #fefefe;
|
||||
color: var(--e0C);
|
||||
background: var(--b07);
|
||||
cursor: pointer;
|
||||
margin-bottom: 0.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
.list-item:hover { background: #eceff1 }
|
||||
.list-item:hover { background: var(--b07) }
|
||||
.list-item, .req-inner, .res-inner {
|
||||
box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.25);
|
||||
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.selected { background: #ff4081 !important; color: #fff }
|
||||
.list-item.selected .method,
|
||||
.list-item.selected .status { color: #fff }
|
||||
.list-item.selected { outline: 1px solid var(--b0D); outline-offset: -1px }
|
||||
|
||||
.ok,
|
||||
.GET { color: #88d43f }
|
||||
.POST { color: #ef9c26 }
|
||||
.GET { color: var(--b0B) }
|
||||
.POST { color: var(--b09) }
|
||||
.warn,
|
||||
.PUT { color: #4c87dd }
|
||||
.PATCH { color: #767676 }
|
||||
.PUT { color: var(--b0A) }
|
||||
.PATCH { color: var(--b04) }
|
||||
.error,
|
||||
.DELETE { color: #e53f42 }
|
||||
.DELETE { color: var(--b08) }
|
||||
|
||||
.method { font-size: 0.7em; margin-right: 1rem; padding: .25rem .5rem }
|
||||
.status { font-size: 0.8em; padding-left: 1rem }
|
||||
.url { font-size: 0.8em; flex: 1; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: rtl }
|
||||
.path { font-size: 0.8em; flex: 1; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: rtl }
|
||||
|
||||
.req-inner, .res-inner { flex-direction: column }
|
||||
|
||||
.url-big { flex-shrink: 0; line-height: 1.5em; word-break: break-all; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #eee }
|
||||
.url-big:empty { border: 0 }
|
||||
|
||||
pre { flex: 1; color: #555; word-break: normal; word-wrap: break-word; white-space: pre-wrap; }
|
||||
|
||||
pre { flex: 1; color: var(--b03); word-break: normal; word-wrap: break-word; white-space: pre-wrap; z-index: 1 }
|
||||
.req-inner:before, .res-inner:before {
|
||||
bottom: 1rem;
|
||||
font-size: 4em;
|
||||
color: var(--b06);
|
||||
position: fixed;
|
||||
font-weight: bolder;
|
||||
font-family: impact;
|
||||
}
|
||||
.req-inner:before {
|
||||
content: "REQUEST";
|
||||
}
|
||||
.res-inner:before {
|
||||
content: "RESPONSE";
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
@ -96,10 +126,10 @@ const dashboardHTML = `
|
|||
|
||||
<div class="list">
|
||||
<div class="list-inner">
|
||||
<div class="list-item" ng-repeat="item in items" ng-click="show(item)"
|
||||
ng-class="{selected: selected == item}">
|
||||
<div class="list-item" ng-repeat="item in items | orderBy: '-id' track by item.id" ng-click="show(item)"
|
||||
ng-class="{selected: isItemSelected(item)}">
|
||||
<span class="method" ng-class="item.method">{{item.method}}</span>
|
||||
<span class="url">‎{{item.url}}‎</span>
|
||||
<span class="path">‎{{item.path}}‎</span>
|
||||
<span class="status" ng-class="statusColor(item)">{{item.status}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -107,7 +137,6 @@ const dashboardHTML = `
|
|||
|
||||
<div class="req">
|
||||
<div class="req-inner">
|
||||
<div class="url-big">{{url}}</div>
|
||||
<pre>{{request}}</pre>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -122,19 +151,26 @@ const dashboardHTML = `
|
|||
|
||||
<script type="text/javascript">
|
||||
angular.module('app', [])
|
||||
.controller('controller', function($scope) {
|
||||
.controller('controller', function($scope, $http) {
|
||||
|
||||
$scope.show = item => {
|
||||
$scope.request = item.request;
|
||||
$scope.response = item.response;
|
||||
$scope.url = item.url;
|
||||
$scope.selected = item;
|
||||
$scope.path = item.path;
|
||||
$scope.selectedId = item.id;
|
||||
$http.get(item.itemUrl).then(r => {
|
||||
$scope.request = r.data.request;
|
||||
$scope.response = r.data.response;
|
||||
});
|
||||
}
|
||||
|
||||
$scope.statusColor = item => {
|
||||
let status = (item.status + '')[0] - 2;
|
||||
return ['ok', 'warn', 'error', 'error'][status] || '';
|
||||
}
|
||||
|
||||
$scope.isItemSelected = item => {
|
||||
return $scope.selectedId == item.id;
|
||||
}
|
||||
|
||||
let socket = io();
|
||||
socket.on('connect', () => {
|
||||
socket.on('captures', captures => {
|
||||
|
|
72
main.go
72
main.go
|
@ -3,6 +3,7 @@ package main
|
|||
import (
|
||||
"bytes"
|
||||
"compress/gzip"
|
||||
"encoding/json"
|
||||
"errors"
|
||||
"fmt"
|
||||
"io"
|
||||
|
@ -10,32 +11,54 @@ import (
|
|||
"log"
|
||||
"net/http"
|
||||
"net/http/httputil"
|
||||
"strconv"
|
||||
"strings"
|
||||
|
||||
"github.com/googollee/go-socket.io"
|
||||
)
|
||||
|
||||
var captures Captures
|
||||
var socket socketio.Socket
|
||||
|
||||
type Transport struct {
|
||||
http.RoundTripper
|
||||
}
|
||||
|
||||
func main() {
|
||||
targetURL, proxyPort, dashboard, maxCaptures := parseFlags()
|
||||
captures.max = maxCaptures
|
||||
var captures Captures
|
||||
|
||||
proxy := httputil.NewSingleHostReverseProxy(targetURL)
|
||||
var socket socketio.Socket
|
||||
|
||||
var host string
|
||||
var dashboardPath string
|
||||
var dashboardItemsPath string
|
||||
|
||||
func main() {
|
||||
parseArgs()
|
||||
|
||||
proxy := httputil.NewSingleHostReverseProxy(args.url)
|
||||
proxy.Transport = Transport{http.DefaultTransport}
|
||||
|
||||
dashboardPath = "/" + args.dashboard + "/"
|
||||
dashboardItemsPath = dashboardPath + "items/"
|
||||
|
||||
http.Handle("/", getProxyHandler(proxy))
|
||||
http.Handle("/socket.io/", getSocketHandler())
|
||||
http.Handle("/"+dashboard+"/", getDashboardHandler())
|
||||
http.Handle(dashboardItemsPath, getCapturesHandler())
|
||||
http.Handle(dashboardPath, getDashboardHandler())
|
||||
|
||||
fmt.Printf("\nListening on http://localhost:%s", proxyPort)
|
||||
fmt.Printf("\n http://localhost:%s/%s\n\n", proxyPort, dashboard)
|
||||
host = "http://localhost:" + args.port
|
||||
|
||||
http.ListenAndServe(":"+proxyPort, nil)
|
||||
fmt.Printf("\nListening on %s", host)
|
||||
fmt.Printf("\n %s/%s\n\n", host, args.dashboard)
|
||||
|
||||
http.ListenAndServe(":"+args.port, nil)
|
||||
}
|
||||
|
||||
func getCapturesHandler() http.Handler {
|
||||
return http.HandlerFunc(func(res http.ResponseWriter, req *http.Request) {
|
||||
id := strings.TrimPrefix(req.URL.Path, dashboardItemsPath)
|
||||
i, _ := strconv.Atoi(id)
|
||||
json, _ := json.Marshal(captures[i])
|
||||
res.Header().Add("Content-Type", "application/json")
|
||||
res.Write([]byte(json))
|
||||
})
|
||||
}
|
||||
|
||||
func getProxyHandler(handler http.Handler) http.Handler {
|
||||
|
@ -61,14 +84,14 @@ func getSocketHandler() http.Handler {
|
|||
}
|
||||
|
||||
func (t Transport) RoundTrip(req *http.Request) (*http.Response, error) {
|
||||
reqDump, err := httputil.DumpRequest(req, true)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
res, err := t.RoundTripper.RoundTrip(req)
|
||||
if err != nil {
|
||||
return nil, errors.New(err.Error() + ": " + req.URL.String())
|
||||
return nil, errors.New("uh oh | " + err.Error() + " | " + req.URL.String())
|
||||
}
|
||||
|
||||
reqDump, err := DumpRequest(req)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
resDump, err := DumpResponse(res)
|
||||
|
@ -76,9 +99,12 @@ func (t Transport) RoundTrip(req *http.Request) (*http.Response, error) {
|
|||
return nil, err
|
||||
}
|
||||
|
||||
capture := Capture{req.URL.Path, req.Method, res.StatusCode,
|
||||
string(reqDump),
|
||||
string(resDump),
|
||||
capture := Capture{
|
||||
Path: req.URL.Path,
|
||||
Method: req.Method,
|
||||
Status: res.StatusCode,
|
||||
Request: string(reqDump),
|
||||
Response: string(resDump),
|
||||
}
|
||||
|
||||
captures.Add(capture)
|
||||
|
@ -87,6 +113,10 @@ func (t Transport) RoundTrip(req *http.Request) (*http.Response, error) {
|
|||
return res, nil
|
||||
}
|
||||
|
||||
func DumpRequest(req *http.Request) ([]byte, error) {
|
||||
return httputil.DumpRequest(req, true)
|
||||
}
|
||||
|
||||
func DumpResponse(res *http.Response) ([]byte, error) {
|
||||
var originalBody bytes.Buffer
|
||||
res.Body = ioutil.NopCloser(io.TeeReader(res.Body, &originalBody))
|
||||
|
@ -102,5 +132,5 @@ func emit() {
|
|||
if socket == nil {
|
||||
return
|
||||
}
|
||||
socket.Emit("captures", captures.items)
|
||||
socket.Emit("captures", captures.GetRefs(host+dashboardItemsPath))
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue