mockjs引入以及使用方式

1
2
3
4
5

1、普通引入 script src 即可
2、vue中使用 
npm install mockjs --dev 
main.js中
import "./mock"

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

// 引入mockjs
import Mock from 'mockjs'
import loginAPI from './login'
// import articleAPI from './article'
// import remoteSearchAPI from './remoteSearch'
// import transactionAPI from './transaction'
// 获取 mock.Random 对象
// const Random = Mock.Random;
// // mock一组数据
// const produceNewsData = function() {
//     let articles = [];
//     for (let i = 0; i < 100; i++) {
//         let newArticleObject = {
//             title: Random.csentence(5, 30), //  Random.csentence( min, max )
//             thumbnail_pic_s: Random.dataImage('300x250', 'mock的图片'), // Random.dataImage( size, text ) 生成一段随机的 Base64 图片编码
//             author_name: Random.cname(), // Random.cname() 随机生成一个常见的中文姓名
//             date: Random.date() + ' ' + Random.time() // Random.date()指示生成的日期字符串的格式,默认为yyyy-MM-dd；Random.time() 返回一个随机的时间字符串
//         }
//         articles.push(newArticleObject)
//     }

//     return {
//         articles: articles
//     }
// }

// Mock.mock( url, post/get , 返回的数据)；


// 修复在使用 MockJS 情况下，设置 withCredentials = true，且未被拦截的跨域请求丢失 Cookies 的问题
// https://github.com/nuysoft/Mock/issues/300
Mock.XHR.prototype.proxy_send = Mock.XHR.prototype.send
Mock.XHR.prototype.send = function() {
    if (this.custom.xhr) {
        this.custom.xhr.withCredentials = this.withCredentials || false
    }
    this.proxy_send(...arguments)
}

// Mock.setup({
//   timeout: '350-600'
// })


// 登录相关
Mock.mock(/\/login/, 'post', loginAPI.loginByUsername)
Mock.mock(/\/scene\/get_all/, 'post', loginAPI.getcontentListInfo)
    // Mock.mock(/\/login\/logout/, 'post', loginAPI.logout)
    // Mock.mock(/\/user\/info\.*/, 'get', loginAPI.getUserInfo)
export default Mock

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

const userMap = {
    admin: {
        data: {
            access_token: "zwLB6rnP6vn5As3R1L2gaZRmPT7bT4th",
            expire_time: "100000",
            refresh_token: "jwWw4RmUdngWnczlnsjDVENpJUDIMmzJ",
        },
        state: true,
    },
}

const contentList = {
    data: [{
        camera_info: [{ camera_no: "camera_5_defalt", camera_name: "5楼门口", rmtp_url: "557fe66c52bf4a228a36265ffd4a3c3b" }],
        movie_name: "5楼",
        movie_no: "floor_5"
    }, {
        camera_info: [{ camera_no: "camera_5_defalt", camera_name: "5楼门口", rmtp_url: "557fe66c52bf4a228a36265ffd4a3c3b" }],
        movie_name: "6楼",
        movie_no: "floor_6"
    }],
    state: true
}

export default {
    loginByUsername: config => {
        console.log(config)
        console.log(JSON.parse(config.body))
        const { username } = JSON.parse(config.body)
        return userMap[username]
    },
    getcontentListInfo: config => {
        return contentList
    },
    logout: () => 'success'
}