I-T枭-CSDN博客

原创小程序云函数实现客服消息回复

负责的小程序最近上线了支付功能,但是因为虚拟支付规范,不能直接购买所以退而求其次,采用了客服消息自动回复购买链接的方式#实验环境:MacOS(10.13.6) 微信开发者工具(Nightly v1.02.1908222)#实现方法1.项目配置修改项目根目录新建文件夹functions作为云函数根目录project.config.json文件追加配置"cloudfunctionRoot": "functions/","cloud": true,2.微信开发者工具中点击云开发

2021-08-12 17:36:05 914

原创 uniapp动态修改样式_Vue如何动态修改CSS变量

想要动态修改css样式就得能动态的给<style></style>赋值，可是<style></style>里面又写不了变量（有可能可以但是我不会。。），所以想了个这种办法，通过给模板文件的:style动态复制从而间接的修改<style></style>里面的变量<template> <div :style="{'--color':'red'}"></div></templat...

2021-07-06 17:02:22 4193

原创 h5各种定位方式(浏览器，公众号，小程序，App)

h5各种定位方式(浏览器，公众号，小程序，App)html5 geolocation 获取地理定位遇到 POSITION_UNAVAILABLE不管是原生iOS APP嵌入单个h5页面，还是都是h5页面的webapp也好，只要涉及到定位都会遇到这个情况。当请求iOS开始定位的时候，会弹出一个提示框，提示你是否"允许"定位，允许定位继续下一步，如果一不小心点了下"不允许"之后，会发现，下次进到这个h5之后再也不会提示请求定位权限的提示框了。"不允许"被缓存了下来。再次调用 geolocation

2021-05-13 12:28:37 3339

原创 js通过判断h5页面是否内嵌在(app,小程序,微信)内

testBrowser() { let ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == 'micromessenger') return 'weixin'; // 微信公众号 if (ua.match(/dsapp/i) == 'isapp') return 'other_app'; // 外部-app //判断ua中是否含有和app端约定好的标识dsapp ...

2021-05-08 11:20:11 3141

原创 uni-app整合vant、nuxt

