宝塔设置目录代理出现“不能同时设置目录代理和全局代理”

因为项目前台和后台是单独的两个服务, 本来想给前台网站加上一个后缀就直接访问后台了,可是通过宝塔设置时却出现了 “不能同时设置目录代理和全局代理” 错误,一想可能是因为前台的URL上下文已经设置了代理,所以宝塔不支持再次添加目录代理了。但是!宝塔只是负责简化nginx操作的,所以只需要手动修改nginx就可以实现这个功能。

首先找到宝塔的自定义nginx配置文件

 可以看到宝塔是引用某个网站下的所有配置文件,所以可以新增配置文件或修改原来的配置文件。

反向代理配置文件

location /后缀

{

    proxy_pass http:ip:port/二级目录;

    # proxy_cookie_path /admin /;

    proxy_set_header Host $host;

    proxy_set_header X-Real-IP $remote_addr;

    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

    proxy_set_header REMOTE-HOST $remote_addr;

    #请求发送时携带cookie信息

    # proxy_set_header Cookie $http_cookie;



    add_header X-Cache $upstream_cache_status;

        #Set Nginx Cache



    proxy_ignore_headers Set-Cookie Cache-Control expires;

    add_header Cache-Control no-cache;

}

### Vue 项目中反向代理配置不成功的解决方案 #### 1. 检查 `vue.config.js` 文件配置 确保在项目的根目录下创建了一个名为 `vue.config.js` 的文件,并按照如下方式配置: ```javascript module.exports = { devServer: { proxy: { '/api': { target: 'http://localhost:3000', changeOrigin: true, pathRewrite: { '^/api': '' } } } } } ``` 此配置会将 `/api` 开头的请求转发到目标服务器地址 `http://localhost:3000`,并且移除 URL 中的前缀 `/api`[^4]。 #### 2. 修改 Axios 默认基础URL 如果使用 Axios 进行 HTTP 请求,则需修改其默认的基础 URL 设置为 `/api` 或者其他指定路径。这可以通过全局配置来实现: ```javascript import axios from 'axios'; // 如果有多个 API 基础 URL, 可以通过这种方式定义不同的实例 const instance = axios.create({ baseURL: process.env.NODE_ENV === 'development' ? '/api' : 'https://your-production-api.com/api' }); export default instance; ``` 这样做的好处是在开发环境中可以利用相对路径配合 vue-cli 提供的服务端代理功能;而在生产环境下则直接指向实际部署后的服务地址。 #### 3. 处理静态资源加载问题 当启用反向代理后可能会遇到静态资源(如 JS CSS 文件)无法正常加载的情况。这是因为浏览器尝试从错误的地方获取这些资源。为了防止这种情况发生,在构建应用时应确保正确设置了公共路径 (`publicPath`) 属性: ```javascript module.exports = { publicPath: './', // 对于大多数情况来说这是推荐的做法 }; ``` 另外一种方法是调整 Nginx 或 Apache 等 Web Server 的配置,使其能够正确处理来自不同子路径下的请求[^2]。 #### 4. 调整宝塔面板中的 Nginx/Apache 配置 对于已经上线的应用程序而言,除了前端部分外还需要关注服务器层面如何支持跨域访问以及正确的路由解析。可以在宝塔面板里找到对应的站点设置页面,编辑该网站所使用的 web server (Nginx / Apache) 的配置文件,加入必要的 rewrite 规则或 location block 来匹配预期的行为模式[^1]。 例如针对 Nginx 添加如下片段: ```nginx location / { try_files $uri $uri/ /index.html; } location ^~ /api/ { proxy_pass http://backend_server_address/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; } ``` 以上措施可以帮助解决由于反向代理引起的各类问题,包括但不限于跨域请求失败、静态资源丢失等问题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值