Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menulis pernyataan sql pendaftaran log masuk vue

Bagaimana untuk menulis pernyataan sql pendaftaran log masuk vue

王林
王林asal
2023-05-08 10:19:37689semak imbas

Vue.js ialah rangka kerja JavaScript popular yang menyediakan banyak ciri untuk membina antara muka pengguna dan aplikasi satu halaman. Vue.js juga menyediakan pembangun JavaScript dengan banyak pilihan untuk memudahkan komunikasi dengan pelayan bahagian belakang. Dalam artikel ini, kita akan belajar cara menggunakan Vue.js, digabungkan dengan pangkalan data SQL, untuk melaksanakan fungsi log masuk dan pendaftaran, serta menyediakan pernyataan SQL yang sepadan.

Apabila melaksanakan fungsi log masuk dalam Vue.js, anda perlu memberi perhatian kepada aspek berikut:

  1. Dapatkan maklumat log masuk (seperti nama pengguna dan kata laluan) yang dimasukkan oleh pengguna dari bahagian hadapan.
  2. Padankan maklumat yang diperolehi dengan rekod dalam pangkalan data untuk mengesahkan identiti pengguna.
  3. Jika pengesahan berjaya, simpan maklumat pengguna ke storan setempat penyemak imbas untuk digunakan dalam sesi akan datang.

Berikut ialah contoh kod untuk melaksanakan fungsi log masuk Vue.js, yang menggunakan pangkalan data MySQL.

Daftar

app.post('/register',function(req,res){

const {username, password} = req.body
const sql = 'insert into users (username,password) values (?,?)'
connection.query(sql,[username,password],(err,result)=>{
    if(err){
        console.log(err)
        res.send({
            code:1,
            msg:'用户名已存在!'
        })
    }else{
        res.send({
            code:0,
            msg:'注册成功!'
        })
    }
})

})

Log masuk

app.post('/login',function(req,res){

const {username, password} = req.body
const sql = 'select * from users where username=? and password=?'
connection.query(sql,[username,password],(err,result)=>{
    if(err){
        console.log(err)
    }
    if(result.length===0){
        res.send({
            code:1,
            msg:'用户名或密码错误!'
        })
    }else{
        const userInfo = JSON.stringify({
            id:result[0].id,
            username:result[0].username
        })
        res.send({
            code:0,
            msg:'登录成功',
            userInfo
        })
    }
})

})

Dalam kod di atas, kami mentakrifkan dua laluan dengan menggunakan rangka kerja ekspres: satu dengan untuk pendaftaran dan satu lagi untuk log masuk. Dalam permintaan pos, kami mendapat nama pengguna dan kata laluan daripada req.body dan menghantarnya ke pangkalan data untuk pengesahan. Jika pengesahan berjaya, kami menyimpan maklumat pengguna dalam objek userInfo dan menghantarnya semula ke bahagian hadapan.

Adalah penting untuk ambil perhatian bahawa apabila menggunakan Vue.js, kami biasanya menyimpan maklumat pengguna dalam storan setempat penyemak imbas dan menggunakannya dalam sesi akan datang. Berikut ialah contoh mudah yang menunjukkan cara menyimpan maklumat pengguna dalam localStorage:

Simpan maklumat pengguna

localStorage.setItem('userInfo', JSON.stringify(userInfo))

Dapatkan maklumat pengguna

localStorage.getItem('userInfo')

Ringkasnya, Vue.js ialah rangka kerja berkuasa yang boleh disepadukan dengan mudah dengan pangkalan data SQL, justeru Laksanakan fungsi log masuk dan pendaftaran biasa . Contoh kod di atas menunjukkan cara untuk mengesahkan menggunakan Vue.js dan MySQL dan menyimpannya dalam storan setempat penyemak imbas. Semoga artikel ini dapat membantu anda!

Atas ialah kandungan terperinci Bagaimana untuk menulis pernyataan sql pendaftaran log masuk vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn