ssr无需等待，让前端独立于后端进行开发

Java_oldboy 发布于2019-08-22 10:58 / 1365人阅读

摘要：大家肯定遇到过，当后端没有编写完成时，前端无法进行调试，这就导致了前端会被后端阻塞的情况。强制跨域访问请求不报错启动多个服务，自动解决端口冲突设置指定端口号全局安装命令帮助。

ssr

将一个目录设置成一个静态服务器。。大家肯定遇到过，当后端 API 没有编写完成时，前端无法进行调试，这就导致了前端会被后端阻塞的情况。而ssr相当于是搭建了一个 Mock Server ，构建假数据，然后把这些假数据存到 JSON 文件上，Mock Server 可以响应请求或者生成页面，当然也可以顺便生成 API 文档。

强制跨域访问(AJAX请求不报错)

启动多个服务，自动解决端口冲突

设置指定端口号

全局安装

npm install -g ssr

命令帮助。

Usage: ssr [options]

Options:
  --help, -h         Show help                                        
  --version, -V, -v  Show version number                              
  --port, -p         Set the port!
  --cors, -c         allows cross origin access serving
  --proxy            Local data mock                         [string]

  copyright 2015

命令使用 ssr

$ ssr           # 默认 端口 1987   访问地址：=> http://localhost:1987
$ ssr -p 2015   # 端口设置 2015   访问地址：=> http://localhost:2015
$ ssr -cp 2015   #端口设置 2015  并且 可以跨域访问

注意： 默认不传端口，起多个服务不会发生端口冲突，尽情玩耍吧。

使用方法

建两个目录文件 dir1 和 dir2

分别进入这两个目录使用ssr起服务

dir1 运行ssr -cp 1987 起来之后为 http://localhost:1987，dir2 运行 ssr -cp 2015 起来之后地址为 http://localhost:2015

本地数据 mock 方法一

在 dir1 中存一个文件 file 里面是JSON数据格式

在 dir2 中存一个 index.html 通过 jQuery 去访问 file 文件返回 JSON 或者你输入file文件中的内容的内容

方法二

proxy.config.js 的配置方法：

module.exports = {
    // Mock 数据返回
    "GET /users": [{name:"kenny wang"}, {name:"JSLite doc"}],
    "GET /users/1": {name:"JSLite api"},
    "POST /users":{name:"JSLite"},
    "POST /users/2":"22323sd",
    "POST /users":function(data,url){
        // data 接受传递数据
        // url 请求
        // 接受
        // - form-data
        // - x-www-form-urlencoded
        // - raw
        if(data.name === "jslite"){
            return {name:"卧槽121221"}
        }else{
            return {name:"yyy"}
        }
    }
};

使用方法

$ ssr --proxy example/proxy.config.js -p 19992

当前目录安装

npm install ssr

nodejs 中应用，这个在 idoc文档生成工具中应用过了

var ssr = require("ssr");
    ssr(1998);

GPU云服务器云服务器后端开发和前端开发前端开发后端开发后端和前端开发前端后端开发

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/91537.html

mockjs让前端开发独立于后端

摘要：可以模拟数据，拦截请求，返回模拟数据，无需后端返回就可以测试前端程序官网原文首先在头中引入我们需要的文件在请求之前，用定义返回数据表示成功，表示错误信息不完整弹出错误信息在中的要与中的相同，比如我这里是那么好了，说到这里，我们进行测试一下调 mock.js 可以模拟ajax数据，拦截ajax请求，返回模拟数据，无需后端返回就可以测试前端程序 mockjs官网原文：http://i.j...

Half 2019-08-29 11:31 评论0 收藏0
mockjs让前端开发独立于后端

摘要：可以模拟数据，拦截请求，返回模拟数据，无需后端返回就可以测试前端程序官网原文首先在头中引入我们需要的文件在请求之前，用定义返回数据表示成功，表示错误信息不完整弹出错误信息在中的要与中的相同，比如我这里是那么好了，说到这里，我们进行测试一下调 mock.js 可以模拟ajax数据，拦截ajax请求，返回模拟数据，无需后端返回就可以测试前端程序 mockjs官网原文：http://i.j...

Ali_ 2019-08-20 12:01 评论0 收藏0
mockjs让前端开发独立于后端

摘要：可以模拟数据，拦截请求，返回模拟数据，无需后端返回就可以测试前端程序官网原文首先在头中引入我们需要的文件在请求之前，用定义返回数据表示成功，表示错误信息不完整弹出错误信息在中的要与中的相同，比如我这里是那么好了，说到这里，我们进行测试一下调 mock.js 可以模拟ajax数据，拦截ajax请求，返回模拟数据，无需后端返回就可以测试前端程序 mockjs官网原文：http://i.j...

Terry_Tai 2019-08-01 15:55 评论0 收藏0
让前端攻城师独立于后端进行开发: Mock.js

摘要：一是什么目前的大部分公司的项目都是采用的前后端分离后端接口的开发和前端人员是同时进行的那么这个时候就会存在一个问题在页面需要使用大量数据进行渲染生成前后端开发人员的接口也许并没有写完作为前端的我们也就没有办法获取数据所以前端工程师就需要自己 showImg(https://segmentfault.com/img/remote/1460000013022563); 一.Mock.js是...

Fundebug 2019-08-22 14:06 评论0 收藏0