پلاگین خرید درون‌برنامه‌ای React Native

برنامه نمونه

نمونه‎‌ پیاده‌سازی شده‌ پرداخت درون‌برنامه‌ای مایکت در React Native را می‌توانید از اینجا دانلود کنید.

نصب

ابتدا در پنل توسعه‌‌دهندگان مایکت، package name برنامه خود را رزرو نمایید و کلید رمز عمومی خود را از پنل توسعه‌‌دهندگان دریافت نمایید. سپس با کمک دستور زیر ماژول پرداخت درون‌برنامه‌ای مایکت را روی پروژه‌ی خود نصب کنید:

-npm i iab-myket-reactnative

توجه داشته باشید که پس از اجرای دستور بالا، dependency این ماژول، باید در فایل package.json پروژه‌ی شما به شکل زیر اضافه شده باشد:

"dependencies": {
    "iab-myket-reactnative": "^1.0.9"
}

سپس به دایرکتوری android/app/build.gradle  رفته و در در قسمت Default Config کدهای زیر را قرار دهید:

android {
    defaultConfig {
        def marketApplicationId = "ir.mservices.market"
        def marketBindAddress = "ir.mservices.market.InAppBillingService.BIND"
        manifestPlaceholders = [marketApplicationId: "${marketApplicationId}",
        marketBindAddress : "${marketBindAddress}",
        marketPermission : "${marketApplicationId}.BILLING"]
    }
}

در صورتی که پروژه‌ی شما فاقد پوشه‌ی اندروید است، می‌توانید از طریق دستور زیر آن را ایجاد کنید:

expo eject

دقت کنید که package name ماژول اندروید پروژه‌ی شما باید با package name رزرو شده در پنل توسعه‌دهندگان مایکت مطابقت داشته باشد.

پیاده‌سازی

اگر در پیاده‌سازی Component‌های خود در React native از روش Functional استفاده کردید می‌توانید از تابع useMyket به شکل زیر استفاده کنید:

import  myket  from  'myket-iab-reactnative';

function MyComponent() {
  const myketInstance = useMyket(myInAppBillingKey);
  // ...
  const someHandler = async () => {
    const inventory = await myket.queryPurchaseProduct(true, productIds);
    console.log(JSON.JSON.stringify(inventory));
  };
  // …
}

اما اگر پیاده‌سازی خود را به روش Class Component انجام دادید می‌توانید به روش زیر عمل کنید:

import myket from 'myket-iab-reactnative';
class  App extends Component 
	componentDidMount() {
		this.didMount = true;
			myket.connect(base64RSA).catch((error) => {
				/**
				* myket is not installed or RSA public key is null or empty
				*/

				this.log(error)
		    }).then(this.retrieverProducts);

	}
	componentWillUnmount() {
		myket.disconnect().catch(() =>  this.log);
	}
}

در برنامه‌ی نمونه، از روش Class Component استفاده کردیم.

آشنایی با توابع

Connect(RSAPublicKey :String)

این تابع برای مقداردهی اولیه و initialize کردن پروژه ضروری است. ورودی این تابع همان کلید رمز عمومی است که از پنل توسعه‌دهندگان مایکت دریافت کردید. این تابع یک promise به شما برمی‌گرداند. در صورتی که برنامه مایکت روی گوشی کاربر نصب نباشد، promise بازگردانده شده reject می‌شود و شما با استفاده از catch می‌توانید خطای مناسب را دریافت کنید.

Disconnect()

این تابع اتصال سرویس پرداخت درون‌برنامه‌ای مایکت را قطع و منابع اشغال شده توسط ماژول را آزاد می‌کند.

queryPurchaseProduct(querySkuDetails:Boolean,moreSku:String[])

توصیه می‌شود بعد از initialize  کردن ماژول این تابع را فراخوانی کنید. پس از فراخوانی، این تابع به شما یک promise از جنس Inventory باز می‌گرداند که شامل اطلاعات زیر است:

all Purchases: ممکن است طی فرایند خریدهای قبلی، کاربر از برنامه خارج شده یا به هر صورتی نتیجه‌ی اطلاعات خرید به برنامه‌ی شما نرسد، در این صورت اگر محصولات شما مصرف شدنی (consumable) باشد، باید بلافاصله توسط شما consume شده و به کاربر تحویل گردد.

این تابع به شما لیستی از اطلاعات خرید (Purchase) را باز می‌گرداند که شامل جزییات خریدهای مصرف نشده است.
all Products: لیست محصولات قابل ارائه توسط شما به مشتری را بازمی‌گرداند، در صورتی که می‌خواهید این لیست را دریافت کنید باید هنگام فراخوانی تابع، مقدار querySkuDetails را true بدهید تا سرویس مناسب فراخوانی شود و اطلاعات مناسب را دریافت کنید، در غیر این صورت، مقدار این پارامتر را false بدهید تا از فراخوانی سرویس بیشتر جلوگیری شود.

consumePurchase( purchase ): Promise<Void>

در صورتی که محصول شما مصرف‌ شدنی است، باید از طریق این تابع، محصول خریداری شده توسط کاربر را مصرف کنید. ورودی این تابع همان اطلاعات خرید است.

enableDebugging(enableLogCat:Boolean)

ماژول پرداخت مایکت لاگ‌های خود را با تگ “IabHelper” در خروجی لاگ‌های اندروید (LogCat) می‌نویسد. شما می‌توانید این لاگ‌ها را با استفاده از تابع زیر، فعال یا غیر فعال نمایید:

myket.enableDebugging(isEnable)

استفاده از callBack 

در صورتی که ساختار برنامه‌ی شما به گونه‌ای نیست که بتوانید از promise استفاده کنید یا به هر دلیلی نمی‌خواد از آن استفاده کنید می‌توانید به شکل زیر از ماژول MyketBillingModule استفاده کنید و نتایج را به صورت callback دریافت نمایید:

import { NativeModules } from 'react-native';
const { MyketBillingModule} = NativeModules;