La función wx.request(Object object) en mini programas WeChat se utiliza para realizar solicitudes HTTPS a servidores. A continuación, se presenta una implementación personalizada que mejora su usabilidad mediante promesas y manejo de errores.

Ejemplo básico de uso:

wx.request({
  url: '/api/recursos',
  data: {
    clave: 'valor',
    id: '123'
  },
  header: {
    'Content-Type': 'application/json'
  },
  success: function(respuesta) {
    console.log(respuesta.data);
  },
  fail: function(error) {
    console.error('Solicitud fallida:', error);
  }
});

Para simplificar las llmaadas y añadir funcionalidades comunes como indicadores de carga y manejo de tokens, se define un módulo de encapsulamiento.

Módulo de API (api.js)

const aplicacion = getApp();
const registro = require('../utils/registro');

function ejecutarSolicitud(ruta, parametros, mostrarCarga = false) {
  return new Promise((resolver, rechazar) => {
    if (mostrarCarga) {
      wx.showLoading({ title: 'Procesando...' });
    }
    wx.request({
      url: `${aplicacion.globalData.host}${ruta}`,
      method: parametros.metodo,
      data: parametros.datos,
      header: {
        'Content-Type': 'application/json; charset=UTF-8',
        'Authorization': aplicacion.globalData.tokenAcceso
      },
      timeout: 15000,
      success: function(respuesta) {
        if (respuesta.statusCode === 200) {
          resolver(respuesta.data);
        } else if ([401, 403].includes(respuesta.statusCode)) {
          wx.reLaunch({ url: '/pages/inicio/inicio' });
          rechazar(respuesta.data);
        } else if (respuesta.statusCode >= 500) {
          wx.showToast({ title: 'Error en el servidor', icon: 'none' });
          registro.error('api.js: Error del servidor', respuesta);
          rechazar(respuesta.data);
        } else {
          wx.showToast({ title: 'Solicitud no válida', icon: 'none' });
          registro.error('api.js: Código de estado inesperado', respuesta);
          rechazar(respuesta.data);
        }
      },
      fail: function(err) {
        wx.showToast({ title: 'Conexión fallida', icon: 'none' });
        registro.error('api.js: Fallo de red', err);
        rechazar(err);
      },
      complete: function() {
        if (mostrarCarga) {
          wx.hideLoading();
        }
      }
    });
  });
}

const solicitarGet = (ruta, datos = {}) => {
  return ejecutarSolicitud(ruta, { metodo: 'GET', datos }, false);
};

const solicitarGetConCarga = (ruta, datos = {}) => {
  return ejecutarSolicitud(ruta, { metodo: 'GET', datos }, true);
};

const solicitarPost = (ruta, datos) => {
  return ejecutarSolicitud(ruta, { metodo: 'POST', datos }, false);
};

const solicitarPostConCarga = (ruta, datos) => {
  return ejecutarSolicitud(ruta, { metodo: 'POST', datos }, true);
};

const solicitarPut = (ruta, datos) => {
  return ejecutarSolicitud(ruta, { metodo: 'PUT', datos }, false);
};

const solicitarPutConCarga = (ruta, datos) => {
  return ejecutarSolicitud(ruta, { metodo: 'PUT', datos }, true);
};

const eliminarRecurso = (ruta, datos) => {
  return ejecutarSolicitud(ruta, { metodo: 'DELETE', datos }, false);
};

const eliminarRecursoConCarga = (ruta, datos) => {
  return ejecutarSolicitud(ruta, { metodo: 'DELETE', datos }, true);
};

module.exports = {
  solicitarGet,
  solicitarGetConCarga,
  solicitarPost,
  solicitarPostConCarga,
  solicitarPut,
  solicitarPutConCarga,
  eliminarRecurso,
  eliminarRecursoConCarga
};

Ejemplo de implementación

const api = require('../../api/api');
Page({
  onLoad: function() {
    api.solicitarPost('/autenticacion', {
      usuario: 'ejemplo',
      contrasena: 'clave123'
    }).then(function(resultado) {
      if (resultado.estado === 'exito') {
        wx.setStorageSync('sesion', resultado.token);
      }
    }).catch(function(error) {
      wx.showToast({ title: error.mensaje, icon: 'none' });
    });
  }
});

Parámetros de datos

Los datos enviados al servidor se convierten a cadenas de texto según el método HTTP:

• Para solicitudes GET, los datos se serializan como una cadena de consulta (query string).
• Para solicitudes POST con encabezado Content-Type: application/json, los datos se pasan como JSON.
• Para solicitudes POST con encabezado Content-Type: application/x-www-form-urlencoded, los datos se codifican como una cadena de consulta.