react native 接入QQ登陆(Android)

学向勤中得,萤窗万卷书。这篇文章主要讲述react native 接入QQ登陆(Android)相关的知识,希望能为你提供帮助。

  • 【react native 接入QQ登陆(Android)】官方地址:https://wiki.connect.qq.com/qq登录
  • 添加 open_sdk_xxxx_lite.jar
  • 必要权限
< uses-permission android:name=" android.permission.INTERNET" /> < uses-permission android:name=" android.permission.ACCESS_NETWORK_STATE" /> < uses-permission android:name=" android.permission.ACCESS_WIFI_STATE" />

  • 注册 Activity
< activity android:name=" com.tencent.tauth.AuthActivity" android:launchMode=" singleTask" android:noHistory=" true" > < intent-filter> < action android:name=" android.intent.action.VIEW" /> < category android:name=" android.intent.category.DEFAULT" /> < category android:name=" android.intent.category.BROWSABLE" /> < data android:scheme=" tencent你的AppId" /> < /intent-filter> < /activity> < activity android:name=" com.tencent.connect.common.AssistActivity" android:configChanges=" orientation|keyboardHidden" android:screenOrientation=" behind" android:theme=" @android:style/Theme.Translucent.NoTitleBar" />

  • MainActivity.java
public class MainActivity extends ReactActivity {static MyListener listener; static Tencent tencent; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); tencent = Tencent.createInstance(" AppId" , this); listener = new MyListener(); }private static class MyListener implements IUiListener { @Override public void onComplete(Object o) { JSONObject jsonObject = (JSONObject) o; try { String openid = jsonObject.getString(" openid" ); WritableMap map = Arguments.createMap(); map.putString(" openid" , openid); MyModule.promise.resolve(map); } catch (JSONException e) { MyModule.promise.reject(new Exception(" 操作失败" )); }}@Override public void onError(UiError uiError) { MyModule.promise.reject(new Exception(" 操作失败" )); }@Override public void onCancel() { MyModule.promise.reject(new Exception(" 操作失败" )); } }@Override public void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); Tencent.onActivityResultData(requestCode, resultCode, data, listener); } }

  • MyModule.java 原生模块,供JS调用
public class MyModule extends ReactContextBaseJavaModule {private static ReactApplicationContext reactApplicationContext; public static Promise promise; @NonNull @Override public String getName() { return " MyModule" ; }MyModule(@NonNull ReactApplicationContext reactContext) { super(reactContext); reactApplicationContext = reactContext; }@ReactMethod public void qqLogin(Promise promise) { MyModule.promise = promise; MainActivity.tencent.login(getCurrentActivity(), " all" , MainActivity.listener); }}

  • MyPackage.java 注册模块
public class MyPackage implements ReactPackage { @NonNull @Override public List< NativeModule> createNativeModules(@NonNull ReactApplicationContext reactContext) { List< NativeModule> modules = new ArrayList< > (); modules.add(new MyModule(reactContext)); return modules; }@NonNull @Override public List< ViewManager> createViewManagers(@NonNull ReactApplicationContext reactContext) { return Collections.emptyList(); } }

  • javascript 端访问
import { ToastAndroid, NativeModules } from ‘react-native‘; NativeModules.MyModule.qqLogin().then(({ openid }) => { ToastAndroid.show(openid, ToastAndroid.SHORT) }).catch(reason => { console.log(reason) })


    推荐阅读