Skip to content

Commit

Permalink
v3.1.0
Browse files Browse the repository at this point in the history
  • Loading branch information
sunzhenghua committed May 30, 2018
1 parent e41e82e commit b1cbd5f
Show file tree
Hide file tree
Showing 18 changed files with 4,403 additions and 168 deletions.
85 changes: 47 additions & 38 deletions README.md
View file
Expand Up @@ -2,74 +2,83 @@

# Mocker

HTTP/HTTPS 模拟响应工具，支持浏览器和本地服务器请求，可用来模拟接口返回，便于开发及测试。
基于 [Node.js](https://nodejs.org) 和 [Electron](http://electron.atom.io/) 构建。
[中文文档](https://github.com/eshengsky/Mocker/blob/master/README_zh.md)

## 界面预览
HTTP/HTTPS mock tool, supports browsers and local server requests, can be used to mock response data returns and facilitate development and testing.
Based on [Node.js](https://nodejs.org) and [Electron](http://electron.atom.io/).

## Preview
![image](https://raw.githubusercontent.com/eshengsky/Mocker/master/static/image/preview.png)

## 功能特色
* 基于代理服务器机制并自动设置
* 无需修改现有代码中的请求链接，不污染源码
* 支持浏览器和本地服务器的请求
* 支持 HTTP 和 HTTPS 请求
* 可以完全自定义响应的内容
## Features
* Intercepting and simulating response based on proxy server mechanism.
* Normally no need to manually set proxy.
* You can mock data without modifying the request link in your code, do not pollute the source code.
* Mock data support requests from browsers and local servers.
* Support HTTP and HTTPS requests, automatically generate local SSL certificates.
* Fully custom response content.

## :gift: 应用下载
## :gift: Download
https://github.com/eshengsky/Mocker/releases
#### 注意
* 目前仅支持 Windows 平台
* 请确保你的 Windows 已安装 [PowerShell](https://www.microsoft.com/zh-cn/download/details.aspx?id=40855)（Win7 及以上版本系统通常已默认安装）
* 尽可能以管理员身份运行应用

## 本地调试
首先安装 [Node.js](https://nodejs.org/en/download/) 和 [NPM](https://www.npmjs.com/)。
#### 安装依赖包

#### Note
* Currently only support Windows platform.
* Please make sure that your Windows has been installed [PowerShell](https://www.microsoft.com/zh-cn/download/details.aspx?id=40855) (Win7+ systems are usually installed by default).
* Run Mocker as administrator as possible.

## Quick Start

Firstly install [Node.js](https://nodejs.org/en/download/) and [NPM](https://www.npmjs.com/).

#### install dependencies
```shell
$ npm install
```
#### 启动应用
#### lauch app
```shell
$ npm start
```
如果想以 debug 模式启动应用，请使用
If you want to lauch the application in debug mode, use:
```shell
$ npm run dev
```
**Enjoy it!** :smile:

## 如何打包
可以使用 [electron-packager](https://github.com/electron-userland/electron-packager) 对程序进行打包以方便分发应用。
#### 全局安装electron-packager
## How to package

You can use [electron-packager](https://github.com/electron-userland/electron-packager) to package the program to distribute the app.

#### install electron-packager
```shell
$ npm install -g electron-packager
```
#### 打包应用
在完成了 [本地调试](#本地调试) 全部操作的前提下，进入需要打包的应用的目录，执行：
#### package app
After complete [Quick Start](#quick-start), go into the directory which app you want to package, execute:
```shell
$ npm run package
```

#### 注意事项
打包过程中 electron-packager 会自动下载所需的文件并存放到 `user/你的用户名/.electron` 中，自动下载可能会很慢，建议直接在 [Electron Release](https://github.com/electron/electron/releases) 使用下载工具进行下载并放到上述目录中。
#### Note

In the packing process, `electron-packager` will automatically download the required files and store it in `user/yourname/.electron`, automatic downloading may be slow, it is recommended that use download tool to download the files in [Electron Release](https://github.com/electron/electron/releases) then put in the above directory.

## 常见问题
* 如何模拟 https 请求？
首先点击 `Mocker` 菜单栏 `SSL` - `下载证书`，将安全证书下载保存到任意位置，再点击菜单栏 `SSL` - `打开证书管理器`，在弹出的界面中选择 `受信任的根证书颁发机构` - `证书`，右击选择 `所有任务` - `导入`，要导入的文件请选择你刚刚下载的 `ca.pem` 文件，其他选项默认，完成导入。
## FAQ
* How to mock https response?
Click `Mocker` menu bar `SSL` - `Download certificate...`, save the SSL certificate to any location, then click `SSL` - `Open certmgr`, choose `Trusted root certification authority` - `certificate`, right click and choose `all tasks` - `import`, select the certificate you just downloaded, and the other options default, complete the import.

* 如何模拟本地服务器（如 Node.js 服务器）发送的请求？
`Mocker` 工具是基于代理服务器的，所以你只需要将对应的代理配置成 `http://127.0.0.1:2018` 或 `https://127.0.0.1:2018` 即可。以 Node.js 服务器为例，将启动脚本设置为 `set HTTP_PROXY=http://127.0.0.1:2018&&node ./bin/www` 。
* How to mock data sent by local servers (such as Node.js server)?
`Mocker` is based on proxy servers, so you only need to set agent as `http://127.0.0.1:28369` or `https://127.0.0.1:28369`. Take Node.js server as an example, use `set HTTP_PROXY=http://127.0.0.1:28369&&node ./bin/www`.

* 为什么关闭 Mocker 后，无法正常上网了？
在正常情况下，`Mocker` 会在退出程序前自动将系统代理重置为空，但遇到一些特殊情况（如手动杀死进程、直接关机、程序异常等），系统代理可能不会自动重置，此时你需要手动进行设置，方式：打开 `IE` - `Internet 选项` - `连接` - `局域网设置`，取消勾选代理服务器。
* I can't get to the Internet after close Mocker.
In normal circumstances, `Mocker` will automatically reset the system agent to empty before exiting the program, but in some special cases (such as manually killing process, direct shutdown, program exception, etc.), the system agent may not automatically reset, you need to manually set it, square: open the `IE` - `Internet option ` - ` Connection ` - ` LAN settings `, uncheck the proxy server.

* 我发现无法正常使用，或者有异常错误提示？
尝试使用管理员身份运行软件（[链接](http://www.skysun.name/blog/os/set-default-to-run-as-administrator-in-windows)），如果问题依旧，请提Issue。
* I can't use it correctly, or did I have an unusual error.
Try to run app as administrator, if still not working, please submit Issue.

## 许可协议
## License
The MIT License (MIT)

Copyright (c) 2018 孙正华
Copyright (c) 2018 Sky

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

Expand Down
86 changes: 86 additions & 0 deletions README_zh.md
View file
@@ -0,0 +1,86 @@
<img src="https://github.com/eshengsky/Mocker/blob/master/static/image/mocker.png" height="120" align="right">

# Mocker

[English document](https://github.com/eshengsky/Mocker/blob/master/README.md)

HTTP/HTTPS 模拟响应工具，支持浏览器和本地服务器请求，可用来模拟接口返回，便于开发及测试。
基于 [Node.js](https://nodejs.org) 和 [Electron](http://electron.atom.io/) 构建。

## 界面预览
![image](https://raw.githubusercontent.com/eshengsky/Mocker/master/static/image/preview_zh.png)

## 功能特色
* 基于代理服务器机制拦截并模拟响应
* 通常无需手动设置代理
* 无需修改代码中的请求链接即可模拟数据，不污染源码
* 支持浏览器和本地服务器的请求模拟
* 支持 HTTP 和 HTTPS 请求，自动生成本地 SSL 证书
* 完全自定义响应内容

## :gift: 应用下载
https://github.com/eshengsky/Mocker/releases

#### 注意
* 目前仅支持 Windows 平台
* 请确保你的 Windows 已安装 [PowerShell](https://www.microsoft.com/zh-cn/download/details.aspx?id=40855)（Win7 及以上版本系统通常已默认安装）
* 尽可能以管理员身份运行应用

## 本地调试

首先安装 [Node.js](https://nodejs.org/en/download/) 和 [NPM](https://www.npmjs.com/)。

#### 安装依赖包
```shell
$ npm install
```
#### 启动应用
```shell
$ npm start
```
如果想以 debug 模式启动应用，请使用
```shell
$ npm run dev
```
**Enjoy it!** :smile:

## 如何打包

可以使用 [electron-packager](https://github.com/electron-userland/electron-packager) 对程序进行打包以分发应用。

#### 全局安装electron-packager
```shell
$ npm install -g electron-packager
```
#### 打包应用
在完成了 [本地调试](#本地调试) 操作的前提下，进入需要打包的应用的目录，执行：
```shell
$ npm run package
```

#### 注意事项
打包过程中 `electron-packager` 会自动下载所需的文件并存放到 `user/你的用户名/.electron` 中，自动下载可能会很慢，建议直接在 [Electron Release](https://github.com/electron/electron/releases) 使用下载工具进行下载并放到上述目录中。

## 常见问题
* 如何模拟 https 请求？
首先点击 `Mocker` 菜单栏 `SSL` - `下载证书`，将安全证书下载保存到任意位置，再点击菜单栏 `SSL` - `打开证书管理器`，在弹出的界面中选择 `受信任的根证书颁发机构` - `证书`，右击选择 `所有任务` - `导入`，要导入的文件请选择你刚刚下载的证书，其他选项默认，完成导入。

* 如何模拟本地服务器（如 Node.js 服务器）发送的请求？
`Mocker` 工具是基于代理服务器的，所以你只需要将对应的代理配置成 `http://127.0.0.1:28369` 或 `https://127.0.0.1:28369` 即可。以 Node.js 服务器为例，将启动脚本设置为 `set HTTP_PROXY=http://127.0.0.1:28369&&node ./bin/www` 。

* 关闭 Mocker 后我无法正常上网了。
在正常情况下，`Mocker` 会在退出程序前自动将系统代理重置为空，但遇到一些特殊情况（如手动杀死进程、直接关机、程序异常等），系统代理可能不会自动重置，此时你需要手动进行设置，方式：打开 `IE` - `Internet 选项` - `连接` - `局域网设置`，取消勾选代理服务器。

* 我发现无法正常使用，或者有异常错误提示？
尝试使用管理员身份运行软件（[链接](http://www.skysun.name/blog/os/set-default-to-run-as-administrator-in-windows)），如果问题依旧，请提 Issue。

## 许可协议
The MIT License (MIT)

Copyright (c) 2018 孙正华

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
49 changes: 24 additions & 25 deletions index.html
View file
Expand Up @@ -5,7 +5,7 @@
<meta charset="UTF-8">
<title>Mocker</title>
<link rel="stylesheet" href="./node_modules/bootswatch/paper/bootstrap.css">
<link rel="stylesheet" href="./node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css">
<link rel="stylesheet" href="./node_modules/switchery/dist/switchery.min.css">
<link rel="stylesheet" href="./node_modules/fuelux/dist/css/fuelux.css">
<link rel="stylesheet" href="./node_modules/font-awesome/css/font-awesome.css">
<link rel="stylesheet" href="./node_modules/monaco-editor/min/vs/editor/editor.main.css">
Expand All @@ -14,44 +14,43 @@

<body class="fuelux">
<div class="list-panel col-md-12">
<a class="btn btn-primary" id="btn-new"><i class="fa fa-plus"></i> 新建</a>
<a class="btn btn-primary" id="btn-new"><i class="fa fa-plus"></i> <span locale="new"></span></a>
<table class="table">
<thead>
<tr>
<th width="100px">开关</th>
<th width="100px">请求方式</th>
<th>请求链接</th>
<th width="100px">操作</th>
<th width="80px" locale="req_method"></th>
<th locale="req_url"></th>
<th width="51px" locale="active"></th>
<th width="100px" locale="operate"></th>
</tr>
</thead>
<tbody id="table-body"></tbody>
<tfoot>
<tr>
<th colspan="4">无数据</th>
<th colspan="4" locale="nodata"></th>
</tr>
</tfoot>
</table>
</div>
<div class="edit-panel col-md-12">
<div class="panel req-panel">
<p class="split-title">匹配请求</p>
<p class="split-title" locale="match_req"></p>
<div class="panel-body">
<div class="form-group" id="form-uri">
<label for="text-uri">请求链接</label>
<input class="form-control" placeholder="模糊匹配" id="text-uri">
<label for="text-uri" locale="req_url"></label>
<input class="form-control" placeholder="" id="text-uri">
</div>
<div class="form-group">
<label>请求方式</label>
<label locale="req_method"></label>
<div class="input-group">
<div class="btn-group selectlist" data-resize="auto" data-initialize="selectlist" id="select-method">
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">
<span class="selected-label">&nbsp;</span>
<span class="caret"></span>
<span class="sr-only">请求方式</span>
</button>
<ul class="dropdown-menu" role="menu">
<li data-value="ALL">
<a href="#">不限</a>
<a href="#" locale="all"></a>
</li>
<li data-value="GET">
<a href="#">GET</a>
Expand Down Expand Up @@ -85,10 +84,10 @@
</div>
</div>
<div class="panel res-panel">
<p class="split-title">模拟响应</p>
<p class="split-title" locale="mock_res"></p>
<div class="panel-body">
<div class="form-group">
<label for="text-status">响应状态码</label>
<label for="text-status" locale="res_code"></label>
<div class="input-group input-append dropdown combobox" data-initialize="combobox" id="select-status">
<input type="number" class="form-control" id="text-status">
<div class="input-group-btn">
Expand All @@ -113,7 +112,7 @@
</div>
</div>
<div class="form-group">
<label for="text-mime">响应类型</label>
<label for="text-mime" locale="res_mime"></label>
<div class="input-group input-append dropdown combobox" data-initialize="combobox" id="select-mime" style="width: 100%;">
<input type="text" class="form-control" id="text-mime">
<div class="input-group-btn">
Expand Down Expand Up @@ -141,25 +140,25 @@
</div>
</div>
<div class="form-group">
<label for="text-header">自定义响应头</label>
<textarea class="form-control" placeholder="key: value 格式，多个键值对用换行隔开" rows="3" id="text-header"></textarea>
<label for="text-header" locale="res_headers"></label>
<textarea class="form-control" placeholder="" rows="3" id="text-header"></textarea>
</div>
<div class="form-group">
<label for="text-body">响应内容</label>
<label for="text-body" locale="res_body"></label>
<div class="lang-mode-wrap">
<select class="form-control input-sm" id="select-mode">
<option value="json">JSON</option>
<option value="html">HTML</option>
<option value="javascript">JavaScript</option>
<option value="css">CSS</option>
<option value="plaintext">纯文本</option>
<option value="plaintext" locale="plaintext"></option>
</select>
<p>语言模式：</p>
<p locale="lang_mode"></p>
</div>
<div id="text-body"></div>
</div>
<div class="form-group">
<label for="text-delay">响应延迟</label>
<label for="text-delay" locale="res_delay"></label>
<div class="input-group">
<input type="number" class="form-control" id="text-delay" value="0">
<div class="input-group-addon">ms</div>
Expand All @@ -168,8 +167,8 @@
</div>
</div>
<div class="action-bar">
<button class="btn btn-default btn-back">返回</button>
<button class="btn btn-success btn-save">保存修改</button>
<button class="btn btn-default btn-back" locale="back"></button>
<button class="btn btn-success btn-save" locale="save"></button>
</div>
<input type="hidden" id="uid" value="">
<input type="hidden" id="active" value="">
Expand All @@ -185,7 +184,7 @@
global.require = nodeRequire;
</script>
<script src="./node_modules/bootstrap/dist/js/bootstrap.js"></script>
<script src="./node_modules/bootstrap-switch/dist/js/bootstrap-switch.js"></script>
<script src="./node_modules/switchery/dist/switchery.min.js"></script>
<script src="./node_modules/fuelux/dist/js/fuelux.js"></script>
<script src="./node_modules/sweetalert2/dist/sweetalert2.all.js"></script>
<script src="./static/js/index.js"></script>
Expand Down

0 comments on commit b1cbd5f

Please sign in to comment.