不再犹豫
分享是一种美德

H5页面代码更新,微信端打开存在缓存解决办法

wangtong阅读(1274)

H5页面代码更新,小程序的H5页面还是显示旧的,这是怎么回事?

这是因为微信端的页面缓存:

1、HTML缓存,查看响应的http是否有设置缓存时间,这个是本地缓存。

2、如经过CDN,检查CDN配置的静态缓存时间

3、缓存是基于URL进行的,所以上面都有说到URL+参数进行,但别忽略了页面里面引用资源的链接,如果要强制更新同步也要加上

下面来说说解决办法:

第一种:css、js文件动态添加版本号或者是参数值

例如:添加时间戳:


    <script type="text/javascript">  
        document.write("<link rel='stylesheet' type='text/css' href='css/style.css?v="+new Date().getTime()+"'>");   
    </script>

第二种:HTML添加标签缓存设置

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

第三种:手动清理(不推荐、不友好)

安卓:debugx5.qq.com,勾选Cookie,文件缓存两项,进行清除即可。

ios:退出微信重新登录即可清除缓存。

学无止境,

欢迎大家关注公众号:

_this和this的区别

wangtong阅读(427)

_this只是在包含多个回调函数的时候能够有效的区分父级this和子级this:

function(){
    this.father
    ……
    const __this = this;
    button.addEventListener("click", function(e) {
        __this.Name  //指父方法
 
        this.son  //子方法
    }
 
}

_this只是一个变量名,this代表父函数,如果在子函数还用this,this的指 向就变成子函数了,_this就是用来存储指向的

普通函数中的this表示调用此函数时的对象,箭头函数里面的this会继承自外部的this,普通函数中的this并不会向上继续找对象,箭头函数中会往上寻找this,直到找到所代表的this为止

学无止境,

欢迎大家关注公众号:

站长网站统计方式推荐

wangtong阅读(705)

网站访问量统计是指通过各种科学的方法,准确的记录来访问某一页面的访问者的流量信息。做网站访问统计对于网站运营是非常重要的,掌握用户信息能帮助站长根据用户需求来调整网站的内容,做好和制定相应的营销策略,以达到提升转化率和流量的效果。那么网站访问量统计如何查询呢?

最火爆、最时兴的方式是应用第三方的工具,以百度统计、友盟统计、51la这三家居多,然后是Google的工具等国外的。 早在今年3月份,友盟+就宣布了将停止提供免费的网站统计分析服务的消息。从2022年5月10日起,U-Web不再提供免费新建站点,仅为付费账号提供创建站点能力。所以接下来站长只能去选择使用百度统计,可惜下面是惊喜哦!

百度也发布了相应公告“基础统计报告对于分析云站点最早查询时间将调整为2年,其余站点最早查询时间调整为1年”等升级,“事件分析”功能也即将下线,改为收费的“分析云”服务。

那站长们该何去何从呢?

不要着急,咱们还有51la统计:

51la联手数百位站长,收集大量用户建议,推出的V6版本,在功能、用户体验及性能方面进行了升级,相比之前的版本更加精准。大家可以试用一下!

【51LA网站统计V6】新人注册立得5元现金收益~现在加入“优站计划”,还有额外收益赚取,点击链接了解详情 https://invite.51.la/1O3dre18F?target=V6

 

学无止境,

欢迎大家关注公众号:

【转载】js自定义多字段排序【收藏】

wangtong阅读(538)

  • 多字段同时排序在后端很好实现,直接order by field1 asc, field2 asc,field3 desc…
  • 如下可实现在前端按照多字段同时排序:
//测试数据
var items = [
{name:"linc",age:28,num:1234},
{name:"linc",age:28,num:12345},
{name:"kiki",age:20,num:12345},
{name:"高峰",age:26,num:123},
{name:"高峰",age:27,num:101},
{name:"高峰",age:26,num:111},
{name:"安迪",age:29,num:110},
{name:"安迪",age:30,num:110}
];

//两个字段一升一降排序
(function asc-desc(){
items.sort(function (a, b) {
return SortByProps(a, b, { "name": "ascending", "age": "descending" });
});
console.log(items)
})();
//两个字段都降序排序,其他排序方向同理,也可再加字段
(function desc(){
items.sort(function (a, b) {
return SortByProps(a, b, { "name": "descending", "age": "descending" });
});
console.log(items)
})();
//不定义排序方向和字段,默认都升序排列
(function default(){
items.sort(function (a, b) {
return SortByProps(a, b);
});
console.log(items)
})();

//以下函数排序属性并未写死,可直接拿去用自定义属性
function SortByProps(item1, item2, obj) {
var props = [];
if(obj){
props.push(obj)
}
var cps = []; // 存储排序属性比较结果。
// 如果未指定排序属性(即obj不存在),则按照全属性升序排序。
// 记录下两个排序项按照各个排序属性进行比较得到的结果 
var asc = true;
if (props.length < 1) {
for (var p in item1) {
if (item1[p] > item2[p]) {
cps.push(1);
break; // 大于时跳出循环。
} else if (item1[p] === item2[p]) {
cps.push(0);
} else {
cps.push(-1);
break; // 小于时跳出循环。
}
}
} 
else {
for (var i = 0; i < props.length; i++) {
var prop = props[i];
for (var o in prop) {
asc = prop[o] === "ascending";
if (item1[o] > item2[o]) {
cps.push(asc ? 1 : -1);
break; // 大于时跳出循环。
} else if (item1[o] === item2[o]) {
cps.push(0);
} else {
cps.push(asc ? -1 : 1);
break; // 小于时跳出循环。
}
}
}
}

// 根据各排序属性比较结果综合判断得出两个比较项的最终大小关系
for (var j = 0; j < cps.length; j++) {
if (cps[j] === 1 || cps[j] === -1) {
return cps[j];
}
}
return false; 
}

 

学无止境,

欢迎大家关注公众号:

本文转载自:本文链接:https://blog.csdn.net/zsl_955200/article/details/78796531,转载目的仅限于自己学习!

 

微信URL带来重大调整-跳转的解决方法

wangtong阅读(853)

为确保小程序链接合理使用,自 2022 年 4 月 11 日起,URL Scheme 和 URL Link (以下统称为 “链接” )接口能力规则将进行以下调整:

  1. 每个 URL Scheme 或 URL Link 有效期最长 30 天,均不再支持永久有效的链接、不再区分短期有效链接与长期有效链接;
  2. 链接生成后,若在微信外打开,用户可以在浏览器页面点击进入小程序。每个独立的链接被用户访问后,仅此用户可以再次访问并打开对应小程序,其他用户无法再次通过相同链接打开该小程序;
  3. 单个小程序每天生成链接数(URL Scheme 和 URL Link 总数)上限为 50 万条。

以上内容来源自  小程序链接生成与使用规则调整公告官方

对于这次调整,我们要从微信站外为我们的微信小程序进行推广,其难度是直线上升。推广本来就很已经相对来说很困难了,现在又出来这一重大调整,微信小程序推广该何去何从???

如果进行大批量推广的话,微信公众平台后台url生成工具已经不能满足需求了,所以只能使用另外一种方法:中转页

用户在访问中转页的时候请求url链接生成接口为用户分配链接,这样就可以避免链接失效的发生。

链接生成接口调整请参照官方文档小程序链接生成与使用规则调整公告官方

 

欢迎大家关注公众号:

微信公众号被关注自动回复消息中添加超链接和小程序链接方法

wangtong阅读(4366)

目前因为小程序的商业价值不断增强和与公众号的紧密关联性,很多商家都选择在注册公众号的同时,去将小程序与公众号关联,来拓展自己的推广渠道。目前小程序可以通过关联公众号实现公众号介绍页展示、模板消息推送、菜单栏跳转、图文小程序卡片、公众号文章内的小程序卡片、小程序卡片推送、落地页广告等等。无缝连接形成直接高效的宣传方式,帮助小程序获取巨大流量。今天就来介绍其中小程序关联公众号的场景,被关注回复里点击跳转小程序。

登陆 微信公众平台网站(https://mp.weixin.qq.com/),点击左侧导航功能->自动回复->被添加自动回复,可设置的文字/语音/图片/视频/为被添加自动回复内容。

然后添加链接的方式就是选择文本,放入a标签,小程序链接代码如下:

<a data-miniprogram-appid="小程序appid" data-miniprogram-path="落地页">点击进入小程序</a>

超链接方法一样,代码如下:

<a href="要打开的网址">我是一个网址,点击我打开网址</a>

 

欢迎大家关注公众号:

 

WEB-移动端图片适配-弹框

wangtong阅读(2992)

前端朋友们应该遇到过很多图片弹框适配的问题,我自己总结了两种办法:

第一种是使用background

(1)使用百分比

width: 90%;

    height: 80%;

    max-width: 538px;

    max-height: 813px;

    margin: 0 auto;

    position: absolute;    

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    background:url(./content.png);  

    filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";  

    -moz-background-size:100% 100%;  

    background-size:100% 100%;

弊端:使用过程中发现有时候图片会出现拉伸导致失真,此种方法我目前高度智能限定宽度使用百分比所以很容易导致图片拉伸失真。(如果朋友们能解决这个办法欢迎留言帮忙完善)

(2)使用固定值

    width: 285px;

    height: 430px;

    max-width: 538px;

    max-height: 813px;

    margin: 0 auto;

    background: url(./content.png) no-repeat;

    background-size: 100% 100%;

    position: absolute;    

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

弊端:在合适的屏幕可能看着比较舒服,但是大屏幕的话就会显得图片比较小,因为已经严格限定死了图片的大小,所以不能说成是自适应。(如果朋友们能解决这个办法欢迎留言帮忙完善)

第二种:img标签

<img class="abtn" src="./content.png"  alt="" srcset="">
 width: 90%;

 max-width: 538px;

 margin: 0 auto;

 position: absolute;    

 top: 50%;

 left: 50%;

 transform: translate(-50%, -50%);

注意:目前来看这种方式还是可以满足目前我所开发的需求。

 

如果大家有更好的办法欢迎大家留言,大家一起学习一起完善。

欢迎大家关注公众号:

 

微信公众号之生成带参数的二维码

wangtong阅读(1690)

为了满足用户渠道推广分析和用户帐号绑定等场景的需要,公众平台提供了生成带参数二维码的接口。使用该接口可以获得多个带不同场景值的二维码,用户扫描后,公众号可以接收到事件推送。

目前有2种类型的二维码:

1、临时二维码,是有过期时间的,最长可以设置为在二维码生成后的30天(即2592000秒)后过期,但能够生成较多数量。临时二维码主要用于帐号绑定等不要求二维码永久保存的业务场景

2、永久二维码,是无过期时间的,但数量较少(目前为最多10万个)。永久二维码主要用于适用于帐号绑定、用户来源统计等场景。

用户扫描带场景值二维码时,可能推送以下两种事件:

如果用户还未关注公众号,则用户可以关注公众号,关注后微信会将带场景值关注事件推送给开发者。

如果用户已经关注公众号,在用户扫描后会自动进入会话,微信也会将带场景值扫描事件推送给开发者。

获取带参数的二维码的过程包括两步,首先创建二维码ticket,然后凭借ticket到指定URL换取二维码。

一、开发流程

  • 调用生成ticket接口,生成ticket。
  • 调用获取二维码接口,需传递ticket。
  • 在后台获取事件推送消息,从中提取二维码携带的参数。

二、接口

ticket接口

url https://api.weixin.qq.com/cgi-bin/qrcode/create?access_token=TOKEN
格式 JSON
HTTP请求方式 POST
接口说明 生成ticket接口

参数说明

参数名称 是否必填 类型 说明
access_token String 公众号token,不通过jsonbody传递,拼接在url后
expire_seconds Integer 该二维码有效时间,以秒为单位。 最大不超过2592000(即30天),此字段如果不填,则默认有效期为60秒。
action_name String 二维码类型,QR_SCENE为临时的整型参数值,QR_STR_SCENE为临时的字符串参数值,QR_LIMIT_SCENE为永久的整型参数值,QR_LIMIT_STR_SCENE为永久的字符串参数值
action_info Object 二维码详细信息,其中包含了场景值id
scene_id Integer 场景值ID,临时二维码时为32位非0整型,永久二维码时最大值为100000(目前参数只支持1–100000)
scene_str String 场景值ID(字符串形式的ID),字符串类型,长度限制为1到64

返回参数说明

{

"ticket":"gQH47joAAAAAAAAAASxodHRwOi8vd2VpeGluLnFxLmNvbS9xL2taZ2Z3TVRtNzJXV1Brb3ZhYmJJAAIEZ23sUwMEmm

3sUw==",

"expire_seconds":60,

"url":"http://weixin.qq.com/q/kZgfwMTm72WWPkovabbI"

}
参数名称 描述
ticket 获取二维码所需
expire_seconds 过期时间
url 扫码后跳转的地址,可以用这个地址自行生成二维码

 

请求说明

  • action_name选择QR_LIMIT_SCENE或QR_LIMIT_STR_SCENE生成永久二维码,不需要传递expire_seconds参数。
  • scene_id和scene_str只需传递其中一个,需对应action_name传递的是整型还是字符串类型。
  • JSON参数示例
  • 整型:{“action_name”: “QR_LIMIT_SCENE”, “action_info”: {“scene”: {“scene_id”: 123}}}
  • 字符串类型:{“action_name”: “QR_LIMIT_STR_SCENE”, “action_info”: {“scene”: {“scene_str”: “test”}}}

官方文档

https://developers.weixin.qq.com/doc/offiaccount/Account_Management/Generating_a_Parametric_QR_Code.html

获取二维码接口

url https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=TICKET
HTTP请求方式 get
接口说明 获取二维码接口

 

返回说明

ticket正确情况下,http 返回码是200,是一张图片,可以直接展示或者下载。

官方文档

https://developers.weixin.qq.com/doc/offiaccount/Account_Management/Generating_a_Parametric_QR_Code.html

 

三、配置事件推送

(1) 微信会将扫描带参数二维码事件的数据推送到服务器配置的地址。

(2) 在后台解析微信推送的数据即可获得二维码携带的信息,其中包含生成时二维码是传递的场景值id。

官方文档

https://developers.weixin.qq.com/doc/offiaccount/Message_Management/Receiving_event_pushes.html

 

欢迎大家关注公众号:

URL Scheme-短信、邮件、微信外网页等场景打开小程序

wangtong阅读(1142)

URL Scheme——适用于从短信、邮件、微信外网页等场景打开小程序。 通过 URL Scheme 打开小程序的场景值为 1065。
生成的 URL Scheme 如下所示:

weixin://dl/business/?t= *TICKET*

如何获取URL Scheme,请参考:URL Scheme获取帮助文档

兼容性:

1、iOS系统是可以支持识别 URL Scheme,在短信等应用场景中可以直接通过Scheme跳转小程序。
2、Android系统是不支持直接识别 URL Scheme,用户无法通过 Scheme 正常打开小程序,所以需要使用 H5 页面作为中转来跳转到 Scheme 来实现打开小程序,跳转代码示例如下:

location.href = 'weixin://dl/business/?t= *TICKET*'

中转页可以自己根据实际需求来选择是立即调用还是等用户触发事件后调用。

不过值得注意的是,URL Scheme是分为短期有效(单个小程序不设上限)和长期有效(是有调用上限的,不过这上限基本上足够用户使用了)两种形式,只能跳转上线的小程序。

功能示例代码如下:

1、页面加载立即调用:

$(function(){
    location.href = 'weixin://dl/business/?t= *TICKET*';
});

2、用户触发事件后调用:

$(function(){
    $("#jump").click(function(){
          location.href = 'weixin://dl/business/?t= *TICKET*';
     });
});

 

示例代码获取方法:

关注公众号发送:【demo】

 

 

URL Scheme获取帮助文档

wangtong阅读(2469)

URL Scheme获取帮助文档

方式一:小程序管理后台工具生成

一、生成步骤

1、 地址

https://mp.weixin.qq.com/

2、 扫码登录

3、 登陆后进入首页

「工具」(在右上角)–「生成 URL Scheme」

4、 进入生成 URL Scheme

5、 生成 URL Scheme

(1) 参数说明
属性 说明
有效期 到期失效(可以自己选择失效时间)、永久有效 生成的 scheme 码类型
小程序页面路径 示例:pages/index/index 通过 scheme 码进入的小程序页面路径,必须是已经发布的小程序存在的页面,不可携带 query。path 为空时会跳转小程序主页。
启动query参数 示例:channel=test&ad=1001 通过 scheme 码进入小程序时的 query,最大1024个字符,只支持数字,大小写英文以及部分特殊字符:!#$&'()*+,/:;=?@-._~
(2) 示例
1) 生成

2) 生成结果

