Rumah >hujung hadapan web >uni-app >Bagaimanakah uniapp memanggil kaedah WeChat secara terus?

Bagaimanakah uniapp memanggil kaedah WeChat secara terus?

PHPz
PHPzasal
2023-05-22 09:40:07775semak imbas

Dengan populariti telefon pintar, permintaan untuk aplikasi mudah alih semakin meningkat, dan WeChat telah menjadi salah satu aplikasi yang mesti digunakan oleh ratusan juta pengguna setiap hari. Untuk menjadikan aplikasi lebih pintar, semakin ramai pembangun memilih untuk menggunakan uniapp untuk membangunkan aplikasi. uniapp ialah rangka kerja pembangunan berdasarkan Vue.js Ia terutamanya menyediakan penyelesaian untuk menulis berbilang terminal sekaligus, dan menyokong kompilasi ke dalam berbilang platform seperti program kecil, H5 dan Apps.

Dengan populariti program mini WeChat, uniapp juga telah mula menyokong pembangunan program mini. Apabila membangunkan program kecil dalam uniapp, API WeChat sering digunakan, seperti memanggil fungsi pengimbasan kod dan mendapatkan maklumat lokasi pengguna. Artikel ini akan memperkenalkan cara memanggil terus API WeChat dalam uniapp.

1. Konfigurasikan fail uni-app.uniConfig.js

Apabila menggunakan uniapp untuk membangunkan atur cara kecil, anda perlu mencipta fail uni-app.uniConfig.js baharu dalam akar projek direktori dan tambahkannya dalam Konfigurasikan APPID, nama applet dan maklumat lain. Anda juga perlu menambah objek wx baharu dalam fail ini dan memberikannya nilai. Seperti berikut:

module.exports = {
  // 配置APPID等信息
  // ...
 
  // 添加wx对象并进行赋值
  ext: {
    wx: {
      chooseImage: uni.chooseImage,
      getImageInfo: uni.getImageInfo,
      saveImageToPhotosAlbum: uni.saveImageToPhotosAlbum,
      stopRecord: uni.stopRecord,
      getFileSystemManager: uni.getFileSystemManager,
      env: 'wx'
    }
  }
}

Dalam kod di atas, kami menambah objek wx dan memberikan nilai kepadanya. Antaranya, kaedah seperti chooseImage, getImageInfo, saveImageToPhotosAlbum, stopRecord dan getFileSystemManager ialah API yang telah dilaksanakan dalam uniapp Atribut env ialah 'wx', yang bermaksud persekitaran WeChat sedang digunakan.

2. Panggil API WeChat

Selepas mengkonfigurasi fail uni-app.uniConfig.js, kami boleh terus memanggil API WeChat dalam uniapp. Mengambil contoh mendapatkan maklumat lokasi semasa pengguna, kod khusus adalah seperti berikut:

// 获取用户位置信息
uni.getLocation({
  type: 'gcj02',
  success: function (res) {
    console.log(res)
  }
})

Dalam kod di atas, kami menggunakan kaedah getLocation dalam uniapp untuk mendapatkan maklumat lokasi pengguna.

3. Memanggil WeChat Payment API

Kami mengambil WeChat Payment API sebagai contoh untuk memperkenalkan cara terus memanggil WeChat Payment API dalam uniapp.

1. Dapatkan appid, mch_id, kunci dan parameter lain WeChat Pay dalam bahagian belakang pedagang WeChat Pay.

2. Buat pesanan pembayaran dalam uniapp Kod khusus adalah seperti berikut:

/**
 * 创建支付订单(服务端创建)
 * 商品名:test
 * 金额:1
 * openid:abc
 * @param {Object} userInfo
 */
export const createPayOrder = (userInfo) => {
  return new Promise((resolve, reject) => {
    uni.request({
      url: 'https://test.com/api/weixin/pay',
      method: 'POST',
      data: {
        openid: userInfo.openid,
        amount: 1,
        goodsName: 'test'
      },
      success: function (res) {
        resolve(res.data.data)
      },
      fail: function (err) {
        reject(err)
      }
    })
  })
}

Dalam kod di atas, kami memulakan permintaan kepada pelayan untuk membuat pesanan pembayaran melalui uni. kaedah permintaan. Antaranya, openid ialah openid WeChat pengguna, jumlah adalah jumlah pembayaran, dan goodsName ialah nama produk.

3. Mulakan pembayaran WeChat, kod khusus adalah seperti berikut:

/**
 * 发起微信支付
 * @param {Object} data
 */
export const wxPayment = (data) => {
  return new Promise((resolve, reject) => {
    uni.requestPayment({
      timeStamp: data.timeStamp,
      nonceStr: data.nonceStr,
      package: data.package,
      signType: 'MD5',
      paySign: data.paySign,
      success: function (res) {
        resolve(res)
      },
      fail: function (err) {
        reject(err)
      }
    })
  })
}

Dalam kod di atas, kami memulakan pembayaran WeChat melalui kaedah uni.requestPayment. Antaranya, timeStamp, nonceStr, pakej, paySign dan parameter lain telah dihasilkan apabila pelayan membuat pesanan pembayaran.

4. Ringkasan

Di atas ialah pengenalan untuk memanggil terus API WeChat dalam uniapp. Menggunakan uniapp untuk membangunkan program kecil boleh meningkatkan kecekapan pembangunan Pada masa yang sama, dengan mengkonfigurasi fail uni-app.uniConfig.js, anda juga boleh memanggil API WeChat dengan mudah. Pada masa hadapan, dengan peningkatan berterusan teknologi, kami percaya bahawa uniapp akan memainkan peranan yang lebih penting dalam bidang pembangunan aplikasi mudah alih.

Atas ialah kandungan terperinci Bagaimanakah uniapp memanggil kaedah WeChat secara terus?. 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