前后端分离, 前端如何防止直接输入URL进入页面?
转自:https://blog.csdn.net/weixin_41829196/article/details/80444870
前后端分离,如何防止用户直接在地址栏输入url进入页面,也就是判断用户是否登录,没有,则直接跳转到登录页,后台可以用session记录用户登陆的状态,疑问的是前端每次ajax请求,都要做状态判断么,没登录就location.href="login.html",还是有什么别的写法?请教大神,重点想知道前端是如何写的,求demo, 另外就是单页面应用上,前端又是如何操作的?
answer:
是的,每个 Ajax 都需要对状态进行判断,但这个判断可以由后端来做。
具体的做法是通过 cookie 做的,也就是我们在登录页登录后,由后端返回一个带有 Set-Cookie 的返回头来种 cookie。那么在 cookie 失效前,发 Ajax 请求都是会自动带有这个 cookie 的,这时后端就能进行判断。
一旦这个 cookie 失效,后端在请求返回时应该用某种方式告诉前端,符合 HTTP 规范的做法是返回一个 401 状态码,这个时候前端通过拦截器(如 axios 的 interceptor)进行统一处理,跳转到登录页。
---------------------
作者:HainesFreeman
来源:CSDN
原文:https://blog.csdn.net/weixin_41829196/article/details/80444870
版权声明:本文为博主原创文章,转载请附上博文链接!
前后端分离, 前端如何防止直接输入URL进入页面?的更多相关文章
- 前后端分离中,Gulp实现头尾等公共页面的复用
前言 通常我们所做的一些页面,我们可以从设计图里面看出有一些地方是相同的.例如:头部,底部,侧边栏等等.如果前后端分离时,制作静态页面的同学,对于这些重复的部分只能够通过复制粘贴到新的页面来,如果页面 ...
- 前后端分离中,gulp实现头尾等公共页面的复用 前言
前言 通常我们所做的一些页面,我们可以从设计图里面看出有一些地方是相同的.例如:头部,底部,侧边栏等等.如果前后端分离时,制作静态页面的同学,对于这些重复的部分只能够通过复制粘贴到新的页面来,如果页面 ...
- 基于NodeJS进行前后端分离
1.什么是前后端分离 传统的SPA模式:所有用到的展现数据都是后端通过异步接口(AJAX/JSONP)的方式提供的,前端只管展现. 从某种意义上来说,SPA确实做到了前后端分离,但这种方式存在两个问题 ...
- WebAPI 实现前后端分离
随着Web技术的发展,现在各种框架,前端的,后端的,数不胜数.全栈工程师的压力越来越大. 现在的前端的框架,既可以做各种Web,又可以做各种APP,前端框架更新换代越来越快,越来越多. 传统的模式 前 ...
- WebAPI 实现前后端分离的示例
转自:http://www.aspku.com/kaifa/net/298780.html 随着Web技术的发展,现在各种框架,前端的,后端的,数不胜数.全栈工程师的压力越来越大. 现在的前端的框架, ...
- 前后端分离时代,Java 程序员的变与不变!
事情的起因是这样的,有个星球的小伙伴向邀请松哥在知乎上回答一个问题,原题是: 前后端分离的时代,Java后台程序员的技术建议? 松哥认真看了下这个问题,感觉对于初次接触前后端分离的小伙伴来说,可能都会 ...
- 前后端分离之前端项目构建(grunt+require+angular)
前言 前段时间做了一个项目,前端开发页面,然后把代码给到后端同学,后端同学通过vm再来渲染页面.后来才发现,这种方式简直是太low了,因为前端代码在服务端同学那里,每次前端需要更改的时候都需要去到服务 ...
- 【开源】分享一个前后端分离方案-前端angularjs+requirejs+dhtmlx 后端asp.net webapi
一.前言 半年前左右折腾了一个前后端分离的架子,这几天才想起来翻出来分享给大家.关于前后端分离这个话题大家也谈了很久了,希望我这个实践能对大家有点点帮助,演示和源码都贴在后面. 二.技术架构 这两年a ...
- .netcore+vue+elementUI 前后端分离---支持前端、后台业务代码扩展的快速开发框架
框架采用.NetCore + Vue前后端分离,并且支持前端.后台代码业务动态扩展,框架内置了一套有着20多种属性配置的代码生成器,可灵活配置生成的代码,代码生成器界面配置完成即可生成单表(主表)的增 ...
随机推荐
- vue 2.0创建新项目
参考链接 https://segmentfault.com/a/1190000011275993 背景在安装完node的基础上,机器什么都没安装参考上述链接 一.下载vue $ cnpm insta ...
- (转)expect命令脚本语言介绍及生产实践
原文:http://www.fblinux.com/?p=526 Expect介绍 expect是一个用来实现自动交互功能的软件套件,是用来实现自动和交互式任务程序进行通信,无需人的手工干预.比如SS ...
- 理解session和cookie
Session 与 Cookie 的作用都是为了保持访问用户与后端服务器的交互状态.它们有各自的优点,也有各自的缺陷,然而具有讽刺意味的是它们的优点和它们的使用场景又是矛盾的.例如,使用 Cookie ...
- Linux将MySQL数据库目录挂载至新数据盘
对于Linux系统来说,挂载磁盘的方法其实都大同小异,所以本文以CentOS系统为例,介绍下Linux系统磁盘挂载方法,前面大部分内容源于天翼云的论坛.1.查看磁盘情况使用命令fdisk -l # 列 ...
- robots 小记
简介 网站所有者使用/robots.txt文件向网站机器人提供有关其网站的说明;这称为 Robots Exclusion Protocol.它的工作原理是这样的:robot 想要访问一个网站URL,比 ...
- Ubuntu安装Python的mysqlclient
介绍 本人想在Ubuntu上开发Python程序,使用MySQL数据库. 安装环境: Ubuntu14.04 安装MySQL数据库 具体步骤如下: apt-get update apt-get ins ...
- linux下创建网卡配置
大家都知道linux系统一般作为服务器来用,而且很多情况的设置都是需要通过字符界面修改配置文件来设置.比如说配置网卡IP是修改/etc下面的 ifcfg-eth0,如果配置文件没有了怎么办呢?本经验以 ...
- Scrapy框架学习(一)Scrapy框架介绍
Scrapy框架的架构图如上. Scrapy中的数据流由引擎控制,数据流的过程如下: 1.Engine打开一个网站,找到处理该网站的Spider,并向该Spider请求第一个要爬取得URL. 2.En ...
- 忘记root密码的解决方法——进入单用户模式修改
(1)在系统还在读秒的时候按任意键,你会看到如下界面: 然后按下‘e’
- 【curl】Linux下命令行curl详解
在Linux中curl是一个利用URL规则在命令行下工作的文件传输工具,可以说是一款很强大的http命令行工具.它支持文件的上传和下载,是综合传输工具,但按传统,习惯称url为下载工具. 语法:# c ...