expo native wechat

Expo Wechat nativo

Un módulo de exposición para admitir las API de Wechat en Android e iOS

Para el proyecto nativo Bare React

Consulte Wechat nativo

Motivación

La mayoría de los desarrolladores que utilizan React Native para crear aplicaciones no están equipados con habilidades de desarrollo nativas, sin mencionar la conexión de sus aplicaciones con WeChat.

Especialmente, WeChat OpenSDK es algo doloroso debido a documentos de mierda donde muchas API no son claras e intuitivas. Para ayudar a los desarrolladores a utilizar React Native, intenté en la medida de lo posible crear esta biblioteca. Y espero que se beneficie de esto y se sienta menos frustrado con WeChat.

Por qué

• WeChat nativo es nuevo y muchas bibliotecas como esta ya no se mantienen y se mantienen al día con la última versión de WeChat.
• Native WeChat admite la arquitectura React Native tanto nueva como heredada.
• Native WeChat es un TurboModule que admite carga diferida, lo que permite un inicio más rápido de la aplicación.
• Admite TypeScript para una mejor inteligencia y errores de escritura fáciles de verificar.
• Todas las Apis están prometidas.

Empezando

Instalación

Expo SDK 51 y anteriores

npm install [email protected]
# or
yarn add [email protected]

Expo SDK 52 y superior

npm install [email protected]
# or
yarn add [email protected]

Configuración

Abra app.json y agregue la siguiente información:

 {
    // Add your WeChat app ID
    "scheme" : [ "wx123456nxabcdefg" ] ,
    "ios" : {
      // Add your iOS universal link
      // Example "applinks:(google.com)"
      "associatedDomains" : [ "applinks:(Universal Link Here)" ]
    } ,
    // Add Expo Native Wechat plugin
    "plugins" : [ "expo-native-wechat" ]
} 

Registrar SDK

Antes de invocar cualquier API, es esencial registrar Native WeChat invocando registerApp .

 import { registerApp } from "expo-native-wechat" ;

useEffect ( ( ) => {
  return registerApp ( "wx964290141ebe9b7b" ) ;
} , [ ] ) ;

Al invocar registerApp , habrá un oyente para recibir eventos de Wechat. registerApp devuelve una función para eliminar al oyente y no se recibirán eventos de Wechat.

Invocar API

Ahora es el momento de invocar la API. Por ejemplo, enviaremos una solicitud de autenticación a Wechat y recibiremos el código. Puede utilizar la API denominada sendAuthRequest aquí.

 import { registerApp , sendAuthRequest } from "expo-native-wechat" ;
import { Button , Text } from "react-native" ;
import { verifyWechatCode } from "@/api/auth/wechat" ;

useEffect ( ( ) => {
  registerApp ( "wx964290141ebe9b7b" ) ;
} , [ ] ) ;

const onButtonClicked = async ( ) => {
  const {
    data : { code } ,
  } = await sendAuthRequest ( ) ;

  await verifyWechatCode ( code ) ;
} ;

return (
  < Button onClick = { onButtonClicked } >
    < Text > Send Auth Request </ Text >
  </ Button >
) ;

La mayoría de las API en WeChat nativo están prometidas. También lo es sendAuthRequest que devolverá una promesa. Cuando el usuario confirma la solicitud en Wechat, la promesa se resuelve en datos con un código. Todas las API prometidas devuelven un tipo genérico denominado NativeWechatResponse .

 export type NativeWechatResponse < T = Record < string , unknown > > = {
  type : string ;
  errorCode : number ;
  errorStr : string | null ;
  data : T ;
} ;

Apoyo

Si tiene problemas para utilizar esta biblioteca, no dude en abrir una incidencia. Siempre estoy aquí para ayudar.