npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

react-native-mipush

v0.2.0

Published

小米 Push 的 React Native 封装。

Downloads

10

Readme

小米 Push 的 React Native 封装。

  • 非官方发布。

安装

npm install --save react-native-mipush
rnpm link react-native-mipush

Android

  • 在 rnpm link 的基础上对 MainActivity.java 做以下修改:
// ...
public class MainActivity extends ReactActivity {
    private MiPushPackage mMiPushPackage;            <---- 添加

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        mMiPushPackage = new MiPushPackage(this);    <---- 添加
        super.onCreate(savedInstanceState);
    }

    @Override
    protected void onNewIntent(Intent intent) {      <---- 添加这个方法
        super.onNewIntent(intent);
        setIntent(intent);
        mMiPushPackage.onIntent(intent);
    }

    // ...
    @Override
    protected List<ReactPackage> getPackages() {
        return Arrays.asList(
            new MainReactPackage(),
            mMiPushPackage,         // <------ 修改自动生成的 new MiPushPackage
    // ...
  • AndroidManafest.xml 中修改 application 的 android:name 为 com.xiaomi.push.reactnative.MiPushApplication,并添加你的 MIPUSH_APP_ID 和 MIPUSH_APP_KEY:

注意:由于小米的 AppID 和 AppKey 都是纯数字,需要在前面加上 \ 来转义!

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="cn.applean.apprunner"
    android:versionCode="1"
    android:versionName="1.0.0">
    <application
      android:name="com.xiaomi.push.reactnative.MiPushApplication"  <----- 这里

      .... 添加以下两行,替换称自己的 APP_ID 和 APP_KEY

      <meta-data android:value="\ 12345678901234567890" android:name="MIPUSH_APP_ID" />
      <meta-data android:value="\ 12345678" android:name="MIPUSH_APP_KEY" />

iOS

Info.plist 用文本编辑器打开,添加以下代码:

<dict>
    <key>MiSDKAppID</key>
    <string>1000888</string>   <---- 替换为自己的
    <key>MiSDKAppKey</key>
    <string>500088888888</string>   <---- 替换为自己的
    <key>MiSDKRun</key>
    <string>Online</string>    <---- Online 表示正式环境,Debug 表示 Sandbox 环境
</dict>

AppDelegate.m 添加以下代码

#import "RCTMiPush.h"
// ...
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    // ...
    NSDictionary *initialProperties = [RCTMiPush initAndGetInitialPropertiesFromLaunchOptions:launchOptions];
    // ...
    RCTRootView *rootView =
        [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                    moduleName:@"RNTest"
                             initialProperties:initialProperties  // <-- 修改这里
                              launchOptions:launchOptions];
    // ...
}

// 添加以下这些代码
#pragma mark UIApplicationDelegate
- (void)application:(UIApplication *)app didFailToRegisterForRemoteNotificationsWithError:(NSError *)err
{
  // 注册APNS失败
  [RCTMiPush didFailToRegisterForRemoteNotificationsWithError:err];
}
- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings
{
  [RCTMiPush didRegisterUserNotificationSettings:notificationSettings];
}
// Required for the register event.
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
  [RCTMiPush didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
}
// Required for the notification event.
- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)notification
{
  [RCTMiPush didReceiveRemoteNotification:notification];
}
// Required for the localNotification event.
- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification
{
  [RCTMiPush didReceiveLocalNotification:notification];
}

JS 中使用

由于目前还没有对 iOS 和 Android 版本做接口统一,所以两个平台有所区别,以后版本有可能修改为统一接口。

1.引入模块

import MiPush from 'react-native-mipush'

2.获取启动参数,用于响应点击 Push 消息跳转到应用内

方法1:

    MiPush.getInitialMessage()
    .then((message) => {
      console.log('===== initial push:', message)
    })

方法2: 通过根 Component 的 props 获取

3.启动后点击的新消息

    DeviceEventEmitter.addListener("xiaomipush", this._handlePush)

两个平台参数没有统一,目前需要自己分别处理。

4.启动 Push 代码

Android: 已经在 application 中启动

iOS:

    MiPush.registerMiPushAndConnect(true, 0)

接口文档

待写。

限制

由于 React Native 的 JS 代码只有 UI 在前台时才可执行,所以在 Activity 在前台时能够处理所有消息,不在前台时只能处理点击打开界面的通知栏消息。

License

MIT.