vue 2.xはバックエンドインターフェースエージェントを通して、qq音楽apiのデータの例を取得する。

前書き：一部のqq音楽のアプリは直接jsopを通じて訪問することができなくて、公式の代行を通じて(通って)ようやく獲得することができなければなりません。
1.webpack.dev.com nf.jsでインターフェースを作成する：

//     :
var express = require('express')
var axios = require('axios')
var app = express()
var apiRoutes = express.Router()
app.use('/api', apiRoutes)
 
 
// devServer     :
  before(app) {
   app.get('/api/getDiscList', function (req, res) {
    var url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg' //  api
    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)
    })
   })
  }

2.appiのjsファイルでは、urlをステップ1でユーザー定義のインターフェースに変換し、axiosでリターンデータを取得します。

import jsonp from 'common/js/jsonp'
import {commonParams, options} from './config'
import axios from 'axios'
 
 
export function getDiscList() {
 const url = '/api/getDiscList'
 
 
 const data = Object.assign({}, commonParams, {
  platform: 'yqq', //    
  hostUin: 0,
  sin: 0,
  ein: 29,
  sortId: 5,
  needNewCode: 0,
  categoryId: 10000000,
  rnd: Math.random(),
  format: 'json'
 })
 
 
 return axios.get(url, {
  params: data
 }).then((res) => {
  return Promise.resolve(res.data)
 })
}

3.コンポーネントの中でappiのjsファイルの方法でデータを取得する

import {getDiscList} from 'api/recommend'
 
 
_getDiscList() {
 getDiscList().then((res) => {
  if (res.code === ERR_OK) {
   console.log('  :', res)
   this.discList = res.data.list
  } else {
   console.log(' ,    ')
  }
 })
}

以上のこのvue 2.xは後端インターフェースを通じて代理して、qq音楽apiのデータの例を獲得します。つまり、小編集は皆さんに共有した内容の全部です。