创建uni-app移动端项目使用uni-cli下载vue create -p dcloudio/uni-preset-vue my-project下载Nuxt框架 ,无需使用create-nuxt-app. 脚手架yarn add nuxt配置package.json文件{ "name": "my-app", "scripts": { "dev": "nuxt", "build": "nuxt build", "generate": ...

2021-04-30 16:55:32 2790 16

原创 canvas跨域绘画图片

尽管不通过 CORS 就可以在 Canvas 画布中使用图片，但是这会污染画布。一旦画布被污染，你就无法读取其数据。例如，你不能再使用画布的 toBlob(), toDataURL() 或 getImageData() 方法，调用它们会抛出安全错误。这种机制可以避免未经许可拉取远程网站信息而导致的用户隐私泄露。HTML 规范中图片有一个 crossorigin 属性，结合合适的 CORS 响应头，就可以实现在画布中使用跨域 <img> 元素的图像。crossOrigin/CORS

2021-04-26 15:43:28 611

原创 uniapp弹出软键盘获取键盘高度不准确，显示输入框

1、问题背景　　在评论或者发布内容时经常会用到这样的设计，输入框弹起，然后底部定位的一块区域（通常用于选择一些附加信息，比如图片、话题、表情等）也随之弹起，定位在软键盘上方方便用户选择。但是一般点击输入框，软键盘自动弹起，就会覆盖掉底部定位的元素，而我们是需要底部定位的元素跟随软键盘一起弹起的，这样就方便用户输入的时候也可以选择其他附加信息。2、我们可以通过uniapp提供的接口获取到软键盘的高度　　uni.onKeyboardHeightChange(CALLBACK)：监听键盘高度变化，返回

2021-04-19 21:23:02 11829 1

原创 h5-video自动播放兼容性处理

综上所述：pc端加muted基本浏览器都兼容 ios端加muted 除uc与QQ，微信，其余兼容 android端加 muted 基本浏览器都兼容

2021-03-15 14:51:56 2653

原创 canvas绘图按照contain或者cover方式适配并居中显示

canvas绘图时drawImage，需要绘制的图片大小不同，比例各异，所以就需要像html+css布局那样，需要contain和cover来满足不同的需求。contain保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。图片按照contain模式放到固定盒子的矩形内，则需要对图片进行一定的缩放。原则是：如果图片宽高不等，使图片的长边能完全显示出来，则原图片高的一边缩放后等于固定盒子对应的一边，等比例求出另外一边，如果图片宽高相等，则根据固定盒子的宽

2021-02-08 16:06:06 749 1

原创 Nuxt使用Keep-alive缓存页面

Nuxt 项目中，页面缓存的问题一直是比较头疼的一件事，几乎都是很粗暴的告诉你使用 keep-alivelayouts 添加 keep-alivedefault.vue<template> <div> <nuxt :keep-alive="isKeepActive" :keep-alive-props="{ include: includeArr }" :class="applets === 4 ? 'isCarApp' : ''" /> .

2020-12-11 11:58:51 3335 2

原创生产海报插件

vue canvas 生成微信分享海报前言小可爱们是不是还在为画Canvas 而烦恼，是不是心烦各式各样的分享图如何快速生成。使用Vue Canvas Poster 你可以用简单的css属性按照一定的规范画出Canvas图。比如你可以写一段文字，给它设置大小颜色对齐方式，你也可以画出一张图片，设置如何裁剪，你甚至可以画出渐变的矩形，给它设置边框，圆角。Vue Canvas Poster ????&主要特性：绘制文本(换行、超出内容省略号、中划线、下划线、文本加粗)

2020-12-10 17:56:18 245

原创调用摄像头(html5)显示画面

注意：调用摄像头chrom或其他浏览器需要打开摄像权限getUserMedia API为用户提供访问硬件设备媒体（摄像头、视频、音频、地理位置等）的接口，基于该接口，开发者可以在不依赖任何浏览器插件的条件下访问硬件媒体设备。getUserMedia API最初是navigator.getUserMedia，目前已被最新Web标准废除，变更为navigator.mediaDevices.getUserMedia()，但浏览器支持情况不如旧版API普及。MediaDevices.getUserMe.

2020-11-30 20:17:48 2156 2

原创如何部署Nginx静态web项目

环境准备windows nginx web项目资源包准备Nginx进入解压后的目录拷贝web项目至nginx目录将web项目拷贝进来修改Nginx配置进入conf，使用notepad编辑，编辑如下。监听8100端口，root为layuimini启动nginx双击nginx.exe启动，会发现无任何提示，其实nginx已启动成功！浏览器访问访问http://localhost:8100至此，web项目部署成功！部署至linux服务器同理注：Ja.

2020-11-23 10:26:37 540

原创移动端video标签自动播放(兼容ios，微信)

页面使用如下：使用如上方法之后在其他端都可正常播放，只有iOS没办法自动播放，于是就Google开始寻找方法最后找到方法如下：<video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered video" muted autoplay preload loop x5-video-player-fullscreen="true" x5-playsinline

2020-11-20 13:58:46 10170 2

原创 uni-app使用Vant组件

前言vant ui有h5版和微信小程序版。其h5版只能用于h5，其微信小程序版（vant weapp）可用于微信和App，从uni-app 2.4.7起，H5和QQ小程序也支持了微信小程序组件。使用步骤下载代码在项目根目录下新建wxcomponents目录，此目录应该与components目录同级。直接通过git下载vant-weapp最新源代码，并将dist目录拷贝到新建的wxcomponents目录下，并重命名dist为vant-weapp。在...

2020-11-19 12:16:13 7989 3

原创移动端吸顶效果(小程序，h5)

前言：实例源码：#sticky-nav { position : sticky ; top : 100px ;}

2020-11-16 17:43:52 1201

原创小程序rich-text style设置

小程序rich-text style设置，环境Uni-appcomputed: { contentMobile() { // 小程序中rich-text 样式设置需要通过正则给富文本添加样式 if (detail.contentMobile) return detail.contentMobile.replace( /<img/g, '<img style="width:100%" '

2020-11-10 11:00:32 1014

原创 chrome调试h5移动端(含android,ios)

chrome调试h5移动端chrome调试(window+android)需要条件：1.安卓开发人员需要对你页面调试得webview添加setWebContentsDebuggingEnabled得静态方法。 2.windows电脑可以爬~梯子或者安装chrome-inspect离线开发者工具包梯~子工具：https://cp.greennode.info chrome-i...

2020-11-10 10:27:49 3610

原创 VUE使用 wx-open-launch-app 组件开发微信打开APP功能

template.vue:<template> <div class="page"> <div class="container"> <div class="btn-group" @click="launch" v-if="wechatState"> <wx-open-launch-app id="launch-btn" :extinfo="dataStr" ...

2020-11-03 10:29:23 10842 11

原创 mac 给 iPhone 充电一直闪跳

mac 给 iPhone 充电一直闪跳解决iPhone连上MAC之后会不断地断开又连上，断开又连上问题。 sudo killall -STOP -c usbd不会对mac 产生其他影响！再次声明，不要随便将我文章拉入，什么专题之类的！详细步骤:使用： control + 空格同时按下； 2.在步骤一后，会出现一个搜索框，输入terminal（终端）直接回车键； 3.步骤2后，进入终端，将 sudo killall -STOP -c usbd 复制进去，回车-》输入密码-》回车-》就ok

2020-10-20 10:47:58 1137

原创获取视频第一帧作为封面

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://cdn.jsdelivr.n.

2020-09-24 10:12:28 3183

原创 vue-cli使用vscode编辑器如何自动eslint检测

1：忽略不检测文件解决方法：在压缩代码前后加上/* eslint-disable */，生效

2020-09-18 15:40:29 994

原创 git拉取远程分支到本地

查看远程分支：git branch -a查看本地分支：git branch场景：假如现在远程分支有一个：demo我们本地没有；··1.查看远程分支有哪些：git branch -a2.然后切换到这个分支：git checkout remotes/origin/demo出来了这么一段话：$ git checkout remotes/origin/demoNote: checking out 'remotes/origin/demo'.You are in 'detac

2020-09-09 09:19:12 980

原创 vue2 是怎么实现响应式的

今天看了一下vue到底是怎么实现响应式的，发现特别简单，就是使用了 Object.defineProperty 这个函数来进行监听，var vm = {}; var data = { name: 'zhangsan', age: 18 } var key , value; for ( key in data) { .

2020-08-18 17:08:05 305

原创解决 IE 不支持 getElementsByClassName() 的方法

//create method getElementsByClassName for document if(!document.getElementsByClassName){ document.getElementsByClassName = function(className, element){ var children = (element || document).getElementsByTagName('*'); v.

2020-08-17 17:06:46 511

原创微信小程序用canvas画图并分享

<canvas style='width:{{canvasWidth}}px;height:{{canvasHeight}}px' canvas-id='myCanvas'></canvas><button open-type='share'>分享</button>【js部分】 var ctx = "" // 用于获取canvas var leftMargin = "" //文字距离左边边距 var topMargin = "" .

2020-08-14 15:16:59 625

原创 vue-解决弹出蒙层滑动穿透问题（IOS穿透）

【实现思路】　　1. vue提供的@touchmove.prevent可以用来阻止滑动，但是这个方法会对其内的子div的滑动事件也禁止掉了，这样会导致中间文字无法滑动。如果没有中间滑动需求，用@touchmove.prevent实现是一个很好的方法。　　2. 蒙层设为fixed悬浮在最上，底部列表设置overflow-y: hidden；这样可以列表内容就不可以滑了，但实际过程中没有效果，于是想到继续往列表父div向上追溯，对body和html标签设置相关样式，这样就控制住了底部列表滑动问题...

2020-08-07 23:37:10 1449

vue+elementUI+wepack

空空如也