expo native wechat

معرض Wechat الأصلي

وحدة Expo لدعم واجهات برمجة تطبيقات Wechat على Android وiOS

لمشروع Bare React Native

يرجى الرجوع إلى Wechat الأصلي

تحفيز

معظم المطورين الذين يستخدمون React Native لإنشاء التطبيقات ليسوا مجهزين بمهارات التطوير الأصلية، ناهيك عن ربط تطبيقاتهم بـ WeChat.

على وجه الخصوص، يعد WeChat OpenSDK أمرًا مؤلمًا بسبب المستندات الرديئة حيث لا تكون الكثير من واجهات برمجة التطبيقات واضحة وبديهية. لمساعدة المطورين الذين يستخدمون React Native، حاولت قدر الإمكان إنشاء هذه المكتبة. وآمل أن تستفيد من هذا وأن تكون أقل إحباطًا من WeChat.

لماذا

• يعد تطبيق WeChat الأصلي جديدًا، ولم تعد العديد من المكتبات المشابهة تتم صيانتها ومواكبة أحدث إصدارات WeChat.
• يدعم WeChat الأصلي كلاً من بنية React Native القديمة والجديدة.
• Native WeChat عبارة عن وحدة TurboModule تدعم التحميل البطيء، مما يسمح ببدء تشغيل التطبيق بشكل أسرع.
• يدعم TypeScript لتحسين التحسس وسهولة التحقق من أخطاء الكتابة.
• جميع أبيس موعودة.

ابدء

تثبيت

معرض SDK 51 وما دونه

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

معرض SDK 52 وما فوق

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

إعدادات

افتح app.json وأضف المعلومات التالية:

 {
    // 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" ]
} 

سجل SDK

قبل استدعاء أي واجهات برمجة التطبيقات، يعد تسجيل WeChat الأصلي عن طريق استدعاء registerApp أمرًا ضروريًا.

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

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

عند استدعاء registerApp ، سيكون هناك مستمع لتلقي الأحداث من Wechat. يقوم registerApp بإرجاع وظيفة لإزالة المستمع، ولن يتم تلقي أي أحداث من Wechat.

استدعاء API

الآن هو الوقت المناسب لاستدعاء API. على سبيل المثال، سنرسل طلب مصادقة إلى Wechat ونتلقى الرمز. يمكنك استخدام واجهة برمجة التطبيقات المسماة sendAuthRequest هنا.

 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 >
) ;

يتم الوعد بمعظم واجهات برمجة التطبيقات في WeChat الأصلية. وكذلك الأمر sendAuthRequest الذي سيعيد وعدًا. عندما يؤكد المستخدم الطلب على Wechat، يتم حل الوعد على أنه بيانات برمز. تقوم جميع واجهات برمجة التطبيقات الموعودة بإرجاع نوع عام يسمى NativeWechatResponse .

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

يدعم

إذا كنت تواجه مشكلة في استخدام هذه المكتبة، فلا تتردد في فتح موضوع. أنا دائما هنا للمساعدة.