E-commerce project: high imitation Xiaomi Mall (API document)

Preface
     Q: What is the purpose of API documentation?
     A: When you want to quickly start an open source project, you can quickly clarify the structure of the project by reading the API documentation of the project. When I first used github to learn from some excellent open source projects on the Internet, I was confused as to where I started. Do you want to run first to see the effect? Which part do you look at first, is it the front-end or the back-end?
     In fact, the development teams of most large-scale projects on Github/Git will give a detailed introduction to the project. To put it most directly, they will write a very detailed README.md document, for example, as you can see from the figure below The complete structure of a project, what technologies are used, and what is the architecture. The project development team will also collect feedback from the public to fix some bugs. The purpose is to systematically improve the project.
      Emmmm, for those who are just starting to play Github, the project documentation is worth a closer look. I will probably summarize what we can learn from it.

1. Learn about the project faster and overall according to the documentation, such as how to run it on the local machine
2. Indirectly learn the Markdown language, because the project documents are basically written in Markdown. With Markdown, blogging is easier and more convenient~
3. If you encounter a problem that is difficult for Du Niang to solve during the project process, you may wish to look at the Issues and FAQ (Frequently Asked Questions) sections in the project documentation. You can even capture some useful information in the comments of other people (a lot of comments are left) It is a question mark, of course, there are many praises that are items of conscience )

The front-end and back-end interface specifications and interface documents of this project.

1. Front-end and back-end interface specifications

1.1, request format

Use RESTful style interface. Currently, GET, POST, PUT, and DELETE are used to represent the three content semantics of request, update and delete.

1.1.1, GET request

GET API_URL?params

E.g

GET /carts/SelectAll

or

GET /carts/updatecart?goodid=4

1.1.2, POST request

POST API_URL
{
    
    
    body
}

E.g

POST /createorder

or

POST /createorder
{
    
    
    name: "ZTY",
    shippingId:
}

1.1.3, PUT request (essentially the same as GET)

PUT API_URL?params

E.g

PUT /push
{
    
    
   id: 2,
   username:'ZTY'
}

1.1.4, DELETE request (essentially the same as GET)

DELETE API_URL?params

E.g

DELETE /push
{
    
    
   id: 2
}

1.2, response format

Content-Type: application/json;charset=UTF-8

{
    
    
    body
}

The body is json content in a certain format:

{
    
    
    status: XXX,
    data: {
    
    }
}

1.2.1 Ordinary objects

{
    
    
    status: 0,
    data: {
    
    }
}

1.2.2 Array Object

{
    
    
    status: 0,
    data: {
    
    
        list: [],
        total: XX，
    }
}

list is an array of objects, and total is the length of the array.

2. Mall API service

2.1 Home

Load four requests during initialization: sum, product, category, productfoot

1、sum

Request path: /carts/sum

Request method: GET

Request URL: http://localhost:8080/carts/sum?username=ZTY

Function: Return the total quantity of the shopping cart

Response json:

{
    
    
    "status": 0,
    "data": null,
    "cartTotalPrice": 0,
    "imageHost": null,
    "selectedAll": false,
    "cartTotalQuantity": 3
}

2. Product (drop-down navigation bar for Xiaomi mobile phones, notebooks, and TVs)

Request path: /index/product

Request method: GET

Request URL: http://localhost:8080/index/product?categoryId=1&pageStart=1

Function: return to the product category brand (each type of 8 products)

Response json:

