共计 1603 个字符,预计需要花费 5 分钟才能阅读完成。
在旧版本的 vue-cli 中是在 build 目录下 dev-sever.js 中添加数据接口
vue-cli 升级到 2.9.1 之后,把 webpack 升级到了 v3.6.0,里边去掉了 dev-server 和 dev-client 两个文件,改在 webpack.dev.conf.js 设置
1、找到 build 文件夹
2、找到文件,webpack.dev.conf.js 文件
3、找到 const portfinder = require('portfinder')
这句话添加下面代码
const axios = require('axios');
const express = require('express');
const apiRoutes = express.Router();
4、找到 const devWebpackConfig=merge(baseWebpackConfig,{}
里面的 devServer
添加代码
const devWebpackConfig = merge(baseWebpackConfig, {
module: {rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true})
},
// cheap-module-eval-source-map is faster for development
devtool: config.dev.devtool,
// these devServer options should be customized in /config/index.js
devServer: {
clientLogLevel: 'warning',
historyApiFallback: {
rewrites: [{ from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
],
},
hot: true,
contentBase: false, // since we use CopyWebpackPlugin.
compress: true,
host: HOST || config.dev.host,
port: PORT || config.dev.port,
open: config.dev.autoOpenBrowser,
overlay: config.dev.errorOverlay
? {warnings: false, errors: true}
: false,
publicPath: config.dev.assetsPublicPath,
proxy: config.dev.proxyTable,
quiet: true, // necessary for FriendlyErrorsPlugin
watchOptions: {poll: config.dev.poll,},
// 在这里添加一个 before 方法
before (apiRoutes) {apiRoutes.get('/api/getDiscList', (req, res) => {
// 这里是要链接的 api 地址
const url = 'https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg';
axios.get(url, {
headers: {
// 配置 api 地址 referer
referer: 'https://c.y.qq.com/',
// 配置 api 地址 host
host: 'c.y.qq.com'
},
params: req.query // 这是请求的 query
}).then((response) => {
// response 是 api 地址返回的,数据在 data 里。res.json(response.data)
}).catch((e) => {console.log(e);
})
});
app.use('/api', apiRoutes);
}
}
正文完