二、参考文档

获取 URL Scheme

方式二:服务器端(接口)方式

一、 说明

获取小程序 scheme 码,适用于短信、邮件、外部网页、微信内等拉起小程序的业务场景。通过该接口,可以选择生成到期失效和永久有效的小程序码,目前仅针对国内非个人主体的小程序开放,详见获取 URL scheme

调用方式:

二、 HTTPS 调用

1、接口地址

地址 请求方式
https://api.weixin.qq.com/wxa/generatescheme?access_token=ACCESS_TOKEN POST

2、请求参数及说明

(1) 请求参数
属性 类型 默认值 必填 说明
access_token string 接口调用凭证
jump_wxa Object 跳转到的目标小程序信息。
is_expire boolean false 生成的 scheme 码类型,到期失效:true,永久有效:false。
expire_time number 到期失效的 scheme 码的失效时间,为 Unix 时间戳。生成的到期失效 scheme 码在该时间前有效。最长有效期为1年。生成到期失效的scheme时必填。
(2) jump_wxa 的结构
属性 类型 默认值 必填 说明
path string 通过 scheme 码进入的小程序页面路径,必须是已经发布的小程序存在的页面,不可携带 query。path 为空时会跳转小程序主页。
query string 通过 scheme 码进入小程序时的 query,最大1024个字符,只支持数字,大小写英文以及部分特殊字符:!#$&'()*+,/:;=?@-._~

