<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[Tiny2017的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/Tiny2017</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; Tiny2017]]></copyright><item><title><![CDATA[前端模块化CommonJs、ESM、AMD总结]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/142679657</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/142679657</guid><author>Tiny2017</author><pubDate>Thu, 03 Oct 2024 00:33:21 +0800</pubDate><description><![CDATA[历史上，JavaScript 一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。ES6 在语言标准的层面上，实现了模块功能，而且实现得相当简单，完全可以取代 CommonJS 和 AMD 规范，成为浏览器和服务器通用的模块解决方案。通过对 CommonJs、CMD、AMD 进一步处理，它没有自己专有的规范，是集结了 CommonJs、CMD、AMD 的规范于一身。语句输出的接口，与其对应的值是动态绑定关系，即通过该接口，可以取到模块内部实时的值。]]></description><category></category></item><item><title><![CDATA[常见前端安全问题 XSS CSRF SQL注入]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/142662585</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/142662585</guid><author>Tiny2017</author><pubDate>Mon, 30 Sep 2024 19:13:59 +0800</pubDate><description><![CDATA[已经通过被保存在用户浏览器中的cookie进行认证的用户将在完全无知的情况下发送HTTP请求到那个信任他的站点，进而进行用户不愿做的行为。XSS是指恶意攻击者利用网站没有对用户提交数据进行转义处理或者过滤不足的缺点，进而添加一些代码，嵌入到web页面中去，使别的用户访问都会执行相应的嵌入代码。SQL注入是比较常见的网络攻击方式之一，主要是通过把SQL命令插入到Web表单递交或输入域名或页面请求的查询字符串，实现无帐号登录，甚至篡改数据库。但增加验证码降低了用户的体验，网站不能给所有的操作都加上验证码。]]></description><category></category></item><item><title><![CDATA[ruoyi若伊项目（vue前后端分离）下载搭建]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/141889327</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/141889327</guid><author>Tiny2017</author><pubDate>Wed, 04 Sep 2024 15:18:40 +0800</pubDate><description><![CDATA[RuoYi-Vue。]]></description><category></category></item><item><title><![CDATA[关于安装MySQL遇到的问题]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/141813072</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/141813072</guid><author>Tiny2017</author><pubDate>Mon, 02 Sep 2024 13:18:42 +0800</pubDate><description><![CDATA[MySQL Cluster CGE（Commercial Grade Edition）是一个专为高可用性、高吞吐量、低延迟的应用场景设计的MySQL版本。， 在数据库建立、 运用和维护时对数据库进行统一控制、统一管理， 使用户能方便地定义数据和操纵数据， 并能够保证数据的安全性、 完整性、 多用户对数据的并发使用及发生故障后的系统恢复。随着数据库技术的发展，人们就想到一些基础的操作：比如新建、删除、查询、修改数据库或者表能不能不用自己写SQL语句，把这些模版化的东西做成软件让开发人员的工作更加方便。]]></description><category></category></item><item><title><![CDATA[JS 常用数组对象类型转换]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/125320279</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/125320279</guid><author>Tiny2017</author><pubDate>Thu, 16 Jun 2022 17:39:23 +0800</pubDate><description><![CDATA[JS常用数组对象结果转换]]></description><category></category></item><item><title><![CDATA[关于使用axios请求带参数有数组时请求报错]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/124869149</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/124869149</guid><author>Tiny2017</author><pubDate>Thu, 19 May 2022 19:13:03 +0800</pubDate><description><![CDATA[问题描述
封装axios请求，使用get请求时突然报错，对比了url发现，参数中有个参数是数组，请求时转url会保留"[“和”]"。
当参数中包含数组时, 转换的URL会保留"["和"]"
let params = {
	name: Tom,
	query: [
		{
			filed: 'age'
		}
	]
}

原因
去查了一下发现，RFC3986标准是保留方括号的

然后去axios github上看了下，之前就有人提出过方括号的问题，而且我目前使用的axios版本很低，所以估计当时版本axio]]></description><category></category></item><item><title><![CDATA[ant-design-vue vue2图标选择器]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/120706038</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/120706038</guid><author>Tiny2017</author><pubDate>Mon, 11 Oct 2021 16:32:47 +0800</pubDate><description><![CDATA[基于vue2和ant-design-vue封装的一个图标选择器
1.效果图

2.代码
iconPicker.vue
&lt;template&gt;
  &lt;div&gt;
    &lt;a-popover
        :trigger="trigger"
        placement="bottomLeft"
        v-model="visible"
      &gt;
        &lt;template slot="title"&gt;
          &lt;a]]></description><category></category></item><item><title><![CDATA[canvas 的save()和restore()]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/118994366</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/118994366</guid><author>Tiny2017</author><pubDate>Thu, 22 Jul 2021 11:10:21 +0800</pubDate><description><![CDATA[save()保存当前Canvas画布状态并放在栈的最上面，可以使用restore()方法依次取出。
注意：栈是先入后出，每次restore()取出的画布状态都是最近save()的画布状态
保存的画布状态有以下这些：
当前矩阵变换。参见transform()等。
当前剪裁区域。参见clip()。
当前虚线设置。参见setLineDash()。
以及下面这些属性的值：strokeStyle，fillStyle，globalAlpha，lineWidth，lineCap，lineJoin，miterLimit，l]]></description><category></category></item><item><title><![CDATA[VSCode运行TypeScript]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/118608430</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/118608430</guid><author>Tiny2017</author><pubDate>Fri, 09 Jul 2021 16:06:28 +0800</pubDate><description><![CDATA[1.文档
https://www.tslang.cn/docs/handbook/advanced-types.html
http://ts.xcatliu.com/
2.步骤
全局安装ts-node包
javascript 		npm install typescript ts-node @types/node@* -g
直接运行自己的ts文件  tsc index.ts

然后可能会报错

可能是vscode策略受限制，那么以管理员身份重新打开vscode，到控制台依次输入：
get-Execution]]></description><category></category></item><item><title><![CDATA[跨域的理解和解决办法]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/118492538</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/118492538</guid><author>Tiny2017</author><pubDate>Mon, 05 Jul 2021 17:46:24 +0800</pubDate><description><![CDATA[一、跨域是什么？
跨域，指的是浏览器不能执行其他网站的脚本
当前页面的url 与 请求url的协议、域名、端口三个其中任意一个不同时都会产生跨域。




当前url
请求的url
是否跨域
跨域原因




https://www.baidu.com
https://www.baidu.com/a.js
否
同源


https://www.baidu.com
http://www.baidu.com/a.js
是
协议不同，一个是https，一个是http


https://www.baidu.com]]></description><category></category></item><item><title><![CDATA[原生JS 文件上传]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/115550913</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/115550913</guid><author>Tiny2017</author><pubDate>Fri, 09 Apr 2021 15:12:52 +0800</pubDate><description><![CDATA[目的：实现上传图片功能
效果：


思路：用input标签自带的上传，先隐藏掉，给上传按钮添加点击事件，绑定input的点击事件
代码：
//html
&lt;input ref="img-upload-input" class="img-upload-input" type="file" accept=".png, .jpg" @change="submitUpload"&gt;
&lt;el-button style="margin-top: 20px" type="primary" @click="h]]></description><category></category></item><item><title><![CDATA[mapv的使用记录]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/114917970</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/114917970</guid><author>Tiny2017</author><pubDate>Wed, 17 Mar 2021 10:56:08 +0800</pubDate><description><![CDATA[1.api
2.官方示例
3.在leaflet中使用
引入：
方法一：&lt;script src="http://mapv.baidu.com/build/mapv.js"&gt;&lt;/script&gt;
方法二：cnpm install mapv 导入mapv的依赖

import { tiandituTileLayer } from '@/libs/wmtslayer/L.TiandituTileLayer'
import 'mapv'
import * as mapv from 'mapv'
]]></description><category></category></item><item><title><![CDATA[vue web视频播放的一个记录]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/114870353</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/114870353</guid><author>Tiny2017</author><pubDate>Tue, 16 Mar 2021 10:42:43 +0800</pubDate><description><![CDATA[1.播放器选择
1.dplayer
2.liveplayer（此处选择这个）liveplayer
2.安装
npm install --save-dev video.js
npm install @liveqing/liveplayer
npm install flv.js

3.liveplayer在vue中使用
3.1 复制依赖文件
安装 copy-webpack-plugin 插件, npm install copy-webpack-plugin@4.6.0,
编辑你的 webpack.config.]]></description><category></category></item><item><title><![CDATA[webgis学习]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/113243347</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/113243347</guid><author>Tiny2017</author><pubDate>Wed, 27 Jan 2021 17:13:34 +0800</pubDate><description><![CDATA[1.掘金上的一篇webgis介绍：一个页面仔必备的 WebGIS
2.常用坐标系汇总：常用坐标系汇总
3.WMTS服务初步理解与读取： WMTS
4.WebGIS前端地图显示之根据地理范围换算出瓦片行列号的原理：根据地理范围换算出瓦片行列号的原理
5.天地图OGC WMTS服务规则：天地图OGC WMTS服务规则

6.leaflet 插件Proj4Leaflet：Proj4Leaflet
这个Leaflet插件增加了对使用Proj4js支持的投影的支持 。
Leaflet内置了对Spherical Mer]]></description><category></category></item><item><title><![CDATA[前端开发笔记]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/112918900</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/112918900</guid><author>Tiny2017</author><pubDate>Thu, 21 Jan 2021 11:19:21 +0800</pubDate><description><![CDATA[js全屏插件https://github.com/sindresorhus/screenfull.js/
下载
$ npm install screenfull
引入
import screenfull from 'screenfull'
使用
fullScreen() {
        let ele = this.$refs.mainIframe
        this.$refs['btn_full'].addEventListener('click', () =&gt; {
          ]]></description><category></category></item><item><title><![CDATA[vue JS 引用图片]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/111316577</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/111316577</guid><author>Tiny2017</author><pubDate>Thu, 17 Dec 2020 18:02:33 +0800</pubDate><description><![CDATA[VUE CLI中，静态资源可以通过两种方式进行处理：Vue Cli 文档
1.在 JavaScript 被导入或在 template/CSS 中通过相对路径被引用。这类引用会被 webpack 处理。
&lt;img src="..."&gt;,background: url(...) 和 CSS @import 的资源 URL 都会被解析为一个模块依赖。

如url(./image.png) 会被翻译为 require(’./image.png’)
&lt;img src="./image.png"&gt]]></description><category></category></item><item><title><![CDATA[vue symbol svg-sprite-loader 使用图标]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/111051495</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/111051495</guid><author>Tiny2017</author><pubDate>Fri, 11 Dec 2020 19:19:04 +0800</pubDate><description><![CDATA[原理：
symbol + use:xlink:href
svg-sprite-loader 生成雪碧图
require.context 动态引入文件
包装组件
1.引入svg-sprite-loader  ：npm install svg-sprite-loader
2.最安全合理的做法是使用 webpack 的 exclude 和 include ，让svg-sprite-loader只处理你指定文件夹下面的 svg，url-loaer只处理除此文件夹之外的所以 svg，这样就完美解决了之前冲突的问题。
]]></description><category></category></item><item><title><![CDATA[前端风格指南]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/111030386</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/111030386</guid><author>Tiny2017</author><pubDate>Fri, 11 Dec 2020 10:46:42 +0800</pubDate><description><![CDATA[1.css命名规范

特别声明：此篇文章由David根据csswizardry的英文文章原名《MindBEMding – getting your head ’round BEM syntax》进行翻译，整个译文带有我们自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。如需转载此译文，需注明英文出处：http://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax以及作者相关信息
——作者：csswizardr]]></description><category></category></item><item><title><![CDATA[css布局方式，实现四宫格，九宫格，16宫格等切换]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/110523999</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/110523999</guid><author>Tiny2017</author><pubDate>Thu, 03 Dec 2020 20:34:31 +0800</pubDate><description><![CDATA[1.借助absolute方位值，实现自适应的网格布局，用伪元素间隔
absolute+四个方位值撑开局面、float+宽度百分比实现横向排列。高度百分比实现自适应。
最外层的父元素使用absolute负责占位，给子元素们把空间拉开，或者固定宽高也行
效果图

ul{
      height: 100%;
      padding: 0;
      position:absolute;
      left:0;
      top:0px;
      right:0;
      bottom:0;]]></description><category></category></item><item><title><![CDATA[Vue Axios Consten-Type与文件上传]]></title><link>https://blog.youkuaiyun.com/Tiny2017/article/details/109671838</link><guid>https://blog.youkuaiyun.com/Tiny2017/article/details/109671838</guid><author>Tiny2017</author><pubDate>Fri, 13 Nov 2020 11:48:43 +0800</pubDate><description><![CDATA[遇到问题：http请求415错误Unsupported Media Type
提交媒体类型不对，然后更改headers的Constent-Type，同时提交的数据类型要是Json字符串
const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 30 * 1000,
  transformRequest: [function(data) {
  	// 提交的数据类型要是Json字符串
      re]]></description><category></category></item></channel></rss>