iOS APP 集成

目前，环信的 React Native iOS Demo 已经提供登录、注册、好友、群组、聊天等功能。您可以在您的 React Native 项目中集成 iOS Demo，以便直接获得即时通讯功能。

在环信官网扫码下载，然后按照指示安装。

注意：安装后需要添加企业信任才能正常运行（设置 → 通用 → 设备管理 → EaseMob Inc → 点击信任）。

GitHub 下载地址：https://github.com/easemob/webim-react-native

安装 iOS 和 android 的开发环境。React Native 官方文档：https://facebook.github.io/react-native/docs/getting-started.html

打开 Xcode，安装 iOS 模拟器。

xcode → Preferences→ Components → iOS x.x Simulator

注意：以下步骤，集成 iOS 和 Android 时，只执行一次即可。

1. 解压缩 Demo 源码，进入项目所在文件夹，执行如下命令，进行项目初始化。

$ npm run newclear

初始化完成后，项目下会自动生成node_modules文件夹。

2. 修改 node_modules/axios/lib/utils.js 文件。

function isStandardBrowserEnv() {
  return false;
}

3. 去工程Libraries中找到：RCTNetwork.xcodeproj / RCTNetworking.mm / RCTGenerateFormBoundary，去掉特殊字符 / . 等；或者去 node_modules/react-native/Libraries/Network/RCTNetworking.mm 修改。

因为上传文件时服务端rest服务会限制content-type不能出现特殊字符。

//修改后： 
const char *boundaryChars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";

1. 默认没有添加签名的情况下请编译debug版本，直接编译release版本会无法正常运行。

• 使用Xcode打开项目，选择 app，在 info 页签，选择 Use Debug for command-line builds。
• 在Xcode项目中，选择 Product → Scheme → Edit Scheme (cmd + <)，打开 Run 页签，将 Build Configuration 设置为 Debug。

2. 目前代码版本0.2.0，请看项目目录下package.json → version属性，如果不是，请更新代码，并保留node_modules文件夹。

3. 0.2.0版本部分依赖的模块升级请先运行`npm install`安装升级包，安装完成后，清理缓存。

• npm run clean
• 打开xcode项目，选择product → clean
• 如果之前有编译时自动打开的终端，请关闭终端

4. 关于node_modules文件夹。

初始化时，在根目录下执行npm run newclear后，会生成node_modules文件夹，是项目运行所需要的基础依赖包。

由于node_modules比较大，400mb左右, 安装时耗时比较久，所以已经install过node_modules的项目，可以备份node_modules。当安装新的项目的时候，拷贝node_modules到新项目，并运行npm install, 如果此步无法正常运行项目再执行上面的“初始化”流程。

执行如下命令，在模拟器中运行 iOS Demo。

react-native run-ios --simulator "iPhone 7"

模拟器运行时的操作：

• cmd + d 调出控制台
• cmd + r reload

注意：如果执行命令时报“CFBundleIdentifier” Does Not Exist这个错误，请参考下一步先配置Xcode。

1. 配置 Xcode。

• Targets → app → General → Signing →添加一个个人icloud账户
• 添加team，并定义一个唯一的Bundle Identifier 如：org.reactjs.native.example.app.lwz
  • Targets → app → General → Signing → Team
  • Targets → app → General → Signing → Signing Certificate
  • Targets → app → General → Identity → Bundle Identifier → 修改唯一id标示
  • Targets → appTests → General → Signing → Team
  • Targets → appTests → General → Signing → Signing Certificate
  • 选择 Product → Scheme → Edit Scheme (cmd + <)，打开 Run 页签，将 Build Configuration 设置为 Release。

2. Xcode 保证app/main.jsbundle可用，没有自行添加索引。

• main.jsbundle 生成方式
  • curl的方式打包 https://github.com/facebook/react-native/issues/5747
  • react-native bundle –dev false –platform ios –entry-file ./index.ios.js –bundle-output ./ios/app/main.jsbundle
    • 此种方式打包不支持npm link， 需要先npm unlink easemob-websdk

3. 关掉npm start启动的控制台。

• 因为打包时会判断是否有packager在运行，有的话直接使用。
• 但是打包用的是release版本， 非dev，打包后会报babel的错，如上。

4. 在xcode通过正常run编译到手机。

在 Xcode 中，选择设备，然后点击 Run。

• 没有packager启动时，会自动启动一个packager，这时打包的即为发布版本。
• 注意：跟本地之前引入的main.jsbundle没有关系，打包文件并不会更新到本地。

5. 信任证书：

选择“ios设备 → General → Device Management → persion Certificate → trust it”。

成功运行后，如果是debug模式可以晃动手机调出控制台。

$ npm start
$ react-native run-ios --simulator "iPhone 7"
$ react-native run-ios
$ react-native bundle --dev false --platform ios --entry-file ./index.ios.js --bundle-output ./ios/app/main.jsbundle

注意事项：

• 切换debug 或 release 版本都需要关闭控制台。
• 执行react-native run-ios –simulator “iPhone 7”命令时，需保证没有真机连接到电脑。如果有真机连接到电脑，那么多个设备均可以编译成功，但是无法正常启动。

Q: 如果编译不生效，怎么办？

A: 可以尝试先clean（在 Xcode 中，选择“Product → Clean”），关掉package控制台，再run。