Update Readme

git-Asir · Apr 20, 2017 · 7d56b08 · 7d56b08
1 parent bbb494e
commit 7d56b08
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 57 deletions.
diff --git a/README.md b/README.md
@@ -1,66 +1,46 @@
 
 # react-native-alibc-sdk
 
-目前项目已经实现的功能有：淘宝登录授权、设置淘客参数、打开宝贝详情页， 其它功能正在积极开发中。
+基于阿里百川SDK， 封装出React Native接口， 方便在RN应用中集成阿里百川SDK的各种功能。
 
-## Getting started
+# 功能
+1. 淘宝登录授权
+2. 淘客参数设置
+3. 通过手淘App和H5方式打开宝贝页面、购物车页面、订单页面，添加购物车页面和Url链接， 并获取交易回调信息，实现交易闭环。
+4. 通过在react-native内嵌入WebView方式打开宝贝页面、购物车页面、订单页面，添加购物车页面和Url链接， 并获取交易回调信息，实现App内交易闭环。
 
-`$ npm install react-native-alibc-sdk --save`
+# 快速开始
 
-### Mostly automatic installation
+1. 进入阿里百川开发者控制台 -> 创建应用 -> 在我的产品后台开通百川电商SDK -> 在API申请开通初级电商能力和无线开放百川淘宝客
+2. git clone https://github.com/zzz945/RNAlibcSdkDemo
+3. cd RNAlibcSdkDemo; npm install
+4. 用xcode打开RNAlibcSdkDemo/ios/下的工程， 配置URL Types为tbopen{AppKey}， 比如tbopen123456。 其中AppKey可以在百川后台查到
+5. 在百川后台下载安全图片， 替换ios/yw_1222.jpg和android/app/src/main/res/drawable/yw_1222.jpg
+6. 在RNAlibcSdkDemo／app.js中替换自己的pid参数， 当开通阿里妈妈后， pid参数可在百川后台查到
+7. react-native run-ios(android)
 
