QQ扫一扫联系
我装了cms 做后台,前端试图用uni-app开发。最先测试的是用户登录页面,页面 code 如下。基本思路是页面加载的时候从/api/login_captcha 得到验证码图片,然后用户输入‘用户名’,‘密码’,‘验证码’,通过表单发送到/api/login 进行登录操作。始终得到图片验证码错误。请问应该如何使用这两个接口进行用户登录啊?另外,如果后台关闭图片验证,只进行‘用户名’,‘密码’登录时没有问题的。
template>
<view>
<form @submit="formSubmit">
<view>
<input focus placeholder="name" v-model="loginData.username" />
</view>
<view>
<input focus placeholder="password" v-model="loginData.password" />
</view>
<view>
<input placeholder="captcha" v-model="loginData.captcha" />
<image :src="imgCaptcha" mode=""></image>
</view>
<view>
<button type="primary" form-type="submit">登录</button>
</view>
</form>
</view>
</template>
<script>
export default {
data() {
return {
loginData: {
username: '',
password: '',
captcha: ''
},
imgCaptcha: ''
};
},
onLoad() {
this.getImageCaptcha()
},
methods: {
getImageCaptcha() {
let imgCode = '';
uni.request({
url: '/api/login_captcha',
method: 'POST',
success: (res) => {
console.log('captcha request success')
console.log(res.data); // res.data.code = 0 is success
this.imgCaptcha = res.data.data.image
console.log('image captcha')
console.log(this.imgCaptcha)
}
});
},
formSubmit(e) {
uni.request({
url: '/api/login',
method: 'POST',
data: this.loginData,
success: (res) => {
console.log('request success')
console.log(res.data); // res.data.code = 0 is success
if (res.data.code == 0) { // 非0就是错误
// save `api-token` locally
uni.setStorageSync('api-token', res.header['api-token']);
} else {
uni.showToast({
title: res.data.msg,
icon: 'error',
duration: 2000
});
}
},
fail: (res) => {
console.log('failed')
console.log(res)
uni.showToast({
title: 'Failed to login',
icon: 'error',
duration: 2000
});
}
});
}
}
}
</script>
<style>
.captcha-box {
height: 100rpx;
padding: 10rpx 0;
display: flex;
input {
border: 1px solid #ccc;
}
image {
margin: 10rpx;
width: 80%;
height: 80rpx;
border: 1px solid red;
}
}
</style>
PHP8.1、ModStartCMS V8.0.0,MSCore V3.8.0 ( With LARAVEL9 )
1
2
3
1
2
3
需要在前端全局处理api-token,Api所有请求,需要携带
api-token请求头。第一次发起请求该值留空即可,返回的响应头中会在服务端生成
api-token。在所有接口交互过程中,当响应头中存在
api-token时,需要覆盖客户端的api-token值。通常第一个请求接口无需携带
api-token信息,如配置接口/api/config、登录接口/api/login。谢了。
用户登录成功后只返回数据如下:
{"code":0,"msg":"ok"}不包含任何用户"data" 吗?比如基本的id, username.... 我看了通用用户的接口文档,也没有看到接口返回基本用户数据的。 如果需要自己写一个新的接口,除了直接该Member 模块代码外,是不是只能开发一个新的模块?感觉就为了一个接口就新增加一个模块也不是什么好方法。。
可以参考一些现成的手机应用。
/api/config 这个是网站的基本信息
/api/config_app 这个是用户、应用配置等的基本信息
用户登录成功后,可以直接刷新 /api/config_app 这个接口
ok. will try.