Git Product home page Git Product logo

server-replay's Introduction

server-replay

Replay server responses from a .har file.

Useful if…

  • …you want to develop offline and your development server isn't local
  • …your development server is very slow and you want to go faster
  • …you are developing against an API with rate limits

It works by starting a proxy server and serving content from a previously saved .har file overlayed with files from your local system, configurable with mappings.

Installation

npm install -g frost-server-replay

Running

You need to have a .har file, run server-replay, and then set up your browser to use it as a proxy.

A .server-replay.json in the current directory is used by default if no config option is given.

server-replay [options] <.har file>

Options:
  -c, --config  The config file to use
  -p, --port    The port to run the proxy server on  [default: 8080]
  -d, --debug   Turn on debug logging
  --proxy       The server to proxy not found calls to

See the Setup section for details on creating .har file and using the proxy in your browser.

Configuration

The config file is a JSON file (plus // comments) with the following properties:

  • version – currently 1
  • mappings – Maps from URLs to file system paths. It is an array of {match, path} objects. match is a string or regex, and path is a string. path can contain $n references to substitute capture groups from match.
  • replacements – Replaces strings in the body of textual content. It is array of {match, replacement} objects. match is a string, regex or variable, and replacement is a string or variable. replacement can contain $n references to substitute capture groups from match.

Full example:

{
    "version": 1,
    "mappings": [
        {
            "match": {"regex": ".*\\/static\\/(.*)"},
            "path": "./public/$1"
        }
    ],
    "replacements": [
        // For JSONP requests where callback name is randomly generated
        {
            "match": {"var": "entry.request.parsedUrl.query.callback"},
            "replace": {"var": "request.parsedUrl.query.callback"}
        },
        // Proxy only works over http
        {"match": "https", "replace": "http"}
    ]
}

Types

The types mentioned above take the following forms:

  • string – a plain string. Example: "something".
  • regex – an object with a regex property, and an optional flags property. If you don't provide the flags property, unlike JavaScript, the regex has the global flag set. Example: {"regex": "user\\/([a-z]+)", "flags": "ig"}
  • variable – an object with a var property which contains a path to a value. See below for the available variables. Example: {"var": "request.parsedUrl.query.q"}

Variables

  • request – the Node request object with the addition of a parsedUrl property, containing the parsed url and query.
  • entry – the HAR entry that is being used to respond to this request. It also has a parsedUrl property, and an indexedHeaders property which maps each header name to it's value(s).

Setup

Getting a .har file

The easiest way is with the Chrome DevTools. In the Network panel disable the cache, refresh the page and interact with the page to generate the network requests that you want to capture. Then right click and select "Save as HAR with Content".

Creating a .har file

Note: Extensions such as AdBlock and Ghostery interfere with the recorded responses. Be aware of this and, if necessary, disable them before loading the page.

Browser proxy configuration

Chrome

Launch with the --proxy-server argument:

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --proxy-server=127.0.0.1:8080

Firefox

Preferences > Advanced > Network > Settings… > Manual proxy configuration

Firefox proxy settings

License

Copyright 2015 Adobe Systems Incorporated

This software is licensed under the Apache License, Version 2.0 (see LICENSE file).

server-replay's People

Contributors

benweint avatar ewhite613 avatar stdavis avatar stuk avatar wingy3181 avatar

Stargazers

 avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.