web前端开发
YuanlongWang
全栈开发工程师,热爱研究新技术,专注于数据研究领域,乐于分享
展开
-
vue前端项目命令框输入npm run serve报error:03000086:digital envelope routines::initialization error错误
vue前端项目命令框输入npm run serve报error:03000086:digital envelope routines::initialization error错误。也可以执行:export NODE_OPTIONS=--openssl-legacy-provider。然后再执行:npm run serve。原创 2024-02-02 09:30:00 · 549 阅读 · 0 评论 -
js使用navigator.userAgent.toLowerCase()判断客户端类型
在跨平台、浏览器、移动设备兼容的时候,要根据设备、浏览器做特定调整,所以我们经常会用到navigator.userAgent.toLowerCase()来进行判断。navigator是HTML中的内置对象,包含浏览器的信息;userAgent是navigator的属性方法,可以返回由客户机发送服务器的头部的值,作用其实就是就是返回当前用户所使用的是什么浏览器,toL原创 2022-09-07 11:50:28 · 549 阅读 · 0 评论 -
vue项目调用百度地图定位,判断当前位置是否在目标位置范围内
之前用vue做了一个百度地图定位功能,判断是否当前位置在目标位置范围内的小功能,类似这样:直接上代码百度地图定位,设置目标位置范围,判断当前位置到目标位置的距离,BDMap.vue<template> <div v-show="IsShowPosition"> <div id="mapDiv" @click="hidePosition" style="width: 100%;height: 110%;background-..原创 2021-04-29 17:54:46 · 2683 阅读 · 1 评论 -
One CLI for webpack must be installed. These are recommended choices, delivered as separate packages
安装了webpack,使用webpack对js进行打包的时候报错:One CLI for webpack must be installed. These are recommended choices, delivered as separate packages: - webpack-cli (https://github.com/webpack/webpack-cli) The...原创 2018-07-24 16:09:00 · 1790 阅读 · 0 评论 -
解决:Error: Cannot find module 'webpack'
尝试用webpack对项目进行打包的时候报错:Error: Cannot find module 'webpack' at Function.Module._resolveFilename (module.js:469:15) at Function.Module._load (module.js:417:25) at Module.require (module...原创 2018-07-24 16:37:25 · 46734 阅读 · 3 评论 -
详情页返回列表页实现定位和缓存
实现目标浏览列表页面,点击进入详情页面,当从详情页面返回时,页面能定位到进入详情页时的位置,同时加载之前的缓存。实现思路当点击某个列表进入详情时,获取当前列表距离顶部的高度,并存入浏览器缓存,返回时判断是否存在该缓存,如果存在则加载该浏览器高度,实现定位到进入时的位置。实现方法<ul> <li><a onclick="god...原创 2018-07-30 08:53:56 · 7557 阅读 · 0 评论 -
通过UserAgent判断智能手机(设备,Android,IOS)、微信浏览器
定义和用法userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值。一般来讲,它是在 navigator.appCodeName 的值之后加上斜线和 navigator.appVersion 的值构成的。例如:Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.2; SV1; .NET CLR 1.1.43...原创 2018-07-23 09:52:58 · 7972 阅读 · 0 评论 -
setTimeout和setInterval的区别
setTimeout只在指定时间后执行一次,代码如下:<script>//定时器 异步运行function hello(){alert("hello");}//使用方法名字执行方法var t1 = window.setTimeout(hello,1000);var t2 = window.setTimeout("hello()",3000);//使用字符串执行方法w...原创 2018-07-27 17:07:40 · 240 阅读 · 0 评论 -
推荐几款目前最热门的前端框架
目前最热门的前端框架1、bootstrap 目前最流行的 HTML, CSS 和 JavaScript 框架,用于开发响应式,移动端先行的 web 项目gethub:https://github.com/twbs/bootstrap官网:http://getbootstrap.com/ 2、vue 一个用以创建用户接口的直观、快速、简洁的 MVVM 框架ge...原创 2018-08-15 10:00:05 · 14707 阅读 · 0 评论 -
Performance — 前端性能监控利器
Performance是一个做前端性能监控离不开的API,最好在页面完全加载完成之后再使用,因为很多值必须在页面完全加载之后才能得到。最简单的办法是在window.onload事件中读取各种数据。timing (PerformanceTiming)从输入url到用户可以使用页面的全过程时间统计,会返回一个PerformanceTiming对象,单位均为毫秒按触发顺序排列所有属性:(...原创 2018-08-13 17:37:02 · 870 阅读 · 0 评论 -
.NET 处理jsonp请求,后台代码
首先我们需要定义一个JsonpResult. 代码像这样, 直接继承自JsonResult, override了ExecuteResult方法public class JsonpResult : JsonResult{ private static readonly string JsonpCallbackName = "callback"; private static ...原创 2018-08-24 14:08:42 · 1779 阅读 · 0 评论 -
使用WebSocket搭建一个智能聊天系统
大家都知道WebSocket协议是基于TCP的一种新的网络协议。它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端。自从html5支持websocket以后,开始被大家用来实时通讯。下面分享一个使用websocket搭建的智能聊天系统:智能聊天系统二维码,系统使用了地位,可使用手机端查看:后台是使用C#开发的,下面给大家分享一下代码:一...原创 2018-09-30 12:07:35 · 2094 阅读 · 0 评论 -
vue双向绑定实例应用记录
vue双向绑定一般是用在向数据库写数据,或修改数据的时候,使用vue的数据双向绑定可以大大简化前端代码量,让页面看起来更加简洁,更容易维护。下面就用实际开发中的一个实例来讲解一下vue的双向绑定:实例是新增一个保险方案,其中包含一个客户信息和多个被保险人信息,被保险人信息要实现动态的 增 、删、 改,这样看来使用vue的动态双向绑定是最合适不过的了。其中html代码如下:<di...原创 2018-11-30 09:48:08 · 952 阅读 · 1 评论 -
利用sqlmap进行POST注入
利用sqlmap进行POST注入,常见的有三种方法:注入方式一:1.用Burp抓包,然后保存抓取到的内容。例如:保存为post.txt,然后把它放至某个目录下2.列数据库:sqlmap.py -r "c:\Users\fendo\Desktop\post.txt" -p n --dbs注:-r表示加载一个文件,-p指定参数其中出现了三次提示:it looks l...转载 2018-12-24 17:33:43 · 126862 阅读 · 0 评论 -
推荐一些最好用的Vue开源库!
无论是开发新手还是经验丰富的老手,我们都喜欢开源软件包。对于开发者来说,如果没有这些开源软件包,很难想象我们的生活会变得多么疲惫不堪,而且靠咖啡度日也会成为家常便饭。所幸的是,Vue.js 和 Nuxt.js 拥有不断成长壮大的社区,每天都会出现一些很好的软件包。在下文中,我们将推荐一些非常好用的 Vue 和 Nuxt 软件包。Vue.jsVue.js 是一个非常易用的渐进式 Java...原创 2019-01-03 14:06:52 · 583 阅读 · 0 评论 -
纯js实现的前端验证插件
之前有写过一个在C#后台实现的点击图上上文字实现安全验证的插件,相对于js验证来说更安全,缺点是只能在c#后台实现,最近发现一个纯js实现的安全验证插件,最大好处就是简洁,跨平台。下面直接把代码贴出来分享给大家:运行示例:http://img.lwpoor.cn/verify/login.html这里包含两个验证的控件:1、拖动滑块拼接图片完成验证 2、点击图片上的文字完成验证...原创 2019-03-21 12:16:40 · 2082 阅读 · 0 评论 -
$.inArray()方法介绍
$.inArray()函数用于在数组中搜索指定的值,并返回其索引值。如果数组中不存在该值,则返回-1;$.inArray(value,array) --value是要查找的值,array是被查找的数组。 有如下实例:<!DOCTYPE html><html><head><meta charset="utf-8"><...原创 2018-07-23 16:26:00 · 29609 阅读 · 0 评论 -
防止form表单重复提交
通常情况,出现from表单重复提交的情况包括:(1)点击提交按钮两次。(2)点击刷新按钮。(3)使用浏览器后退按钮重复之前的操作,导致重复提交表单。(4)使用浏览器历史记录重复提交表单。(5)浏览器重复的HTTP请求。 问题的解决方案:1、js方式1.1、在第一次点提交后将button设置为disable。var button = docume...原创 2018-07-23 10:24:45 · 2803 阅读 · 0 评论 -
微信分享接口配置和调用常见问题
相信大家在做微信分享功能的时候一定会遇到很多奇怪的问题,有时候会出现一些无厘头的问题,自己明明都配置没问题了,却分享失败,下面给大家介绍一下微信分享经常出现的一些问题和出现问题的原因;1、接口验证失败,详细信息:....这是最常见的接口验证失败的问题,出现这种情况是因为微信验证签名失败的原因,这里又得说一下签名是如何生成的以及微信端是如何进行验签的。string nonceStr = Create...原创 2018-04-25 11:33:06 · 4357 阅读 · 0 评论 -
C# JavaScript自定义控件,省市区三级联动选择,动态加载数据
之前写了一个三级联动选择自定义控件,分享给大家。 这是控件截图: 下面是代码:测试页面代码:<head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <link href="../../../scripts/artdia原创 2017-06-22 17:06:03 · 1662 阅读 · 0 评论 -
纯css样式实现盒子 3D 旋转、鼠标悬停效果
看到一个css3的动画效果,感觉很高大上的样子,心血来潮自己研究了一下。先来个效果图: 下面来看这个3d效果究竟是怎么实现的。 (目前IE暂不支持 transform-style: preserve-3d。) 首先,用到的是 transform-style: preserve-3d, 使被转换的子元素保留其 3D 转换。其次是 perspective: 600px,元素距离视图的距离,以像原创 2017-07-13 01:11:27 · 4054 阅读 · 2 评论 -
webSocket、Ajax轮询、长轮询(long poll)
ajax轮询ajax轮询的原理很简单,让浏览器间隔几秒就发送一次请求,询问服务器是否有新信息。一个简单的实例:function showUnreadNews() { $(document).ready(function() { $.ajax({ type: "POST", url: "unread_list.原创 2017-10-27 14:50:47 · 2247 阅读 · 0 评论 -
WebApi测试工具:PostMan
写好一个Api接口不知道怎么测试?PostMan帮你解决 下载安装: https://www.getpostman.com/PostMan介绍: 模拟各种HTTP requests,从常用的 GET、POST 到 RESTful 的 PUT 、 DELETE …等等。 甚至还可以发送文件、送出额外的 header。postMan界面:原创 2017-11-08 16:16:20 · 5030 阅读 · 0 评论 -
HTML5-localStorage 本地存储
HTML5 提供了两种在客户端存储数据的新方法:localStorage - 本地存储,没有时间限制的数据存储sessionStorage - 针对一个 session 的数据存储,默认浏览器关闭后消失之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。 在 HTML5 中,数据不原创 2017-10-24 17:56:07 · 360 阅读 · 0 评论 -
jQuery ajax数据请求
定义和用法ajax() 方法通过 HTTP 请求加载远程数据。 该方法是 jQuery 底层 AJAX 实现。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。var url = "/test/check"; $.ajax({ url: url, type: "post", data: {原创 2017-10-23 12:31:53 · 3552 阅读 · 0 评论 -
html5 WebSocket
WebSocket介绍WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。 在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。 浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连原创 2017-10-26 16:18:15 · 231 阅读 · 0 评论 -
使用navigator.userAgent.toLowerCase()判断客户端类型
在跨平台、浏览器、移动设备兼容的时候,要根据设备、浏览器做特定调整,所以我们经常会用到navigator.userAgent.toLowerCase()来进行判断。navigator是HTML中的内置对象,包含浏览器的信息;userAgent是navigator的属性方法,可以返回由客户机发送服务器的头部的值,作用其实就是就是返回当前用户所使用的是什么浏览器,toLowerCase()是将转换为小写原创 2017-11-30 11:09:57 · 3872 阅读 · 0 评论 -
c# WebApi之接口返回类型详解
WebApi相关文章:C# 搭建一个简单的Web API项目C# WebApi 路由配置c# WebApi之解决跨域问题:Corsc# WebApi之身份验证:Basic基础认证c# WebApi之接口返回类型详解Webapi的接口返回值主要有四种类型void无返回值IHttpActionResultHttpResponseMessage自定义类型void无返回值大家都知道voi原创 2017-11-27 14:49:31 · 29541 阅读 · 0 评论 -
ASP.NET WebApi 路由配置
一、模板路由1、在App_Start文件夹下面的WebApiConfig,默认路由配置为:using System;using System.Collections.Generic;using System.Linq;using System.Web.Http;namespace testAPI{ public static class WebApiConfig {原创 2017-10-19 16:30:48 · 11566 阅读 · 0 评论 -
c# WebApi之解决跨域问题:Cors
一、什么是跨域问题出于安全考虑,浏览器会限制脚本中发起的跨站请求,浏览器要求JavaScript或Cookie只能访问同域下的内容。由于这个原因,我们不同站点之间的数据访问会被拒绝。二、CORS解决跨域问题跨域资源共享( CORS )机制允许 Web 应用服务器进行跨域访问控制,从而使跨域数据传输得以安全进行。它解决跨域问题的原理是通过向http的请求报文和响应报文里面加入相应的标识告诉浏览器它能访原创 2017-11-06 14:48:24 · 20258 阅读 · 2 评论 -
c# WebApi之身份验证:Basic基础认证
为什么需要身份认证身份认证是为了提高接口访问的安全性,如果没有身份验证,那么任何匿名用户只要知道服务器的url,就可以随意访问服务器,从而访问或者操作数据库,这会是很恐怖的事。什么是Basic基础认证Basic基础认证是一种简单的用户名、密码验证过程,它的主要原理是加密用户信息,生成票据,每次需要身份验证时将票据带过来验证,实现步骤为:用户登录,登录成功后将生成的票据返回到前端;前端登录成功后,原创 2017-11-08 11:08:24 · 12828 阅读 · 8 评论 -
微信公众号开发(二)获取AccessToken、jsapi_ticket
Access Token在微信公众平台接口开发中,Access Token占据了一个很重要的地位,相当于进入各种接口的钥匙,拿到这个钥匙才有调用其他各种特殊接口的权限。 access_token是公众号的全局唯一票据,公众号调用各接口时都需使用access_token。正常情况下access_token有效期为7200秒,重复获取将导致上次获取的access_token失效。 公众号可以使用Ap原创 2017-12-07 16:42:38 · 17796 阅读 · 0 评论 -
微信支付 监听WeixinJSBridgeReady
微信支付需要监听WeixinJSBridgeReady才能自动跳转支付:<script language="javascript"> var json= '{"appId": "",//应用ID "package": "",//扩展字段 "timeStamp": "",//时间戳 "nonceStr": "",//随机字符串 "signType": "",/原创 2017-10-17 14:10:42 · 14019 阅读 · 0 评论 -
微信公众号开发(三)微信支付
c# mvc 微信公众号支付整理,微信支付WeixinJSBridgeReady监听,统一下单处理。原创 2017-10-19 12:07:08 · 560 阅读 · 0 评论 -
C# easyui ComboTree自定义控件 绑定数据与使用
关于easyUI ComboTree控件的使用,之前在网上查了些资料,没有完整的例子,自己研究改写了一个自定义控件,分享给大家。 这是运行效果图: 下面是自定义控件部分的代码:控件前端:<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UCComboTree.ascx.cs" Inherits="DTcms.Web.a原创 2017-06-21 21:54:31 · 1441 阅读 · 0 评论