智乐兔

网络前端

  • 前后端分离使用localStorage替代cookies并封装到umi-request组成跨终端请求插件wldos-request

    前后端分离使用localStorage替代cookies并封装到umi-request组成跨终端请求插件wldos-request

    做过前后端分离的都知道,cookies不是万能的,为了兼容移动端可以采用localStorage,然后做一些封装实现类cookies功能。前端token等凭据的保存依赖于HTTP请求和响应,umi3.0的umi-request插件是个好用的插件,两者结合就成了本文所述的跨终端请求插件。 本插件包含两部分:localStorage封装和request封装。 localstorage封装代码如下: const expirefix = "__expires__"; /** * @desc 在localStorage基础上封装支持过期时间的storage,代替cookie。 * @auth ...

    查看全文

  • 基于Ant design pro react 实现的动态路由跳转三级级联写作工作台源码

    基于Ant design pro react 实现的动态路由跳转三级级联写作工作台源码

    这是最近在做的一个项目的写作工作台模块,风格类似于简书,但略有不同,测试版略显粗糙,不过已经可以使用了。本模块采用Ant design pro react v4脚手架开发完成,富文本编辑插件采用时下火热并且可商用的tinymce,采用本地化部署tinymce插件。与SPA不同的是,针对路由参数做了优化,在级联切换时URL会跟随变化,变化的是级联节点的ID,这样就满足了基本的seo需求。 另外,针对SPA客户端渲染问题做了seo优化,加入了title、keywords、description(TDK)标签,并没有采用SSR(服务端渲染),因为那违背了前后端分离的初衷,搞得前端比后端还重。Antd ...

    查看全文

  • 前后端分离前端使用localJStorage取代cookies

    前后端分离前端使用localJStorage取代cookies

    前后端分离后,面临着pc端和移动端的兼容问题,为了使用跨终端前端技术同时保证相同的开发接口,决定放弃APP侧没有的cookies,使用localStorage,并做了一些简单封装,使其和cookies类似: const expirefix = "__expires__"; /** * @desc 在localStorage基础上封装支持过期时间的storage,代替cookie。 * @author zhiletu.com * @version 1.0 */ export default class wldosStorage { constructor(pro ...

    查看全文

  • 记一次get request请求的header头信息

    记一次get request请求的header头信息

    当我们打开一个网站时,往往先触发首页的渲染,这一步一般是一个Get请求,通过F12打开开发者模式你会在Headers标签下看到类似以下的头信息: General Request URL: http://localhost:8000/ 这是说本次请求的URL是http://localhost:8000/ Request Method: GET 请求方法为GET方式,如果是表单提交可以用post,这里不必纠结何种方法,方法是人定的,用到再说…… Status Code: 304 Not Modified 状态码不是200 ok,说明本次请求浏览器使用了上次成功请求的本地缓存,即通过与服务器握手确定 ...

    查看全文

  • Authorized权限组件

    Authorized权限组件

    首先是使用权限组件定义有权限组件的渲染方式,直接上代码: import React from ‘react’; /** 导出对象别名为 RenderAuthorized */ import RenderAuthorized from ‘@/components/Authorized’; import { getAuthority } from ‘@/utils/authority’; import Redirect from ‘umi/redirect’; // 获取当前用户登录权限 const A ...

    查看全文

  • Ant Design Pro权限管理组件的使用

    Ant Design Pro权限管理组件的使用

    权限组件Authorized 是antd pro脚手架权限管理的基础,基本思路是对比当前权限与准入权限,决定展示请求的内容还是异常内容。 权限控制场景 控制菜单和路由显示 控制页面元素显示 登录时权限检查 首先看一下菜单和路由的权限控制,是通过配置路由设置准入权限的: {   path: ‘/’,   component: ‘../layouts/BasicLayout’,   Routes: [‘src/pages/Authorized’],   author ...

    查看全文

  • typescript与react融合

    typescript与react融合

  • 常用前端框架分析-html5培训

    常用前端框架分析-html5培训

    .net MVC请求流的通用步骤: 1:获取控制器。 2:依赖行为创建model对象,model通过转换调用数据访问层。 3:数据填充model后,传递到view层展现。 前端框架概览   应用包结构   lib包结构   product结构 各产品代码独立 方便管理、维护、扩展 通过打包发布 针对产品需求编码 ...

    查看全文

  • html代码实现强制禁止浏览器兼容模式打开

    html代码实现强制禁止浏览器兼容模式打开

    在JSF1.2中有浏览器兼容性问题。 在IE8浏览器以后版本,都有一个“兼容性视图”,让不少新技术无法使用。那么如何禁止浏览器自动选择“兼容性视图”,强制IE以最高级别的可用模式显示内容呢?下面就介绍一段HTML代码。 在IE8浏览器以后版本,都有一个“兼容性视图”,让不少新技术无法使用。那么如何禁止浏览器自动选择“兼容性视图”,强制IE以最高级别的可用模式显示内容呢?下面就介绍一段HTML代码。 X-UA-Compatible是一个设置IE浏览器兼容模式的属性,在IE8浏览器之后诞生。IE8或者IE9有很多种模式,比如,IE8有4种模式:IE5.5怪异模式、IE7标准模式、IE8几乎标准模 ...

    查看全文

  • vml、svg、canvas图像绘制技术

    vml、svg、canvas图像绘制技术

    1、VML:        VML的全称是Vector Markup Language(矢量可标记语言),矢量的图形,意味着图形可以任意放大缩小而不损失图形的质量,这在制作地图上有很大用途,VML只是被IE支持。 2、SVG:        可缩放矢量图形(Scalable Vector Graphics,SVG)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式。SVG由W3C制定,是一个开放标准。    &# ...

    查看全文

  • 第一个html5程序

    第一个html5程序

    HTML 5实战HTML 5中不仅增加了很多新的页面标记,而且与HTML 4相比,整体页面的结构也发生了根本的变化。下面使用HTML 5新结构来编写一个简单的页面。 实例1-2 Hello, World页面的实现 1. 功能说明 使用HTML 5结构编写一个HTML页面,在页面中输出“Hello, World”的字样。 2. 实现代码 在Dreamweaver CS5中新建一个HTML页面1-2.html,加入代码如代码清单1-2所示。代码清单1-2 我的第一个HTML 5页面 我的第一个HTML 5 页面 Hello,World 3. 页面效果 该页面在Chrome浏览器下执行后的页面 ...

    查看全文

  • 检测你的浏览器是否支持html5

    检测你的浏览器是否支持html5

    HTML 5 1. 功能说明 在HTML页面中插入一段HTML 5画布标记,当浏览器支持该标记时,将出现一个矩形;反之,则在页面中显示“该浏览器不支持HTML 5的画布标记!”的提示。 2. 实现代码 在Dreamweaver CS5中新建一个HTML页面1-1.html,加入代码如代码清单1-1所示。 代码清单1-1 检测浏览器是否支持HTML 5 检测浏览器是否支持HTML 5     该浏览器不支持HTML 5 的画布标记!     3. 页面效果 将页面文件1-1.html在IE 8浏览器中执行。由于IE ...

    查看全文

在线客服
在线客服 X

售前: 点击这里给我发消息
售后: 点击这里给我发消息

电话:15665730355