前后端分离部署时如何保护前端代码不被匿名访问
2019-09-30 06:54:22来源:博客园 阅读 ()
前后端分离部署时如何保护前端代码不被匿名访问
背景
现在很多项目早就采用前后端分离的方式开发和部署了。前端代码部署在nginx服务器上,由nginx直接对外提供静态文件的服务,后端接口则由nginx做反向代理。
这本来是极为合理的部署方式,但对于一些需要登录才能进行访问的系统,负责安全的同事就会提出如下的疑虑:
index.html允许匿名访问,别有用心之人岂不是可以根据index里的<script>标签,拿到你所有的前端代码了?
看来要解决这个问题。
思路
为了保护前端首页代码,一次请求的流程应该是下面这样:
用户发起首页的请求,服务端发现用户没有登录,跳转到登录页;
用户发起首页的请求,服务端发现用户已经登录了,正常输出首页的内容。
注意,这里是服务端判断,而不是客户端判断。
判断有没有登录,毫无疑问是是我们的java后端才能做到的事情,但是首页是html文件,在nginx下面,用户请求它的时候还没到后端这里呢,怎么判断?
当然,你可以把前端文件移到后端tomcat下,由tomcat提供服务,但这样又走回老路了,这不是一个好方法,不推荐。
其实,在不改变部署架构的前提下,我们简单的通过nginx的配置和后端接口的配合,就可以达到目的。
简单来说,利用nginx的rewrite + error_page指令来实现。
- 首先,利用nginx的rewrite指令,把对index的请求,rewrite到后端某个接口上
- 后端这个接口里判断当前用户是否已经登录,如果没有登录,返回302跳转,跳转到授权页去登录
- 如果后端接口判断当前用户已经登录,则返回一个错误码给nginx(例如404),nginx利用error_page,指定404时,输出index.html的文件内容。
nginx示例配置如下:
server {
listen 80;
server_name www.abc.com;
recursive_error_pages on; #这个选项要开启
location / {
root /path/to/front-end;
}
location /api #交由tomcat处理
{
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Cookie $http_cookie;
proxy_pass http://localhost:9000;
}
location ~* ^(/|(/index\.html))$ {
#未登录的情况下,不允许访问首页,注意这里rewrite到一个location,而不是直接proxy_pass到后端接口。因为我要在@fallback里利用queryString
rewrite ^/(.*) /abcdefg?res=$request_uri;
}
#
location /abcdefg {
proxy_pass http://localhost:9000/api/home/check-user?res=$request_uri;
proxy_redirect off;
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_intercept_errors on;
error_page 404 = @fallback;
}
location @fallback {
if ($query_string ~* ^res=([^&]*)) {
set $path $1;
rewrite ^ /local/scripts$path;
}
}
location /local/scripts/ {
internal; #nginx内部才有效的location,外部无法通过/local/scripts/这个路径访问
alias /path/to/front-end/; #注意,最后有个/符号
error_page 404 =200 /local/scripts/index.html;
}
}
后端check-user接口示例如下:
@GetMapping("check-user")
public void checkUser(String res, HttpSession session, HttpServletRequest request, HttpServletResponse response) throws IOException {
if(session.getAttribute("User") == null){
response.sendRedirect("login?returnUrl=" + URLEncoder.encode(res, "UTF-8"));
return;
}
response.setStatus(HttpStatus.SC_NOT_FOUND);
}
原文链接:https://www.cnblogs.com/default/p/11581250.html
如有疑问请与原作者联系
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
- IDEA 设置热部署 Devtools 2020-06-10
- SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 后 2020-06-10
- Centos下Zookeeper的安装部署 2020-06-06
- Idea实现SpringBoot外置Tomcat的Web项目热部署(包含静态文 2020-06-04
- 初识Nginx——前后端发布 2020-06-03
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash