Skip to content

M
mr-julyedu
Commit 29805882 by zhanghaozhe
Options

微信登录

parent 413a80c8
Showing with 106 additions and 99 deletions
scripts/start.js
......@@ -41,8 +41,7 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
}
// Tools like Cloud9 rely on this.
// const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 80;
const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 80;
const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;
const HOST = process.env.HOST || '0.0.0.0';
if (process.env.HOST) {
......
src/App.js
......@@ -2,9 +2,13 @@ import React, { Component } from 'react'
import Routes from './router'
import cookie from 'js-cookie'
import { connect } from "react-redux";
import { setCurrentUser } from "@/store/userAction";
import { setCurrentUser, startFetchUser } from "@/store/userAction";
import { withRouter } from 'react-router-dom'
import { compose } from 'redux'
import { api, getParam, http } from "@/utils";
import { Toast } from "antd-mobile";
import jsCookie from 'js-cookie'
import { addDays } from 'date-fns'
//拦截ajax请求，返回mock数据
......@@ -17,30 +21,25 @@ import './assets/css/index.scss';
// iconfont
import './assets/font/iconfont.css';
import { api, getParam, http, isLogin } from "@/utils";
import { Toast } from "antd-mobile";
class App extends Component {
componentDidMount() {
console.log(this.props.history);
//平台信息
cookie.set('plat', '5')
this.props.startFetchUser()
http.get(`${api.home}/m/user_info`).then(res => {
this.props.setCurrentUser(this.transformUser(res))
})
let code = getParam('code')
let {history, state, location} = this.props
if (code) {
http.get(`${api['base-api']}/m/wx_loginInfo/code/${code}`)
http.get(`${api['home']}/m/wx_loginInfo/code/${code}`)
.then(res => {
let data = res.data
console.log(res)
......@@ -49,7 +48,13 @@ class App extends Component {
window.location.assign(data.data.url)
} else {
console.log(this.props.location)
let user = this.transformWxUser(res)
let {role, uid, token} = data.data
let expires = {expires: addDays(new Date(), 90)}
jsCookie.set('role', role, expires)
jsCookie.set('uid', uid, expires)
jsCookie.set('token', token, expires)
this.props.receiveUser(user)
}
} else {
Toast.info(data.msg)
......@@ -58,17 +63,6 @@ class App extends Component {
}
/*else {
if (isLogin) {
console.log(location.pathname);
// history.replace(location.pathname)
} else {
console.log(state);
history.replace('/passport', {...state})
}
}*/
}
......@@ -108,6 +102,32 @@ class App extends Component {
return payload
}
transformWxUser = res => {
let data = res.data
if (data.errno == 200) {
let {uid, token, avatar_file: avatar, uname: username,} = data.data
return {
hasError: false,
data: {
uid,
token,
avatar,
username
},
msg: data.msg
}
} else {
let {code, msg} = data.data
return {
code,
msg,
hasError: true,
data: {}
}
}
}
render() {
return <Routes/>
}
......@@ -116,7 +136,7 @@ class App extends Component {
export default compose(
connect(
null,
{setCurrentUser}
{setCurrentUser, startFetchUser}
),
withRouter
)(App)
\ No newline at end of file
src/components/passport/common/LoginWays/index.js
import React, { PureComponent } from 'react';
import { browser } from "@/utils";
import './loginWays.scss'
class LoginWays extends PureComponent {
handleClick = (index) => {
this.props.onClick(index)
state = {
ways: this.props.loginWays
}
componentDidMount() {
if (!browser.isWeixin) {
this.setState({
ways: this.state.ways.filter(item => item.text !== '微信')
})
}
}
handleClick = text => {
this.props.onClick(text)
}
render() {
......@@ -14,7 +28,7 @@ class LoginWays extends PureComponent {
<div className="bottom-title">其他登录方式</div>
<ul className='login-ways-container'>
{
this.props.loginWays.map((item, index) => {
this.state.ways.map((item, index) => {
return (
<li key={index} onClick={this.handleClick.bind(this, item.text)}>
<img src={item.logo} alt=""/>
......
src/components/passport/index.js
......@@ -15,7 +15,6 @@ import account from './account.png'
import qq from './qq.png'
import sina from './sina.png'
import wechat from './wechat.png'
import { api, http } from "@/utils";
class Passport extends Component {
......@@ -45,7 +44,6 @@ class Passport extends Component {
logo: sina,
text: '新浪',
url: `http://passport-test.julyedu.com/mob/sinalogin?redirect_url=${this.redirect_url}`
},
]
}
......
src/components/passport/login/index.js
......@@ -21,11 +21,6 @@ class Login extends Component {
captchaInstance: null
}
componentDidMount() {
console.log(this.props);
}
loginWaysClick = method => {
const {history, loginWays, location} = this.props
......@@ -40,7 +35,7 @@ class Login extends Component {
const redirectURI = window.location.protocol + '//' + window.location.hostname + from.pathname
alert(redirectURI)
// alert(redirectURI)
window.location.assign(`https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23dac6775ac82877&redirect_uri=${encodeURIComponent(redirectURI)}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`)
break;
default:
......
src/components/passport/setPassword/index.js
......@@ -16,11 +16,6 @@ import { connect } from "react-redux";
class SetPassword extends Component {
componentDidMount() {
console.log(this.props.location);
}
render() {
let {values, errors, location} = this.props
let {from} = location.state || {from: {pathname: '/'}}
......@@ -84,7 +79,7 @@ const formikConfig = {
},
validateOnChange: false,
validate: (values) => {
validate: values => {
let errors = {}
const re = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/;
if (!re.test(values.password)) {
......@@ -128,7 +123,7 @@ function bindMobileSetPassword(values, props) {
.then(res => {
if (res.data.errno == 200) {
Toast.info('密码设置成功')
let from = getFrom(props.location)
let {from} = location.state || {from: {pathname: '/'}}
setTimeout(function () {
props.history.replace(from.pathname)
}, 1000)
......@@ -138,10 +133,6 @@ function bindMobileSetPassword(values, props) {
})
}
function getFrom(location) {
return {from} = location.state || {from: {pathname: '/'}}
}
export default compose(
connect(
state => ({user: state.user}),
......
src/router/loading.js
import React, { Component } from 'react';
import React, { useEffect } from 'react';
import { withRouter } from "react-router-dom";
import { api, http, getParam, isLogin } from "@/utils";
import { Toast } from "antd-mobile";
import { compose } from "redux";
import { connect } from "react-redux";
class Loading extends Component {
function Loading(props) {
async componentDidMount() {
let code = getParam('code')
let {history, state, location} = this.props
if (code) {
http.get(`${api['base-api']}/m/wx_loginInfo/code/${code}`)
.then(res => {
let data = res.data
console.log(res)
if(data.errno == 200){
if(data.data['is_bind_mobile']){
window.location.assign(data.data.url)
}else {
console.log(this.props.location)
}
}else {
Toast.info(data.msg)
}
})
} else {
if (isLogin) {
console.log(location.pathname);
// history.replace(location.pathname)
useEffect(() => {
let {user, location, history} = props
if (!user.isFetching) {
if (user.hasError) {
history.push('/passport', {from: location})
} else {
console.log(state);
history.replace('/passport', {...state})
if (Object.values(user.data).every(item => !!item).length !== 0) {
history.push(location.pathname)
}
}
}
}
})
render() {
return (
<div className={'loading'}>
loading...
</div>
);
}
return (
<div className={'loading'}>
loading...
</div>
);
}
export default withRouter(Loading)
\ No newline at end of file
export default compose(
connect(
state => ({user: state.user}),
null
),
withRouter
)(Loading)
\ No newline at end of file
src/router/router-config.js
......@@ -16,7 +16,7 @@ import Examination from '@/components/examination'
import ShopCart from '@/components/shopCart';
import BargainMiddlePage from '@/components/bargainMiddlePage';
import Passport from '@/components/passport';
import {Scholarship} from '@/components/scholarship/index';
import { Scholarship } from '@/components/scholarship/index';
import DrawDocument from '@/components/scholarship/DrawDocument/DrawDocument';
import PayOrder from '@/components/order/payOrder/PayOrder'
......
src/store/userAction.js
......@@ -45,7 +45,7 @@ const storeUser = (res, dispatch) => {
const SET_CURRENT_USER = 'SET_CURRENT_USER'
const setCurrentUser = payload => ({
type: SET_CURRENT_USER,
payload
payload: {...payload, isFetching: false}
})
......@@ -63,6 +63,12 @@ const updateUser = payload => ({
payload
})
const START_FETCH_USER = 'START_FETCH_USER'
const startFetchUser = () => ({
type: START_FETCH_USER
})
export {
accountLogin,
SET_CURRENT_USER,
......@@ -70,5 +76,7 @@ export {
quickLogin,
logout,
UPDATE_USER,
updateUser
updateUser,
START_FETCH_USER,
startFetchUser,
}
\ No newline at end of file
src/store/userReducer.js
import { SET_CURRENT_USER, UPDATE_USER } from '@/store/userAction';
import { SET_CURRENT_USER, UPDATE_USER, START_FETCH_USER } from '@/store/userAction';
import { merge } from 'lodash'
......@@ -12,7 +12,8 @@ const initialState = {
token: '',
email: '',
uid: ''
}
},
isFetching: true
}
......@@ -22,6 +23,8 @@ export default function (state = initialState, action) {
return action.payload
case UPDATE_USER:
return merge({}, state, action.payload)
case START_FETCH_USER:
return {...state, isFetching: true}
default:
return state
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment