1. 前后端口不一致的原因
    前后端口不一致是指前端和后端的服务端口不一致,前端和后端的服务端口是各自独立的,通常情况下,前端服务的端口号是80或者8080,而后端服务的端口号是3000或者8000等。

  2. 解决前后端口不一致的方法
    1)使用nginx反向代理:Nginx反向代理是一种代理服务器,可以将外部的请求转发到内部的服务器,从而实现前后端口不一致的解决方案,步骤如下:

4. 配置nginx,将外部的请求转发到内部的服务器,如:

location / {
  proxy_pass http://127.0.0.1:8000;
}

2. 启动nginx服务:

sudo service nginx start

3. 访问127.0.0.1即可访问内部的服务:

curl 127.0.0.1

2)使用vue-cli的proxyTable配置:Vue-cli提供了一个proxyTable的配置,可以将外部的请求转发到内部的 服务器,从而实现前后端口不一致的解决方案,步骤如下:

1. 配置proxyTable,将外部的请求转发到内部的服务器,如:

proxyTable: {
  '/api': {
    target: 'http://127.0.0.1:8000',
    changeOrigin: true
  }
}

2. 运行vue-cli:

npm run dev

3. 访问127.0.0.1即可访问内部的服务:

curl 127.0.0.1

  1. 结论
    前后端口不一致的解决方案有很多,可以使用nginx反向代理实现,也可以使用vue-cli的proxyTable配置实现,具体的实现方案取决于实际的项目情况。
Logo

前往低代码交流专区

更多推荐