WEB前端技术

A collection of 10 posts

PHP相关

前后端分离踩坑记

基础架构 vue + element-ui + laravel session/token 登录状态保持，前后端分离引起的跨域问题。 要支持跨域通过一下操作 使用axios包，在main.js中添加如下代码： axios.defaults.withCredentials=true; Vue.prototype.$axios = axios; 在nginx 的配置中增加如下示例代码 add_header Access-Control-Allow-Origin http://localhost:8081; add_header Access-Control-Allow-Headers *; add_header Access-Control-Allow-Methods GET,POST,OPTIONS,PATCH,PUT; add_header Access-Control-Allow-Credentials true; axios
  • zhuanghd
    zhuanghd
zhuanghd • 3 min read
WEB前端技术

常见状态码解释

100 Continue：初始的请求已经接受，客户应当继续发送请求的其余部分 101 Switching Protocols：服务器将遵从客户的请求转换到另外一种协议 200 OK：一切正常，对GET和POST请求的应答文档跟在后面 201 Created：服务器已经创建了文档，Location头给出了它的URL。 202 Accepted：已经接受请求，但处理尚未完成。 203 Non-Authoritative Information：文档已经正常地返回，但一些应答头可能不正确，因为使用的是文档的拷贝 204 No Content：没有新文档，浏览器应该继续显示原来的文档。如果用户定期地刷新页面，而Servlet可以确定用户文档足够新，这个状态代码是很有用的 205 Reset Content：没有新的内容，但浏览器应该重置它所显示的内容。用来强制浏览器清除表单输入内容 206 Partial Content：客户发送了一个带有Range头的GET请求，
  • zhuanghd
    zhuanghd
zhuanghd • 5 min read
WEB前端技术

Vue 路由文件拆分、合并

场景：由于项目的不断发展，路由文件不断变大，不宜与维护，所以需要对路由文件进行拆分。 原来项目路由文件只有一个routes.js，路由配置都放在这个文件中。 修改后新增routes文件夹，文件夹下存放各个模块对应的路由文件，然后在统一到routes.js进行路由配置的合并以及路由的一些配置。话不多说，上代码。 routes.js 内容举例如下： //系统设置模块路由配置 import system_routes from './routes/system.js'; //行业趋势模块路由配置 import industry_routes from './routes/industry.js'; //报表模块路由配置 import report_routes from './routes/report.js';
  • zhuanghd
    zhuanghd
zhuanghd • 2 min read
WEB前端技术

浏览器标签页之间共享sessionStorage

// 为了简单明了删除了对IE的支持 (function() { if (!sessionStorage.length) { // 这个调用能触发目标事件，从而达到共享数据的目的 localStorage.setItem('getSessionStorage', Date.now()); }; // 该事件是核心 window.addEventListener('storage', function(event) { if (event.key == 'getSessionStorage') { // 已存在的标签页会收到这个事件 localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage)); localStorage.removeItem('sessionStorage'); } else if (event.key == 'sessionStorage' && !sessionStorage.length) { // 新开启的标签页会收到这个事件 var data
  • zhuanghd
    zhuanghd
zhuanghd • 1 min read