3、返回值

(1) 返回值说明
属性 类型 说明
errcode number 错误码
errmsg string 错误信息
openlink string 生成的小程序 scheme 码
(2) errcode合法值说明
说明
40002 暂无生成权限
40013 生成权限被封禁
85079 小程序未发布
40165 参数path填写错误
40212 参数query填写错误
85401 参数expire_time填写错误,时间间隔大于1分钟且小于1年
44990 生成Scheme频率过快(超过100次/秒)
85400 长期有效Scheme达到生成上限10万
45009 单天生成Scheme数量超过上限50万

4、示例:

(1)请求
{

    "jump_wxa":

        {

            "path": "/pages/publishHomework/publishHomework",

            "query": ""

        },

    "is_expire":true,

    "expire_time":1606737600
}
(2)返回
{

    "errcode": 0,

    "errmsg": "ok",

    "openlink": Scheme,

}


三、 云调用

1、接口方法

方法 说明
openapi.urlscheme.generate 需在 config.json 中配置 urlscheme.generate API 的权限,详情请参考官方文档

2、请求参数

(1)请求参数
属性 类型 默认值 必填 说明
jumpWxa Object 跳转到的目标小程序信息。
isExpire boolean false 生成的 scheme 码类型,到期失效:true,永久有效:false。
expireTime number 到期失效的 scheme 码的失效时间,为 Unix 时间戳。生成的到期失效 scheme 码在该时间前有效。最长有效期为1年。生成到期失效的scheme时必填。
(2)jumpWxa 的结构
属性 类型 默认值 必填 说明
path string 通过 scheme 码进入的小程序页面路径,必须是已经发布的小程序存在的页面,不可携带 query。path 为空时会跳转小程序主页。
query string 通过 scheme 码进入小程序时的 query,最大1024个字符,只支持数字,大小写英文以及部分特殊字符:!#$&'()*+,/:;=?@-._~
说明
40002 暂无生成权限
40013 生成权限被封禁
85079 小程序未发布
40165 参数path填写错误
40212 参数query填写错误
85401 参数expire_time填写错误,时间间隔大于1分钟且小于1年
44990 生成Scheme频率过快(超过100次/秒)
85400 长期有效Scheme达到生成上限10万
45009 单天生成Scheme数量超过上限50万

