月度归档： 2018年5月

JS转换HTML转义符

刚用到，在这里记录一下

//去掉html标签
function removeHtmlTab(tab) {
   return tab.replace(/<[^<>]+?>/g,'');//删除所有HTML标签
}
//普通字符转换成转意符
function html2Escape(sHtml) {
   return sHtml.replace(/[<>&"]/g,function(c){return {'<':'&lt;','>':'&gt;','&':'&amp;','"':'&quot;'}[c];});
}
//转意符换成普通字符
function escape2Html(str) {
   var arrEntities={'lt':'<','gt':'>','nbsp':' ','amp':'&','quot':'"'};
   return str.replace(/&(lt|gt|nbsp|amp|quot);/ig,function(all,t){return arrEntities[t];});
}
// &nbsp;转成空格
function nbsp2Space(str) {
   var arrEntities = {'nbsp' : ' '};
   return str.replace(/&(nbsp);/ig, function(all, t){return arrEntities[t]})
}
//回车转为br标签
function return2Br(str) {
   return str.replace(/\r?\n/g,"<br />");
}
//去除开头结尾换行,并将连续3次以上换行转换成2次换行
function trimBr(str) {
   str=str.replace(/((\s|&nbsp;)*\r?\n){3,}/g,"\r\n\r\n");//限制最多2次换行
   str=str.replace(/^((\s|&nbsp;)*\r?\n)+/g,'');//清除开头换行
   str=str.replace(/((\s|&nbsp;)*\r?\n)+$/g,'');//清除结尾换行
   return str;
}
// 将多个连续空格合并成一个空格
function mergeSpace(str) {
   str=str.replace(/(\s|&nbsp;)+/g,' ');
   return str;
}

Vue单页应用结合后台做第三方登录[QQ授权登录](二)

前言

第三方qq登录我们可以直接利用qq登录的JSdk很方便

文档说明：http://wiki.open.qq.com/wiki/website/JS_SDK%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E

示例代码文档：https://connect.qq.com/intro/login/jssdk-demo

流程

在vue入口index.html中头部引入qq的sdk，在其他页面钩子函数中即可使用qqskd的函数

qq登录流程比较简单，我就稍微说一下

1.在vue页面上点击qq登录跳转到授权页面

2.授权成功后进入回调页面

3.回调页面可以执行一下自己的逻辑，我这边回调页面弄得是后台页面，你也可以是前端的，回调中处理完自己逻辑后可以回跳回来

4.然后在页面中就可以检测到qq是否登录了，看下面代码

 

created(){
   this.test(this.code)
   this.testqq()
},
methods:{
   testqq(){
      if(QC.Login.check()){  //如果已登录
          //这里做自己逻辑处理
         });
      }

   }
}

Vue单页应用结合后台做第三方登录[微信扫一扫登录授权登录](一)

前言

在之前的mvc开发中，相信大家都也能很熟练的做出结合微信登录qq登录等的第三方登录，今天我这主要说一下前后端分离模式中的第三方登录流程

在说微信登录之前我首先跟大家说一下微信的access_token 在微信中access_token是有俩种的，大家一定要分别仔细，一个是网页授权获取到的access_token，这个token是一次性的，只能获取到一个微信用户信息，是与微信用户一对一的关系，而另外一个基础access_token是专门请求获取token接口拿到的，这个有效期是7200s，大家一定要区分开这俩个token.在今天所说的微信登录中

我首先用一幅图说明一下大致流程（扫一扫登录和微信内授权登录流程大致一样）

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

网站应用微信登录开发指南

微信文档：

https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&id=open1419316505&token=f4f77621bb28701905b55092c32eab02b718d258&lang=zh_CN

扫一扫登录，大致流程我图中已经给出来了，其实这只是一个流程，并不是最简单的，只要你明白了，你也可以有你自己的流程

前端跳转到微信扫一扫界面

第三方使用网站应用授权登录前请注意已获取相应网页授权作用域（scope=snsapi_login），则可以通过在PC端打开以下链接：
https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
若提示“该链接无法访问”，请检查参数是否填写错误，如redirect_uri的域名与审核时填写的授权域名不一致或scope不为snsapi_login。

在回调的url中，我们可以拿到code,然后把这个code给前端，让前端拿着code去请求我们登录接口，然后成功直接返回登录信息前端直接保存即可