{
    
    
    "status": 0,
    "data": [
    {
    
    
    "good_id": 1,
    "name": "小米CC9",
    "price": 1799,
    "imageHead": "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/963679eaf3937351e154600ab3448460.png?thumb=1&w=160&h=110&f=webp&q=90"
    },
    {
    
    
    "good_id": 2,
    "name": "小米8青春版",
    "price": 1509,
    "imageHead": "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/b11742a0be47f9d97bb6a13ea580018d.png?thumb=1&w=160&h=110&f=webp&q=90"
    },
    {
    
    
    "good_id": 3,
    "name": "Redmi K20 Pro",
    "price": 1418,
    "imageHead": "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/a4a76ee684e51f0ee531ef3dc7f0aeaf.png?thumb=1&w=160&h=110&f=webp&q=90"
    },
    {
    
    
    "good_id": 4,
    "name": "小米11",
    "price": 4299,
    "imageHead": "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/3bf20f1df3f2e22c5b29ff07634f3c59.png?thumb=1&w=160&h=110&f=webp&q=90"
    },
    {
    
    
    "good_id": 5,
    "name": "Redmi K30S纪念版",
    "price": 2599,
    "imageHead": "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/5d19da60f9f62eb2aa5dcdbd7df19f0f.png?thumb=1&w=160&h=110&f=webp&q=90"
    },
    {
    
    
    "good_id": 6,
    "name": "Redmi Note 8",
    "price": 899,
    "imageHead": "https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/584add2c9cfdb9eefe7b642bf191773a.png?thumb=1&w=160&h=110&f=webp&q=90"
    }
    ]
}

3. category (category column on the left side of the carousel)

Request path: /index/category

Request method: GET

Request URL: http://localhost:8080/index/category

Function: Return to the product category list

Response json:

