首页 > 系统相关 >使用Nginx部署VUE3+VITE项目时无法访问后端接口的一个情况

使用Nginx部署VUE3+VITE项目时无法访问后端接口的一个情况

时间:2024-01-10 15:33:31浏览次数:30  
标签:header 无法访问 underscores 接口 Nginx 404 VUE3

在使用VUE3作为前端,ABPVNEXT6.0作为后端框架。使用Nginx部署后无法访问api,接口报错404

找错思路很重要,网上找到了很多Nginx配置信息,但是都不起作用,即使更换服务器重新部署也无法生效

后来才发现,ABPNEXT对于未找到对应实体的报错就是404,按照正常的程序逻辑,404应该就是notfound,这一点让我走了很多弯路。

发现这一点就证明,实际上后端接口是通的,然后接口返回404,明白了这一点就要找到为什么会返回404

原因是,我在请求中的header中加上了租户信息,__tenant,的请求头,这个请求头在传到后端时并没有带上

所以需要在nginx配置时,加上允许请求头带下划线

add_header Access-Control-Allow-Headers 'Origin, X-Requested-With, Content-Type, Accept,__tenant';#服务端可以接收的header add_header Access-Control-Allow-Credentials, true;#服务端接收认证信息,如cookie underscores_in_headers on;
由官方解释可以看出,默认情况下,underscores_in_headers为off,表示当客户端请求头中带有下划线的字段默认将会被标识为无效字段。
所以需要将underscores_in_headers设置为on

标签:header,无法访问,underscores,接口,Nginx,404,VUE3
From: https://www.cnblogs.com/bugenniduobb/p/17956595

相关文章

  • 无法访问某ip: 端口
    可以在本地浏览器中通过访问本机IP地址和xxxx端口成功访问某服务页面,但在同一局域网中的另一台机器上无法访问,以下是一些可能的解决步骤:1检查网络连接:确保您的计算机和另一台机器都连接到同一局域网,并且网络连接正常。您可以尝试通过ping命令或其他网络工具来测试两台机器之......
  • vue3利用qrcode.vue并通过canvas合并图片
    <template><canvasid="canvas"width="300"height="400"></canvas><el-buttonstyle="margin-top:20px"type="danger"plain@click="downloadCode"......
  • 5分钟搞定vue3函数式弹窗
    前言最近接到一个需求,需要在一些敏感操作进行前要求输入账号和密码,然后将输入的账号和密码加到接口请求的header里面。如果每个页面都去手动导入弹窗组件,在点击按钮后弹出弹窗。再拿到弹窗返回的账号密码后去请求接口也太累了,那么有没有更简单的实现方式呢?函数式弹窗的使用场景......
  • 8、nginx反向代理优缺点分析
    1.概述反向代理(reverseproxy)方式是指用代理服务器来接受Internet上的连接请求,然后将请求转发给内部网络中的上游服务器,并将从上游服务器上得到的结果返回给Internet上请求连接的客户端,此时代理服务器对外的表现就是一个Web服务器。充当反向代理服务器是Nginx的一种常......
  • explorer.exe 无法访问指定设备路径或文件。你可能没有适当的权限访问该项目。
    亲测有效。电脑用的好好的,一会儿没用,突然只能找开部分软件,打不开文件夹和开始菜单了,弹出标题说的问题。试了其它软件如微信都可以使用,除了第三方下载的软件,系统自带的都打不开,会弹出提示,打开我的电脑和文件夹也是会弹出提示。并且下方任务栏WIN开始打不开,时钟和通知都点不开,不......
  • 实战-Docker 安装 Nginx
    使用Docker命令安装镜像官方文档:https://hub.docker.com/_/nginxmkdir-p/root/apps/nginxmkdir-p/opt/nginx/confdockerrun-d\--namenginx\-p80:80\-p443:443\-v/root/apps/nginx:/usr/share/nginx/html\-v/opt/nginx/conf:/etc/nginx/......
  • vscode设置vue3代码格式化
    下载插件可以使用Volar或Prettier  设置格式化时选用的插件mac:【shift】+【option】+【f】win:【shift】+【alt】+【f】 选择其中之一左下角选择【设置】 点击右上角的文件切换图标,可以切换到setting.json 实际使用假设这是默认代码状态 使用Prettier默认......
  • 部署nginx proxy manager (可视化nginx反向代理)
    官方网站https://nginxproxymanager.com/步骤所有步骤按照官方配置来即可,我们直接getstarted使用dockercompose方式安装我们创建一个文件夹,直接进去新建doker-compose.yml配置文件,然后写入以下内容,我的端口被占用了,修改了内部端口启动dockercomposeup-d然后一定......
  • windows 部署flask+tornado+nginx
    nginx下载地址http://nginx.org/en/download.html1,因windows对uwsgi支持不友好,flask自有服务不够强大,所以引用tornado服务fromtornado.wsgiimportWSGIContainerfromtornado.httpserverimportHTTPServerfromtornado.ioloopimportIOLoopfromrunimportappimport......
  • Vue学习计划-Vue3--初识Vue3,vite创建Vue3项目
    1.Vue3简介性能的提升打包大小减少41%初次渲染快55%,更新渲染快133%内存减少54%源码的升级使用Proxy代替defineProperty实现响应式重写虚拟DOM的实现和Tree-Shaking拥抱TypeScriptVue3可以更好的支持TypeScript新的特性CompositionApi(组合Api)setupref......