Level 73
Where is your backend code?
Sep 29, 2023
9
Level 1
How to get the qr code token and send it to the form?
Hello, I am generating a QR code that returns the link and token for validation, how do I fill in the field on the other tab?
Code below
HTML details where I call the qrcode
<template>
<div v-if="qrCodeUrl">
<img :src="qrCodeUrl" alt="QR Code" />
</div>
</template>
<script>
export default {
computed: {
qrCodeUrl() {
if (this.company.token) {
return this.qrcode(this.company.token);
}
return null;
},
},
methods: {
qrcode(token) {
const url = 'https://chart.googleapis.com/chart?chs=150x150&cht=qr&chl=https://myurl/validate/' + token;
return url;
},
}
}
</script>
Token validation form
<template>
<div class="form-group mb-3">
<label class="form-control-label" for="token">token<span
class="text-danger">*</span></label>
<div class="input-group" :class="errors.has('token') ? 'has-danger' : ''">
<input ref="token" class="form-control" placeholder="informe o Token" type="text" name="token"
:class="errors.has('token') ? 'is-invalid' : ''" v-validate="'required'"
v-model="token" />
</div>
<small class="text-warning" v-show="errors.has('token')">{{
errors.first('token')
}}</small>
</div>
</template>
<script>
export default {
data() {
return {
token: '',
};
}
}
</script>
Level 1
@Tray2 Generation of QR code I did on the front
Level 1
@Tray2 My function validate token back end
public function filter(Request $request){
$validate = $request->input('token');
$mtr = Ctr::where('token', $validate)->first();
if (!empty($mtr)) {
$mtr = $mtr->getDetailCtr();
return response()->json([
'mtr' => $mtr
], 200);
} else {
return response()->json([
'type' => 'Erro! ',
'message' => 'MTR not found.'
], 401);
}
}
Level 73
@Elyton What do you mean with?
how do I fill in the field on the other tab?
Level 1
@Tray2 front method validate cardvalidate
methods: {
//Validate form
validateBeforeSubmitSearch() {
this.$validator.validateAll().then(result => {
if (result) {
const { token } = this
if (token) {
this.search()
}
}
})
},
search() {
$('#message-alert').hide()
this.isLoading = true
const { token } = this
this.mtr = {}
this.message = null
this.$http
.post(
`${this.$urlAPI}buscar-mtr-rcc`,
{
token: token,
},
)
.then(response => {
const { data } = response
this.mtr = data.mtr
this.visualizarMtr()
})
.catch(error => {
const alert = 'alert-warning'
let type = 'Erro! '
let message = 'Tente novamente mais tarde!'
const { response } = error
if (response.status === 401) {
const { data } = response
type = data.type
message = data.message
}
this.showAlert(alert, type, message)
this.isLoading = false
})
},
Level 1
Example: How to return when scanning QR code
myurl.com/validate/token
How do I put this token in the validation form?
the user would have the option of placing the token manually or reading the qrcode with the camera redirecting to the page, the field is filled with the token!
Level 73
@Elyton I guessing you are using a get request right?
If so you need to to the querystring
https://myssite.test/validate/token?token=<your token>
The you read it with javascript and then place it in a form.
Level 1
@Tray2 How to configure it the way you suggested?
qr code I configured on the front end and not on the back
Level 73
Please or to participate in this conversation.