开发步骤
- 安装WebStorm，激活使用
- 安装node到默认位置
- 配置npm的镜像资源（国内访问
- npm安装yarn、react-native-cli
- 在WebStorm新建项目，选择React-Native，并选择保存地址，设置项目名称，进行创建
环境配置
- init新建一个项目之后，将node_modules删除，并且在项目文件夹中执行npm install， 重新安装所有的插件。
- 选择要用的组件，进行 npm install yourComponent --save
- 可以使用yarn add 代替 npm installl
iOS开发者证书申请
- 拥有一个iOS开发者账号，$99一年
- 在Xcode9中打开React-Native项目中的../<name>/ios/***.xcodeproj
- 修改Bundle Identifier【重要】(后面会在JPush推送设置中使用，务必小心统一)
- 选择Signing中的Team
- 进入Capabilities，打开Push Notifications，稍等一会即可，再打开Background Modes，选择最后一个Remote notifications
- 进入开发者证书配置，直接选择App IDs，找到ID为你设置的Bundle Identifier的项目，点击展开，最下面找到Edit，找到Push Notifications
- Create an additional certificate to use for this App ID. 开发环境和生产环境，全部变绿即可
极光官网配置
- 进入极光开发者服务，创建一个应用，应用名 按照要求填写，自己上传图标
- 创建成功，看到AppKey，在下面找到推送设置，开始配置
- 采用Token Authentication，在开发者网站，找到Keys，点击加号，生成一个Key，名字自定，下载到本地（重要，保存）
- 在配置页面，进行iOS配置，上传APNs Auth Key，选择上面生成的文件
- 在开发者网站中，找到刚刚生成的Key ID，复制到配置界面
- 在[开发者网站]中，找到Team ID，复制到配置界面
- 在Bundle ID中，填写你设置的Bundle ID，配置完成，保存，然后在选择鉴权方式中选择Token Authentication
JPush 极光推送配置
- npm install jpush-react-native --save执行成功
- npm install jcore-react-native —save执行成功
- jpush需要的组件安装完毕，在极光官网创建一个项目，找到appKey
- 在项目目录中执行 npm run configureJPush <yourAppKey> <yourModuleName>
- 上述执行成功后，执行react-native link
- 参考极光推送React-Native进行手动配置
- 需要iOS开发者证书支持
手动配置iOS
- Xcode9打开项目文件，找到info.plist，设置ATS权限
App Transport Security Settings
添加Allow Arbitrary Loads : YES，
子目录下Exception Domains
添加jpush.cn
jpush.cn下添加
NSExceptionAllowsInsecureHTTPLoads ： YES
NSIncludesSubdomains ： YES -
Build Phases中Link Binary With Libraries，找到UserNotifications.framework 状态改为 Optional
手动配置Android
- 在 ../android/app/src/main/java/com/***/MainApplication.java 中添加
public class MainApplication extends Application implements ReactApplication `中添加 private boolean SHUTDOWN_TOAST = false; private boolean SHUTDOWN_LOG = false; protected List<ReactPackage> getPackages()中添加 new JPushPackage(SHUTDOWN_TOAST, SHUTDOWN_LOG)``` 最后一行不许有逗号 - 在 ../android/app/build.gradle中修改
...
defaultConfig{
applicationId "<yourBundleID>" // 修改为极光推送中android应用包名
...
manifestPlaceholders = [ // 添加
JPUSH_APPKEY: "<yourAPPKEY>", // 极光推送中应用AppKey
APP_CHANNEL: "developer-dange" //下载渠道
]
}
}
- 修改 MainActivety.java 中的包名，改为BundleID；
- 修改MainApplication.java 中的包名，改为BundleID；
- 修改AndroidManifest.xml中的包名，改为BundleID；
- 根据包名修改文件关系
作者介绍
安徽安大笃北信息科技有限责任公司 端工程师 DAN 花名：太子 QQ:542168513