-`$ react-native link react-native-alibc-sdk`
+![login](https://cloud.githubusercontent.com/assets/21496977/25235890/0975d240-2619-11e7-80c4-b18b521f8906.gif)
+![show](https://cloud.githubusercontent.com/assets/21496977/25235905/13f00f1a-2619-11e7-83db-20c7a8d2c41a.gif)
+![webview](https://cloud.githubusercontent.com/assets/21496977/25235918/1beae8e8-2619-11e7-8297-ab7e36b02faf.gif)
 
-### Manual installation
+# DIY (适用于在现有RN工程基础上添加百川)
 
+1. 进入阿里百川开发者控制台 -> 创建应用 -> 在我的产品后台开通百川电商SDK -> 在API申请开通初级电商能力和无线开放百川淘宝客。
+2. npm i https://github.com/zzz945/react-native-alibc-sdk.git --save
+3. react-native link react-native-alibc-sdk
 
-#### iOS
+## Ios （参考 http://baichuan.taobao.com/docs/doc.htm?spm=a3c0d.7629140.0.0.VWjqPl&treeId=129&articleId=105648&docType=1 以及Demo工程配置）
 
-1. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]`
-2. Go to `node_modules` ➜ `react-native-alibc-sdk` and add `RNAlibcSdk.xcodeproj`
-3. In XCode, in the project navigator, select your project. Add `libRNAlibcSdk.a` to your project's `Build Phases` ➜ `Link Binary With Libraries`
-4. Run your project (`Cmd+R`)<
-
-#### Android
-
-1. Open up `android/app/src/main/java/[...]/MainActivity.java`
-  - Add `import com.daiyan.RNAlibcSdkPackage;` to the imports at the top of the file
-  - Add `new RNAlibcSdkPackage()` to the list returned by the `getPackages()` method
-2. Append the following lines to `android/settings.gradle`:
-  	```
-  	include ':react-native-alibc-sdk'
-  	project(':react-native-alibc-sdk').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-alibc-sdk/android')
-  	```
-3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:
-  	```
-      compile project(':react-native-alibc-sdk')
-  	```
-
-
-## Usage
-
-Demo：https://github.com/zzz945/RNAlibcSdkDemo
-<br>
-如果已安装和登录手淘app， 会唤起app授权，无需输入用户名密码。
-
-![demo_login](https://cloud.githubusercontent.com/assets/21496977/24909124/33949adc-1ef5-11e7-9a2f-a467a4d920d4.gif)
-
-### 环境配置
-
-进入阿里百川开发者控制台 -> 创建应用 -> 在我的产品后台开通百川电商SDK -> 在API申请开通初级电商能力和无线开放百川淘宝客。
-
-#### Ios （参考 http://baichuan.taobao.com/docs/doc.htm?spm=a3c0d.7629140.0.0.VWjqPl&treeId=129&articleId=105648&docType=1 以及Demo工程配置）
-
-1. 配置URL Types为tbopen{AppKey}， 比如tbopen123456。
-2. 在info.plist中,增加LSApplicationQueriesSchemes字段,并添加tbopen,tmall。
-3. 配置ATS, 允许HTTP请求。
-4. 上传BundleID， 获取安全图片放到工程目录底下， 并将安全图片加入工程(Build phases -> 
+4. 配置URL Types为tbopen{AppKey}， 比如tbopen123456。
+5. 在info.plist中,增加LSApplicationQueriesSchemes字段,并添加tbopen,tmall。
+6. 配置ATS, 允许HTTP请求。
+7. 上传BundleID， 获取安全图片放到工程目录底下， 并将安全图片加入工程(Build phases -> 
 Copy Bundle Resources）。
-5. 将node_modules/react-native-alibc-sdk/ios/AlibcTradeSDK/Frameworks和Reaources全部加入工程。参考Demo的工程配置， 添加其它依赖库。
-6. 参考Demo的工程配置， 配置Framework Search Paths和Header Search Paths。
-7. Other Linker flags中添加-lc++和-lstdc++。
-8. 关闭bitcode（build settings -> build options）
-9. 参考DEMO添加下面代码到AppDelegate.m, 让sdk处理应用跳转结果。
+8. 将node_modules/react-native-alibc-sdk/ios/AlibcTradeSDK/Frameworks和Reaources全部加入工程。参考Demo的工程配置， 添加其它依赖库。
+9. 参考Demo的工程配置， 配置Framework Search Paths和Header Search Paths。
+10. Other Linker flags中添加-lc++和-lstdc++。
+11. 关闭bitcode（build settings -> build options）
+12. 参考DEMO添加下面代码到AppDelegate.m, 让sdk处理应用跳转结果。
 	```
 	#import <AlibcTradeSDK/AlibcTradeSDK.h>
 	...
@@ -91,9 +71,10 @@ Copy Bundle Resources）。
 	...
 	```
 
-#### Android （参考 http://baichuan.taobao.com/docs/doc.htm?spm=a3c0d.7629140.0.0.Qn05oE&treeId=129&articleId=105647&docType=1 以及Demo工程配置）
-1. 上传用于调试的app-debug.apk（发布时再上传签名的apk）， 获取安全图片放在（res/drawable/yw_1222.jpg）。
-2. AndroidManifest.xml:
+## Android （参考 http://baichuan.taobao.com/docs/doc.htm?spm=a3c0d.7629140.0.0.Qn05oE&treeId=129&articleId=105647&docType=1 以及Demo工程配置）
+
+4. 上传用于调试的app-debug.apk（发布时再上传签名的apk）， 获取安全图片放在（res/drawable/yw_1222.jpg）。
+5. AndroidManifest.xml:
 	```
 	<manifest ...
 		xmlns:tools="http://schemas.android.com/tools"
@@ -105,7 +86,7 @@ Copy Bundle Resources）。
 		...
 	</manifest>
 	```
-3. build.gradle:
+6. build.gradle:
 	```
 	...
 	allprojects {
@@ -119,6 +100,6 @@ Copy Bundle Resources）。
 	}
 	...
 	```
-### API文档（TODO）
+# API文档（TODO）
 
 	参考Demo。
diff --git a/ios/AlibcTradeWebViewManager.m b/ios/AlibcTradeWebViewManager.m
@@ -62,7 +62,7 @@ - (UIView *)view
 }
 - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
 {
-    RCTLog(@"Loading URL :%@",request.URL.absoluteString);
+    //RCTLog(@"Loading URL :%@",request.URL.absoluteString);
     NSString* url = request.URL.absoluteString;
     if ([url hasPrefix:@"http://login.m.taobao.com/"] ||
             [url hasPrefix:@"http://"]  ||