egg(二):给刚建好的egg项目配置路由，写接口数据

小咪咪 2022-09-13 11:26 193阅读 0赞

### 前言： ###

### 给egg项目中配置路由，并写入接口，提供数据。 ###

### 实现效果： ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_16_color_FFFFFF_t_70_g_se_x_16][]

# 一、路由的实现：[官方入口][Link 1] #

## 在app底下新建一个router的文件夹，我们这里把本地和线上分为两个路由文件来处理 ##

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_14_color_FFFFFF_t_70_g_se_x_16][]

### 1、把router.js中的默认文件删除 ###

/**
     * 路由配置
     * @param app
     */
    module.exports = app => {
    
      //--------------------------------------------------
      // 根据环境加载路由
      //--------------------------------------------------
      if(app.config.env === 'prod'){
        require('./router/router.prod')(app);
      }else{
        require('./router/router.local')(app);
      }
    };

### 2、在controller下面新建两个文件夹，new,shop，再新建一个common.js，这些都是单独模块+公共模块的路由放的地方 ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_15_color_FFFFFF_t_70_g_se_x_16][]

### common.js ###

/**
     *  公共路由
     * @param app
     * @returns {HomeController}
     */
    const Controller = require('egg').Controller;
    class HomeController extends Controller {
      async notFound(ctx){
        await ctx.render('404,渲染页面');
      }
      async fiveCu(ctx){
        await ctx.render('333333333');
      }
    }
    module.exports = HomeController;

### shop/index ###

/**
     *  购物
     * @param app
     * @returns {HomeController}
     */
    const Controller = require('egg').Controller;
    class HomeController extends Controller {
      async list() {
        const { ctx } = this;
        ctx.body = 'hi, egg';
      }
    }
    module.exports = HomeController;

### 3、router.local.js，线上的可以和本地一样，根据实际情况来 ###

/**
     * 路由配置
     * @param app
     */
    module.exports = app => {
        const { router, controller } = app;
        //--------------------------------------------------
        // 基础接口
        //--------------------------------------------------
        app.get('/', controller.shop.index.list); 
        app.get('/404', controller.common.notFound); 
        app.get('/500', controller.common.fiveCu);
    
    
    };

## 到这一步实现效果： ##

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_11_color_FFFFFF_t_70_g_se_x_16][]

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_20_color_FFFFFF_t_70_g_se_x_16][]

# 二、后台接口的实现： #

### 1、get请求，打开刚刚建立的 new/list.js ###

//app/controller/news.js
    const Controller = require('egg').Controller;
    class NewsController extends Controller {
      async list() {
        const dataList = await this.other();
        this.ctx.body = {
          code:0,
          masg:'news list success',
          data:dataList
        };
      }
    
      async other() {
        return {
          list: [
            { id: 1, title: 'this is news 1', url: '/news/1' },
            { id: 2, title: 'this is news 2', url: '/news/2' }
          ]
        }
      }
    }
    module.exports = NewsController;

### 2、打开router.local.js，加上路由 app.get('/list', controller.new.list.list); ###

/**
     * 路由配置
     * @param app
     */
    module.exports = app => {
        const { router, controller } = app;
        //--------------------------------------------------
        // 基础接口
        //--------------------------------------------------
        app.get('/', controller.shop.index.list); 
    
        app.get('/list', controller.new.list.list); //加入
    
    
        app.get('/404', controller.common.notFound); 
        app.get('/500', controller.common.fiveCu);
    
    
    };

### 3、页面上输入：[http://localhost:7001/list][http_localhost_7001_list] ###

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_13_color_FFFFFF_t_70_g_se_x_16][]

[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_16_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/f25df360ea6146e3b54667a375a87abb.png
[Link 1]: https://eggjs.org/zh-cn/basics/router.html
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_14_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/99e7989a9ba84d4db5cf724f92dc3400.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_15_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/2921d93a54ae464d8ae6c44423d515fe.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_11_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/e0c1db2b544a4bfaaf600c01f38aca5c.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_20_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/261aff541be347359d266c8b80656b91.png
[http_localhost_7001_list]: http://localhost:7001/list
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAUG9ubmVudWx0_size_13_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/2c135079bf3e4b5dabbf0dbfb5ff1868.png