具体来说,后端的接口http://ip1:port1//steve/manager/users,前端的vue.config.js如何配置,以及如何发送axios请求
时间: 2023-06-11 07:08:59 浏览: 123
1. 配置后端接口:
在后端服务器上启动服务,并将接口地址设置为 http://ip1:port1/steve/manager/users。可以使用 Flask、Django 等框架搭建后端服务,代码如下:
```python
# Flask 示例代码
from flask import Flask, jsonify, request
app = Flask(__name__)
@app.route("/steve/manager/users", methods=["GET"])
def get_users():
# TODO: 处理获取用户信息的逻辑
return jsonify(users)
if __name__ == "__main__":
app.run(host="0.0.0.0", port=port1)
```
2. 配置前端的vue.config.js:
在 vue.config.js 中添加代理配置,将 /api 路径代理到 http://ip1:port1,代码如下:
```javascript
module.exports = {
devServer: {
proxy: {
'/api': {
target: 'http://ip1:port1',
changeOrigin: true,
pathRewrite: {
'^/api': '/steve/manager'
}
}
}
}
}
```
其中,/api 为前端请求的路径,http://ip1:port1 为后端接口的地址,/steve/manager 为后端接口的前缀。
3. 发送 axios 请求:
在前端组件中,可以使用 axios 发送请求,代码如下:
```javascript
import axios from 'axios'
axios.get('/api/users')
.then(response => {
console.log(response.data)
})
.catch(error => {
console.log(error)
})
```
其中,axios.get() 发送 GET 请求,/api/users 为请求的路径。如果请求成功,response.data 将返回后端返回的数据;如果请求失败,error 将返回错误信息。
阅读全文
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20241231044930.png)
![pdf](https://img-home.csdnimg.cn/images/20241231044930.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![docx](https://img-home.csdnimg.cn/images/20241231044901.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![zip](https://img-home.csdnimg.cn/images/20241231045053.png)
![-](https://img-home.csdnimg.cn/images/20241231044955.png)
![-](https://img-home.csdnimg.cn/images/20241231044930.png)
![-](https://img-home.csdnimg.cn/images/20241231044930.png)
![-](https://img-home.csdnimg.cn/images/20250102104920.png)