3、返回值

(1)返回值说明
属性 类型 说明
errcode number 错误码
errmsg string 错误信息
openlink string 生成的小程序 scheme 码
(2)errcode合法值说明
说明
40002 暂无生成权限
40013 生成权限被封禁
85079 小程序未发布
40165 参数path填写错误
40212 参数query填写错误
85401 参数expire_time填写错误,时间间隔大于1分钟且小于1年
44990 生成Scheme频率过快(超过100次/秒)
85400 长期有效Scheme达到生成上限10万
45009 单天生成Scheme数量超过上限50万

4、示例

(1)请求
const cloud = require('wx-server-sdk')

cloud.init({

    env: cloud.DYNAMIC_CURRENT_ENV,})

exports.main = async (event, context) => {

    try {

        const result = await cloud.openapi.urlscheme.generate({

            "jumpWxa": {

                "path": '/pages/publishHomework/publishHomework',

                "query": ''

            },

            "isExpire": true,

            "expireTime": 1606737600

        })

        return result

} catch (err) {

    return err

}}
(2)返回
{

    "errcode": 0,

    "errmsg": "ok",

    "openlink": Scheme,

}

四、 其他说明

如有其他问题请参考官方文档:

https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/url-scheme/urlscheme.generate.html

五、 更新说明

微信URL带来重大调整-跳转的解决方法

欢迎大家关注公众号: