從最外層源代碼來看，React Native初始化過程分為兩步：獲取JS代碼包的URL和創建RCTRootView實例，如下所示。
#import "AppDelegate.h"
#import "RCTBundleURLProvider.h"
#import "RCTRootView.h"
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSURL *jsCodeLocation;
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"AwesomeProject"
initialProperties:nil
launchOptions:launchOptions];
}
@end
其中，JS代碼包URL的獲取是通過RCTBundleProvider這個類實現的。JS代碼包的URL有兩種可能結果，一種是Packager Server URL，一種是本地JS代碼包的文件路徑。通過jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];去獲取JS代碼包URL時，會首先檢查是否有正在運行的Packager Server，如果有則返回相應Packager Server中JS代碼包的絕對路徑；如果沒有正在運行的Packager Server，則會返回一個本地JS代碼包的文件路徑，不傳遞fallbackResource參數時，默認返回 本地main.jsbundle的文件路徑。
接下來，我們具體分析一下RCTBundleProvider的工作原理。首先看看RCTBundleProvider提供的幾個重要方法。
serverRootWithHost
static NSURL *serverRootWithHost(NSString *host)
{
return [NSURL URLWithString:
[NSString stringWithFormat:@"http://%@:%lu/",
host, (unsigned long)kRCTBundleURLProviderDefaultPort]];
}
該方法會根據傳進去的host返回相應的Packager Server URL。例如，當傳入的host為localhost時，返回的URL為http://localhost:8081/，其中8081是默認端口號，存儲在常量kRCTBundleURLProviderDefaultPort中。
isPackagerRunning
- (BOOL)isPackagerRunning:(NSString *)host
{
NSURL *url = [serverRootWithHost(host) URLByAppendingPathComponent:@"status"];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
NSURLResponse *response;
NSData *data = [NSURLConnection sendSynchronousRequest:request returningResponse:&response error:NULL];
NSString *status = [[NSString alloc] initWithData:data encoding:NSUTF8StringEncoding];
return [status isEqualToString:@"packager-status:running"];
}
該方法會判斷指定host上的Packager Server是否在運行。首先，通過serverRootWithHost方法獲取該host的Packager Server URL，然后在Packager Server URL的末尾加上路徑status構成新的URL，訪問該URL，如果返回結果等于packager-status:running，則證明指定host上的Packager Server正在運行。例如，當傳入的host為localhost時，訪問http://localhost:8081/status，如果請求返回結果為packager-status:running，則證明localhost上的Packager Server在運行狀態。
guessPackagerHost
- (NSString *)guessPackagerHost
{
static NSString *ipGuess;
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
NSString *ipPath = [[NSBundle mainBundle] pathForResource:@"ip" ofType:@"txt"];
ipGuess = [[NSString stringWithContentsOfFile:ipPath encoding:NSUTF8StringEncoding error:nil]
stringByTrimmingCharactersInSet:[NSCharacterSet newlineCharacterSet]];
});
NSString *host = ipGuess ?: @"localhost";
if ([self isPackagerRunning:host]) {
return host;
}
return nil;
}
這個方法比較有意思，顧名思義，就是猜測Packager Server的host。第一次訪問該方法的時候，它會首先嘗試讀取本地的ip.txt文件，并把文件內容存進靜態變量ipGuess中。如果最后得到的ipGuess的值不為空，則使用ipGuess作為host，否則默認使用localhost作為host。最后，還需要通過isPackagerRunning方法判斷得到的host上是否有Packager Server在運行，如果有才返回該host作為Packager Host，否則返回nil。
ip.txt文件是在項目編譯運行的時候通過react-native-xcode.sh腳本生成的。在Debug模式下，react-native-xcode.sh腳本會自動獲取電腦網卡en0的ip地址并存進ip.txt，如下所示。
if [[ "$CONFIGURATION" = "Debug" && "$PLATFORM_NAME" != "iphonesimulator" ]]; then
PLISTBUDDY='/usr/libexec/PlistBuddy'
PLIST=$TARGET_BUILD_DIR/$INFOPLIST_PATH
IP=$(ipconfig getifaddr en0)
$PLISTBUDDY -c "Add NSAppTransportSecurity:NSExceptionDomains:localhost:NSTemporaryExceptionAllowsInsecureHTTPLoads bool true" "$PLIST"
$PLISTBUDDY -c "Add NSAppTransportSecurity:NSExceptionDomains:$IP.xip.io:NSTemporaryExceptionAllowsInsecureHTTPLoads bool true" "$PLIST"
echo "$IP.xip.io" > "$DEST/ip.txt"
fi
這樣，在使用iphone真機調試時，只要保證iphone和電腦在同一局域網內，iphone上的React Native程序即可從電腦上運行的Packager Server加載JS代碼包，無需再手動設置jsCodeLocation。
packagerServerHost
- (NSString *)packagerServerHost
{
NSString *location = [self jsLocation];
if (location != nil) {
return location;
}
#if RCT_DEV
NSString *host = [self guessPackagerHost];
if (host) {
return host;
}
#endif
return nil;
}
該方法用于獲取Packager Server Host。那既然有了guessPackagerHost，還要這個方法干什么呢？原來，為了給使用者定制Packager Server Host的機會，RCTBundleProvider類提供了jsLocation屬性，通過設置jsLocation屬性可以直接指定Packager Server Host。因此，packagerServerHost方法首先檢查jsLocation屬性值，如果jsLocation屬性值不為空，則返回 jsLocation值作為Packager Server Host，否則如果是Debug模式，則繼續通過guessPackagerHost方法獲取Packager Server Host。以上方法都獲取不到Packager Server Host時，則返回nil。
packagerServerURL
- (NSURL *)packagerServerURL
{
NSString *const host = [self packagerServerHost];
return host ? serverRootWithHost(host) : nil;
}
該方法很簡單，首先通過packagerServerHost方法獲取Packager Server Host，然后通過serverRootWithHost方法獲取Packager Server URL。
實例方法 jsBundleURLForBundleRoot
- (NSURL *)jsBundleURLForBundleRoot:(NSString *)bundleRoot fallbackResource:(NSString *)resourceName
{
resourceName = resourceName ?: @"main";
NSString *packagerServerHost = [self packagerServerHost];
if (!packagerServerHost) {
return [[NSBundle mainBundle] URLForResource:resourceName withExtension:@"jsbundle"];
} else {
return [[self class] jsBundleURLForBundleRoot:bundleRoot
packagerHost:packagerServerHost
enableDev:[self enableDev]
enableMinification:[self enableMinification]];
}
}
該方法會返回最終的JS代碼包URL。它接收兩個參數，一個bundleRoot，指的是Packager Server中js代碼包的入口文件名。另一個是fallbackResource，指的是本地JS代碼包的資源文件名，當找不到Packager Server Host時，會根據該資源文件名返回本地JS代碼包的文件路徑。
類方法 jsBundleURLForBundleRoot
+ (NSURL *)jsBundleURLForBundleRoot:(NSString *)bundleRoot
packagerHost:(NSString *)packagerHost
enableDev:(BOOL)enableDev
enableMinification:(BOOL)enableMinification
{
NSURLComponents *components = [NSURLComponents componentsWithURL:serverRootWithHost(packagerHost) resolvingAgainstBaseURL:NO];
components.path = [NSString stringWithFormat:@"/%@.bundle", bundleRoot];
// When we support only iOS 8 and above, use queryItems for a better API.
components.query = [NSString stringWithFormat:@"platform=ios&dev=%@&minify=%@",
enableDev ? @"true" : @"false",
enableMinification ? @"true": @"false"];
return components.URL;
}
該類方法與實例方法jsBundleURLForBundleRoot同名，但是該方法只用于生成Packager Server的JS代碼包URL。
介紹完RCTBundleProvider的重要方法，最后簡單梳理一下RCTBundleProvider的調用流程。
實例方法jsBundleURLForBundleRoot作為入口方法被調用，在該方法里面，先嘗試獲取Packager Server Host。如果獲取到可用的Packager Server Host，則返回Packager Server中JS代碼包的URL作為jsCodeLocation。如果沒有獲取到可用的Packager Server Host，則返回一個本地JS代碼包的文件路徑作為jsCodeLocation。
