批量将put和delete改成post

最新推荐文章于 2023-12-08 11:31:14 发布

蹦哒

最新推荐文章于 2023-12-08 11:31:14 发布

阅读量1.4k

点赞数 1

文章标签： nginx 前端 java

本文链接：https://blog.csdn.net/weixin_42424283/article/details/128799626

版权

批量将put和delete改成post

业务场景

有个项目是运行较长时间的一个产品，项目运行较为稳定，也售卖于不少客户；

近期，有个客户单位的安全策略，不允许使用put和delete这两种请求方式，但是项目的接口所有的修改和删除都是用的是put和delete请求方式；

环境介绍

简要的说明下我的环境情况：

部署中间件nginx:使用的是8050端口部署前端；

后端接口是本地局域网的：192.168.1.6:9292
在这里插入图片描述

解决策略及其原理

项目使用的是axios请求库，于是想通过axios拦截器+nginx反向代理做文章，基本思路如下

axios拦截器

在axios中对put和delete请求，进行处理，让这2种请求携带特殊的请求头，该请求头是给nginx识别用的

 const method = (cfg.method || '').toUpperCase()
   if (process.env.NODE_ENV === 'production' && (method === 'PUT' || method === 'DELETE')) {
    cfg.method = 'post'
    cfg.headers['X-HTTP-Method-Override'] = method
   }
  return cfg

接口增加/api

.env.production文件中增加/api，此处的/api是给nginx反向代理的规则筛选用

# just a flag
ENV = 'production'

# base api
VUE_APP_BASE_API = 'http://192.168.1.10:8050/api'

配置nginx



server {
        listen        8050;
        server_name  localhostFile;
        #设置一个变量存储请求方法
        set $method $request_method;
        #如果携带axios拦截器里面维护的特殊请求头的话修改变量的值
      	if ($http_X_HTTP_Method_Override ~* 'DELETE') {
        	set $method DELETE;
        }
        if ($http_X_HTTP_Method_Override ~* 'PUT') {
           set $method PUT;
        }
        #设置全局代理的方法，如果使用代理则会使用
  	    proxy_method $method;
  	    #通配规则，所有规则都不匹配的情况下会进入此规则
        location / {
           try_files $uri $uri/ @router;
            root   "D:/software/php-study/phpstudy_pro/WWW/localhostFile";
            index index.php index.html error/index.html;
            error_page 400 /error/400.html;
            error_page 403 /error/403.html;
            error_page 404 /error/404.html;
            error_page 500 /error/500.html;
            error_page 501 /error/501.html;
            error_page 502 /error/502.html;
            error_page 503 /error/503.html;
            error_page 504 /error/504.html;
            error_page 505 /error/505.html;
            error_page 506 /error/506.html;
            error_page 507 /error/507.html;
            error_page 509 /error/509.html;
            error_page 510 /error/510.html;
            include D:/software/php-study/phpstudy_pro/WWW/localhostFile/nginx.htaccess;
            autoindex  off;
        }
        #拦截/api接口的请求，如果进入此规则，则proxy_method生效，
        location ^~ /api {
            proxy_pass http://192.168.1.6:9292/;
        }
        #防止vue项目F5刷新
		location @router {
            rewrite ^.*$ /index.html last;
        }
}