vue_music:build打包启动和webpack接口调用方式

1.webpack中接口调用方式

第一种webpack.dev.config.js

《vue_music:build打包启动和webpack接口调用方式》

2. 第二种

《vue_music:build打包启动和webpack接口调用方式》

2. build打包启动

1. 执行npm run build打包

使用了vue-router路由懒加载,所以app.js只有50KB

《vue_music:build打包启动和webpack接口调用方式》

2. 启动本地服务

在项目文件夹下,新建prod.server.js,然后node prod.server.js

var express = require('express')
var config = require('./config/index')
var axios = require('axios')
var app = express()
var port = process.env.PORT || config.build.port
var apiRoutes = express.Router()


apiRoutes.get('/getDiscList',function(req, res){
  console.log('1111111')
  var url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg'

  axios.get(url, {
    headers: {
      referer: 'https://c.y.qq.com',
      host: 'c.y.qq.com'
    },
    params: req.query
  }).then((response) => {
    res.json(response.data)
  }).catch((e) => {
    console.log(e)
  })
})

apiRoutes.get('/lyric',function(req, res){
  console.log('222222')
  var url = 'https://szc.y.qq.com/lyric/fcgi-bin/fcg_query_lyric_new.fcg'

  axios.get(url, {
    headers: {
      referer: 'https://c.y.qq.com',
      host: 'c.y.qq.com'
    },
    params: req.query
  }).then((response) => {
    res.json(response)
  }).catch((e) => {
    console.log(e)
  })
})

apiRoutes.get('/getSongList',function(req, res){
  console.log('33333333')
  var url = 'https://c.y.qq.com/qzone/fcg-bin/fcg_ucc_getcdinfo_byids_cp.fcg'

  axios.get(url, {
    headers: {
      referer: 'https://y.qq.com/',
      host: 'c.y.qq.com'
    },
    params: req.query
  }).then((response) => {
    res.json(response)
  }).catch((e) => {
    console.log(e)
  })
})

apiRoutes.get('/getHotKey',function(req, res){
  console.log('444444')
  var url = 'https://c.y.qq.com/splcloud/fcgi-bin/gethotkey.fcg'
  axios.get(url, {
    headers: {
      referer: 'https://y.qq.com/',
      host: 'c.y.qq.com'
    },
    params: req.query
  }).then((response) => {
    res.json(response.data)
  }).catch((e) => {
    console.log(e)
  })
})

apiRoutes.get('/search',function(req, res){
  console.log('55555')
  var url = 'https://c.y.qq.com/soso/fcgi-bin/search_for_qq_cp'

  axios.get(url, {
    headers: {
      referer: 'https://y.qq.com/',
      host: 'c.y.qq.com'
    },
    params: req.query
  }).then((response) => {
    res.json(response.data)
  }).catch((e) => {
    console.log(e)
  })
})

app.use('/api', apiRoutes)

app.use(express.static('./dist'))

module.exports = app.listen(port, function(err) {
  if(err) {
    console.log(err)
    return
  }
  console.log('listening at http://localhost:' + port + '\n')
})

注意:中间件的路径

《vue_music:build打包启动和webpack接口调用方式》

    原文作者:云深不知处
    原文地址: https://segmentfault.com/a/1190000017554197
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