{
    
    
        "status": 0,
        "data": {
    
    
        "cateList": [
        {
    
    
        "categoryId": 1,
        "name": "手机 电话卡\r\n",
        "menuList": [
        [
        {
    
    
        "good_id": 1,
        "icon": "/imgs/category/h1/h11.webp",
        "name": "小米CC9"
        },
        {
    
    
        "good_id": 2,
        "icon": "/imgs/category/h1/h12.webp",
        "name": "小米8青春版"
        },
        {
    
    
        "good_id": 3,
        "icon": "/imgs/category/h1/h13.webp",
        "name": "Redmi K20 Pro"
        },
        {
    
    
        "good_id": 4,
        "icon": "/imgs/category/h1/h14.webp",
        "name": "小米11"
        }
        ],
        [
        {
    
    
        "good_id": 5,
        "icon": "/imgs/category/h1/h15.webp",
        "name": "Redmi K30S纪念版"
        },
        {
    
    
        "good_id": 6,
        "icon": "/imgs/category/h1/h16.webp",
        "name": "Redmi Note 8"
        },
        {
    
    
        "good_id": 7,
        "icon": "/imgs/category/h1/h17.webp",
        "name": "腾讯黑鲨游戏手机"
        },
        {
    
    
        "good_id": 8,
        "icon": "/imgs/category/h1/h18.webp",
        "name": "Redmi 8A"
        }
        ]
        ]
        },
        {
    
    
        "categoryId": 2,
        "name": "电视 盒子",
        "menuList": [
        [
        {
    
    
        "good_id": 13,
        "icon": "/imgs/category/h2/h21.webp",
        "name": "小米透明电视"
        },
        {
    
    
        "good_id": 14,
        "icon": "/imgs/category/h2/h22.webp",
        "name": "小米电视大师"
        },
        {
    
    
        "good_id": 15,
        "icon": "/imgs/category/h2/h23.webp",
        "name": "量子点电视"
        },
        {
    
    
        "good_id": 16,
        "icon": "/imgs/category/h2/h24.webp",
        "name": "米家空调"
        }
        ],
        [
        {
    
    
        "good_id": 17,
        "icon": "/imgs/category/h2/h25.webp",
        "name": "全面屏电视Pro"
        },
        {
    
    
        "good_id": 18,
        "icon": "/imgs/category/h2/h26.webp",
        "name": "米家投影抗光幕"
        },
        {
    
    
        "good_id": 19,
        "icon": "/imgs/category/h2/h27.jpg",
        "name": "Redmi智能电视A55\r\n"
        },
        {
    
    
        "good_id": 20,
        "icon": "/imgs/category/h2/h28.webp",
        "name": "Redmi MAX 98\""
        }
        ]
        ]
        }
}

4. Productfoot (commodity categories display mobile phones, TVs, and peripherals)

Request path: /index/productfoot

Request method: GET

Request URL: http://localhost:8080/index/productfoot?categoryId=1&pageStart=1

Function: Return to the product category list

Response json:

{
    
    
  "status": 0,
  "data": [
    {
    
    
      "good_id": 1,
      "subtitle": "3200万+4800万 前后双旗舰相机",
      "name": "小米CC9",
      "price": 1799,
      "imageFoot": "/imgs/imgfoot/phone/1.webp"
    },
    {
    
    
      "good_id": 2,
      "subtitle": "50倍潜望式变焦，轻薄5G手机",
      "name": "小米8青春版",
      "price": 1509,
      "imageFoot": "/imgs/imgfoot/phone/2.webp"
    },
    {
    
    
      "good_id": 3,
      "subtitle": "高性能长续航 5G 手机",
      "name": "Redmi K20 Pro",
      "price": 1418,
      "imageFoot": "/imgs/imgfoot/phone/3.webp"
    },
    {
    
    
      "good_id": 4,
      "subtitle": "2021轻装上阵",
      "name": "小米11",
      "price": 4299,
      "imageFoot": "/imgs/imgfoot/phone/4.webp"
    },
    {
    
    
      "good_id": 5,
      "subtitle": "144Hz 变速高刷，硬核旗舰",
      "name": "Redmi K30S纪念版",
      "price": 2599,
      "imageFoot": "/imgs/imgfoot/phone/5.webp"
    },
    {
    
    
      "good_id": 6,
      "subtitle": "千元4800万四摄",
      "name": "Redmi Note 8",
      "price": 899,
      "imageFoot": "/imgs/imgfoot/phone/6.webp"
    },
    {
    
    
      "good_id": 7,
      "subtitle": "骁龙865处理器/双模5G/270Hz触控采样率",
      "name": "腾讯黑鲨游戏手机",
      "price": 2999,
      "imageFoot": "/imgs/imgfoot/phone/7.webp"
    },
    {
    
    
      "good_id": 8,
      "subtitle": "5000mAh 充电宝级大电量",
      "name": "Redmi 8A",
      "price": 699,
      "imageFoot": "/imgs/imgfoot/phone/8.webp"
    }
  ]
}

2.2. Product details

1. getinfo (obtain product information)

Request path: /product/getinfo

Request method: GET

Request URL: http://localhost:8080/product/getinfo?id=16

Role: return product details

Response json:

{
    
    
  "status": 0,
  "data": {
    
    
    "name": "米家空调",
    "subtitle": "4K 分辨率画面 / 2000 ANSI 流明",
    "price": 2399,
    "desc1": null,
    "desc2": null,
    "p1": null,
    "p2": null
  }
}

2. Click to play the video

Request path: /imgs/product/video.mp4

Request method: GET

Request URL: http://localhost:8081/imgs/product/video.mp4 (will not request backend)

Function: Pop up the video box and play the video

Response json: none

2.3, shopping cart

1. Click to select all:

Request path: /carts/SelectAll

Request method: GET

Request URL:http://localhost:8080/carts/selectAll(或unSelectAll)?username=ZTY

Role: change productSelected to true

Response json:

{
    
    
  "status": 0,
  "data": {
    
    
    "list": [
      {
    
    
        "good_id": 4,
        "count": 1,
        "goods_name": "小米11",
        "subtitle": "2021轻装上阵",
        "price": 4299,
        "productTotalPrice": 4299,
        "productStock": 1000,
        "productSelected": true,
        "status": 1
      },
      {
    
    
        "good_id": 3,
        "count": 1,
        "goods_name": "Redmi K20 Pro",
        "subtitle": "高性能长续航 5G 手机",
        "price": 1418,
        "productTotalPrice": 1418,
        "productStock": 1000,
        "productSelected": true,
        "status": 1
      }
    ]
  },
  "cartTotalPrice": 5717,
  "imageHost": "www.mi.com",
  "selectedAll": true,
  "cartTotalQuantity": 2
}

2. Unselect all:

Request path: /carts/unSelectAll

Role: change productSelected to false

Response json:

{
    
    
  "status": 0,
  "data": {
    
    
    "list": [
      {
    
    
        "good_id": 4,
        "count": 1,
        "goods_name": "小米11",
        "subtitle": "2021轻装上阵",
        "price": 4299,
        "productTotalPrice": 4299,
        "productStock": 1000,
        "productSelected": false,
        "status": 1
      },
      {
    
    
        "good_id": 3,
        "count": 1,
        "goods_name": "Redmi K20 Pro",
        "subtitle": "高性能长续航 5G 手机",
        "price": 1418,
        "productTotalPrice": 1418,
        "productStock": 1000,
        "productSelected": false,
        "status": 1
      }
    ]
  },
  "cartTotalPrice": 0,
  "imageHost": "www.mi.com",
  "selectedAll": false,
  "cartTotalQuantity": 0
}

3. The quantity of a single item in the shopping cart +1/-1:

Request path: /carts/updatecart

Request method: GET

Request URL:http://localhost:8080/carts/updatecart?goodid=4&username=ZTY&quantity=2&selected=true

Role: change the count and cartTotalQuantity, cartTotalPrice in the list

Response json:

{
    
    
  "status": 0,
  "data": {
    
    
    "list": [
      {
    
    
        "good_id": 4,
        "count": 2,
        "goods_name": "小米11",
        "subtitle": "2021轻装上阵",
        "price": 4299,
        "productTotalPrice": 8598,
        "productStock": 1000,
        "productSelected": true,
        "status": 1
      },
      {
    
    
        "good_id": 3,
        "count": 1,
        "goods_name": "Redmi K20 Pro",
        "subtitle": "高性能长续航 5G 手机",
        "price": 1418,
        "productTotalPrice": 1418,
        "productStock": 1000,
        "productSelected": false,
        "status": 1
      }
    ]
  },
  "cartTotalPrice": 8598,
  "imageHost": "www.mi.com",
  "selectedAll": false,
  "cartTotalQuantity": 3
}

2.4. Order confirmation page

Load three requests during initialization: sum, getAll and getcarts

1、sum

Request path: /carts/sum

Request method: GET

Request URL: http://localhost:8080/carts/sum?username=ZTY

Function: Return the total quantity of the shopping cart

Response json:

{
    
    
    "status": 0,
    "data": null,
    "cartTotalPrice": 0,
    "imageHost": null,
    "selectedAll": false,
    "cartTotalQuantity": 3
    }

2 、 getAll

Request path: /shippings/getAll

Request method: GET

Request URL: http://localhost:8080/shippings/getAll?username=ZTY

Function: Return all addresses filled in by the user

Response json:

{
    
    

    "status": 0,
    "data": {
    
    
    "total": 2,
    "addreList": [
    {
    
    
    "id": 1,
    "userid": "60e7d760-1fa9-4391-a0e7-a302b0439ca1",
    "username": null,
    "receiverName": "ZTY",
    "receiverMobile": "18873242002",
    "receiverProvince": "广东省",
    "receiverCity": "东莞市",
    "receiverAddress": "OPPO移动终端部",
    "receiverZip": "523879"
    },
    {
    
    
    "id": 2,
    "userid": "60e7d760-1fa9-4391-a0e7-a302b0439ca1",
    "username": null,
    "receiverName": "ttt",
    "receiverMobile": "11111111111",
    "receiverProvince": "天津市",
    "receiverCity": "和平区",
    "receiverAddress": "无",
    "receiverZip": "523879"
    }
    ]
    }
    }

3、getcarts

Request path: /carts/getcarts

Request method: GET

Request URL: http://localhost:8080/carts/getcarts?username=ZTY

Function: Return detailed information of all products in the shopping cart

Response json:

{
    
    

    "status": 0,
    "data": {
    
    
    "list": [
    {
    
    
    "good_id": 4,
    "count": 2,
    "goods_name": "小米11",
    "subtitle": "2021轻装上阵",
    "price": 4299,
    "productTotalPrice": 8598,
    "productStock": 1000,
    "productSelected": true,
    "status": 1
    },
    {
    
    
    "good_id": 3,
    "count": 1,
    "goods_name": "Redmi K20 Pro",
    "subtitle": "高性能长续航 5G 手机",
    "price": 1418,
    "productTotalPrice": 1418,
    "productStock": 1000,
    "productSelected": true,
    "status": 1
    }
    ]
    },
    "cartTotalPrice": 10016,
    "imageHost": "www.mi.com",
    "selectedAll": true,
    "cartTotalQuantity": 3
    }

Github project address

    The project is divided into two parts : the user end tongyimall and the management end tongyimall-admin .

                                                                                                   To be continued. . . .