Koa2 server rendering web development, how to deal with the data interaction triggered by browser events?

how to deal with it generally, all I can think of is to do some interfaces on the node server, as shown in the following figure:

routes/news.js

const router = require("koa-router")({
    prefix: "/news"
})
const config = require("../config")
const controllers = require("../controllers")

router.get("/", async (ctx, next) => {
    const { companyNews, industryNews } = await controllers.news.getList(ctx, next)

    await ctx.render("news", {
        header: {
            title: "",
            javascript: config.javascript.concat("/js/jqpaginator.min.js", "/js/frontNewsCenter.js"),
            style: config.style.concat("/css/frontNewsCenter.css"),
        },
        newBanner: {
            imgSrc: "/images/news/banner.png",
        },
        tabNav: {
            items: [{
                cn: "",
                en: "Company news",
            }, {
                cn: "",
                en: "Industry information",
            }],
        },
        companyNews: companyNews,
        industryNews: industryNews,
    })
})

router.get("/getList", controllers.news.getList)

module.exports = router

controllers/news.js

const { getCompanyNewsList, getIndustryInfoList } = require("../config").service
const axios = require("axios")

async function getList (ctx, next) {

    const page = ctx.query.page || "1"    // page
    const size = ctx.query.size || "10"   // size
    const role = ctx.query.role || "news" // role

    let code = -1
    let data = []
    let companyNews = []
    let industryNews = []

    if (role === "news") {
        await axios.get(getCompanyNewsList, {
                params: {
                    page: page,
                    size: size
                }
            })
            .then(res => {
                if (res.data.code === "2000") {
                    code = 0
                    data = res.data.obj
                    companyNews = res.data.obj.records
                }
            })
    }

    if (role === "industry") {
        await axios.get(getIndustryInfoList, {
                params: {
                    page: page,
                    size: size
                }
            })
            .then(res => {
                if (res.data.code === "2000") {
                    code = 0
                    data = res.data.obj
                    industryNews = res.data.obj.records
                }
            })

    }

    ctx.state.code = code
    ctx.state.data = data

    return {
        companyNews,
        industryNews,
    }
}

module.exports = {
    getList
}
Mar.04,2021

restful service, ctx.body equals ctx.response.body

router.get('/', async(ctx) => {
    ctx.body = {hello: 'world'}
})
Menu