1.vue微博回调空页面

注:微博回调空页面为: http://127.0.0.1:8888/oauth/callback/

1.1 页面路径 components\oauth.vue

<template>
<div>
<p>跳转中....</p>
</div>
</template>
<script>
import { oauth_callback_post } from './axios_api/api'
export default {
mounted() {
this.getCode()
},
methods: {
// 获取微博传过来的code,发送给django后端进行验证
getCode() {
// 获取url中的code 信息
// 当前url 是http://192.168.56.100:8888/oauth/callback/? code=fe6cbe07708aecf4a2b3d942ed692c4c
let code = this.$route.query.code console.log(this.$route.query)
// 给后端发送code
let params = { code: code }
oauth_callback_post(params).then((resp) => {
console.log(resp)
// code: 0
// msg: "授权成功"
// data: {type: "1", uid: "7410919278"}
if (resp.data.type == '0') {
// code: 0
// msg: "登录成功"
// data: {
// authenticated: "true"
// email: ""
// id: 1
// name: "admin"
// role: null
// token: "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VybmFtZSI6ImFkbWluIiw iZXhwIjoxNTk3OTAwNTcyLCJlbWFpbCI6IiIsIm9yaWdfaWF0IjoxNTk3ODE0MTcyfQ.aQT7GSR_xQBPM lB4_k8-zTHnx0ow3OC2KHa3C8MgilY"
// type: "0"
// username: "admin"} let res = resp.data
localStorage.setItem('username', res.username)
// localStorage.setItem('img', res.img)
localStorage.setItem('token', res.token)
localStorage.setItem('uid', res.id)
this.login_username = res.username
this.opened = false
// alert(res.message)
this.$router.push('/') }if (resp.data.type == '1') {
this.visiable = true
this.uid = resp.data.uid
}
})
},
}
}
</script>

vue微博回调接口的更多相关文章

  1. vue微博回调空页面

    1.vue微博回调空页面 注:微博回调空页面为:http://127.0.0.1:8888/oauth/callback/ 1.1 页面路径 components\oauth.vue <temp ...

  2. 1.微博回调接口 和绑定user接口

    1.1 oauth/views.py 中添加试图函数 http://192.168.56.100:8888/oauth/weibo/callback/ # 通过vue前端传入的code,微博身份验证c ...

  3. vue回调接口

    1.微博回调接口 1.1oauth/urls.py 中添加路由 urlpatterns = [ path('weibo/callback/', views.OauthWeiboCallback.as_ ...

  4. Vue调用百度接口做百度搜索

    这两天由于学习需要,需要用vue来调用api接口,但是以前没怎么接触过用vue来调用接口,不会没关系,发挥我们强大的学习能力,都不是事,学习了半天基本也就可以初级上手了,写篇随笔记录下来,方便以后回顾 ...

  5. Android回调接口的写法

    方法一: 定义一个接口,里面写想要对外提供的方法,在逻辑层方法的参数里传递进去,让在需要的时候调接口里的方法. 实例一: public class SmsUtils { public interfac ...

  6. Android中回调接口的使用

    MainActivity如下: package cn.testcallback; import android.os.Bundle; import android.app.Activity; /** ...

  7. 手势识别官方教程(2)识别常见手势用GestureDetector+手势回调接口/手势抽象类

    简介 GestureDetector识别手势. GestureDetector.OnGestureListener是识别手势后的回调接口.GestureDetector.SimpleOnGesture ...

  8. 使用回调接口实现ActiveX控件和它的容器程序的通讯

    本文阅读基础:有一定的C++基础知识(了解继承.回调函数),对MFC的消息机制有一定了解,对COM的基础知识有一定了解,对ActiveX控件有一定了解. 一. 前言 ActiveX控件和它的容器程序如 ...

  9. vue + ajax + php 接口的使用小接

    vue + ajax + php 接口的使用小接 前端代码: (获取用户信息,并渲染页面) userinfor.html <!DOCTYPE html> <html lang=&qu ...

随机推荐

  1. RestfulApi 学习笔记——简单介绍(一)

    前言 什么是restapi? 直接看:http://www.ruanyifeng.com/blog/2014/05/restful_api.html 阮一峰的blog,即可明白,下面是一些例子,增强理 ...

  2. DES 实现

    原理 加密 置换: IP逆置换: 迭代: PC-1置换: PC-2置换: 子秘钥的生成: 加密函数f: 解密 代码 // C语言实现 #include<stdio.h> #include& ...

  3. 通俗易懂浅谈理解ES6类this不同指向问题

    1. class Btn{ //定义的一个类 constructor(id){ // constructor是一个构造函数,是一个默认方法,通过 new 命令创建对象实例时,自动调用该方法.一个类必须 ...

  4. xshell断线解决办法

    困扰了好几个月了,网上更改ssh配置文件.固定ip都不好使,终于找到xshell掉线的解决办法了 哈哈!!! 设备管理器-->网络适配器-->对应网络连接虚拟机方式,本机虚拟机桥接如图 右 ...

  5. pytorch加载语音类自定义数据集

    pytorch对一下常用的公开数据集有很方便的API接口,但是当我们需要使用自己的数据集训练神经网络时,就需要自定义数据集,在pytorch中,提供了一些类,方便我们定义自己的数据集合 torch.u ...

  6. z-index属性详解

    z-index属性详解 目录 z-index属性详解 一.定义和用法 二.代码 三.效果图 一.定义和用法 z-index属性指定一个元素的堆叠顺序,也就是z轴 position属性定义的是x轴和y轴 ...

  7. 易于理解的 python 深度学习摘要算法教程

    序 "我不想要一份完整的报告,只要给我一份结果摘要就好".我经常发现自己处于这种状况 -- 无论是在大学里还是在我的职业生涯中.我们准备一份全面的报告,但老师/主管却只有时间阅读摘 ...

  8. Spider_基础总结4_bs.find_all()与正则及lambda表达式

    # beautifulsoup的 find()及find_all()方法,也会经常和正则表达式以及 Lambda表达式结合在一起使用: # 1-bs.find_all()与正则表达式的应用: # 语法 ...

  9. javascript链式运动框架案例

    javascript链式运动框架 任务描述: 当鼠标移入红色矩形时,该矩形宽度逐渐增加至400px,之后高度逐渐增加至400px; 当鼠标移出红色矩形时,该矩形高度逐渐减小至200px,之后宽度逐渐减 ...

  10. 庐山真面目之四微服务架构Consul集群和Nginx版本实现

    庐山真面目之四微服务架构Consul集群和Nginx版本实现 一.简介      在上一篇文章<庐山真面目之三微服务架构Consul版本实现>中,我们已经探讨了如何搭建基于单节点Consu ...