Skip to content
This repository was archived by the owner on Jul 30, 2024. It is now read-only.

Commit ad420a0

Browse files
author
Akshet Pandey
committed
Add demo in README and fix android release build
1 parent 7812e13 commit ad420a0

File tree

6 files changed

+99
-56
lines changed

6 files changed

+99
-56
lines changed

‎README.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@ It offers an easy-to-use, high performance, standards-compliant, and secure way
66
Cronet has support for both Android and iOS.
77

88
This module allows you to use the Cronet stack for your react native apps.
9-
All you have to do is add this package to your project using yarn or npm.
9+
Checkout default android vs cronet comparison when loading many images
10+
11+
![Preview](docs/CronetComp.gif)
1012

1113
## NOTE
1214

‎android/build.gradle

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import groovy.json.JsonSlurper
2+
13
buildscript {
24
ext.safeExtGet = {prop, fallback ->
35
rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
@@ -55,7 +57,7 @@ dependencies {
5557
}
5658

5759
def configureReactNativePom(def pom) {
58-
def packageJson = new groovy.json.JsonSlurper().parseText(file('../package.json').text)
60+
def packageJson = new JsonSlurper().parseText(file('../package.json').text)
5961

6062
pom.project {
6163
name packageJson.title

‎android/src/main/java/com/akshetpandey/rncronet/RNCronetUrlRequestCallback.java

Lines changed: 18 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313

1414
import java.io.ByteArrayOutputStream;
1515
import java.io.IOException;
16-
import java.lang.reflect.Field;
1716
import java.nio.ByteBuffer;
1817
import java.nio.channels.Channels;
1918
import java.nio.channels.WritableByteChannel;
@@ -30,7 +29,6 @@
3029
import okhttp3.Request;
3130
import okhttp3.Response;
3231
import okhttp3.ResponseBody;
33-
import okhttp3.internal.connection.Transmitter;
3432

3533
class RNCronetUrlRequestCallback extends UrlRequest.Callback {
3634
private static final String TAG = "Callback";
@@ -39,6 +37,7 @@ class RNCronetUrlRequestCallback extends UrlRequest.Callback {
3937

4038
private Request originalRequest;
4139
private Call mCall;
40+
@Nullable
4241
private EventListener eventListener;
4342
@Nullable
4443
private Callback responseCallback;
@@ -68,25 +67,7 @@ class RNCronetUrlRequestCallback extends UrlRequest.Callback {
6867
.message("")
6968
.build();
7069
this.responseCallback = responseCallback;
71-
72-
if (eventListener != null) {
73-
this.eventListener = eventListener;
74-
} else {
75-
try {
76-
Field transmitterField = call.getClass().getDeclaredField("transmitter");
77-
transmitterField.setAccessible(true);
78-
79-
Field eventListenerField = Transmitter.class.getDeclaredField("eventListener");
80-
eventListenerField.setAccessible(true);
81-
82-
Transmitter transmitter = (Transmitter) transmitterField.get(mCall);
83-
this.eventListener = (EventListener) eventListenerField.get(transmitter);
84-
} catch (NoSuchFieldException e) {
85-
Log.e(TAG, "Invalid Reflection. Library may need to be updated");
86-
} catch (IllegalAccessException e) {
87-
Log.e(TAG, "Invalid Reflection. Library may need to be updated");
88-
}
89-
}
70+
this.eventListener = eventListener;
9071
}
9172

9273
private static Protocol protocolFromNegotiatedProtocol(UrlResponseInfo responseInfo) {
@@ -167,8 +148,10 @@ public void onRedirectReceived(UrlRequest request, UrlResponseInfo info, String
167148
public void onResponseStarted(UrlRequest request, UrlResponseInfo info) {
168149
mResponse = responseFromResponse(mResponse, info);
169150

170-
eventListener.responseHeadersEnd(mCall, mResponse);
171-
eventListener.responseBodyStart(mCall);
151+
if (eventListener != null) {
152+
eventListener.responseHeadersEnd(mCall, mResponse);
153+
eventListener.responseBodyStart(mCall);
154+
}
172155

173156
request.read(ByteBuffer.allocateDirect(32 * 1024));
174157
}
@@ -191,7 +174,9 @@ public void onReadCompleted(UrlRequest request, UrlResponseInfo info, ByteBuffer
191174

192175
@Override
193176
public void onSucceeded(UrlRequest request, UrlResponseInfo info) {
194-
eventListener.responseBodyEnd(mCall, info.getReceivedByteCount());
177+
if (eventListener != null) {
178+
eventListener.responseBodyEnd(mCall, info.getReceivedByteCount());
179+
}
195180

196181
String contentTypeString = mResponse.header("content-type");
197182
MediaType contentType = MediaType.parse(contentTypeString != null ? contentTypeString : "text/plain; charset=\"utf-8\"");
@@ -202,7 +187,9 @@ public void onSucceeded(UrlRequest request, UrlResponseInfo info) {
202187

203188
mResponseConditon.open();
204189

205-
eventListener.callEnd(mCall);
190+
if (eventListener != null) {
191+
eventListener.callEnd(mCall);
192+
}
206193

207194
if (responseCallback != null) {
208195
try {
@@ -218,7 +205,9 @@ public void onFailed(UrlRequest request, UrlResponseInfo info, CronetException e
218205
IOException e = new IOException("Cronet Exception Occurred", error);
219206
mException = e;
220207
mResponseConditon.open();
221-
eventListener.callFailed(mCall, e);
208+
if (eventListener != null) {
209+
eventListener.callFailed(mCall, e);
210+
}
222211
if (responseCallback != null) {
223212
responseCallback.onFailure(mCall, e);
224213
}
@@ -227,6 +216,8 @@ public void onFailed(UrlRequest request, UrlResponseInfo info, CronetException e
227216
@Override
228217
public void onCanceled(UrlRequest request, UrlResponseInfo info) {
229218
mResponseConditon.open();
230-
eventListener.callEnd(mCall);
219+
if (eventListener != null) {
220+
eventListener.callEnd(mCall);
221+
}
231222
}
232223
}

‎docs/CronetComp.gif

2.55 MB
Loading

‎example/App.js

Lines changed: 73 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
*/
1010

1111
import React, {Component} from 'react';
12-
import {StyleSheet, Text, View, Image} from 'react-native';
12+
import {StyleSheet, Text, View, Image, Button} from 'react-native';
1313

1414
export default class App extends Component {
1515
imageUrls = [
@@ -53,70 +53,116 @@ export default class App extends Component {
5353
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRPZus9W1U2loB-ikZmcyG7xAwtIeEUxGGHkCRrPcEeF_Ou3-5j',
5454
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ130whIfPajAnFj117D7oBkljxVcrVL4g9mwBwHmcDFXisFrGs',
5555
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRjLK_-WuC1KOJU43cLECOt9KcrNfmjbbNAr8xYB65_mTsoRbdH',
56+
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT6CgVGg5OjY7d64jvpXLs4MsWpykLmzOa_I6ClH2zLvycZ5J2c4g',
57+
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRvowRG4PoNwRWECBlAMljLxQlxFQPTQExHLkzGR-Kg_n4pos-I3Q',
58+
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQuyhDNz_ucGzC60IA5a6_mM4pKPYUHYL7sDKid5C-Jkyo0B6Ia',
59+
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRFwFaTk5hkuQAO89Oy0P8Jk9GSLXpwb9b4vgO6WZ-d3iRNW3KE',
60+
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQWA3IV-BW1OwolT3DMly8FkQ3VjtObHrBXb2L1srmR1nYt8utm',
5661
];
5762

5863
state = {
5964
google: 0,
65+
googleHeaders: '',
6066
facebook: 0,
67+
facebookHeaders: '',
6168
github: 0,
62-
apiResponse: 'test',
69+
githubHeaders: '',
70+
startLoad: 0,
6371
};
6472

65-
componentDidMount() {
73+
loadWebsites() {
6674
const time = new Date().getTime();
6775
fetch('https://www.google.com')
6876
.then(response => {
69-
this.setState({google: new Date().getTime() - time});
77+
this.setState({
78+
google: new Date().getTime() - time,
79+
googleHeaders: response.headers.get('alt-svc'),
80+
});
7081
})
7182
.catch(e => {
7283
console.log(e);
7384
});
7485

7586
fetch('https://www.facebook.com')
7687
.then(response => {
77-
this.setState({facebook: new Date().getTime() - time});
88+
this.setState({
89+
facebook: new Date().getTime() - time,
90+
facebookHeaders: response.headers.get('alt-svc'),
91+
});
7892
})
7993
.catch(e => {
8094
console.log(e);
8195
});
8296

8397
fetch('https://www.github.com')
8498
.then(response => {
85-
this.setState({github: new Date().getTime() - time});
99+
this.setState({
100+
github: new Date().getTime() - time,
101+
githubHeaders: response.headers.get('alt-svc'),
102+
});
86103
})
87104
.catch(e => {
88105
console.log(e);
89106
});
90107
}
91108

92109
render() {
93-
const imageArray = [];
94-
for (let i = 0; i < this.imageUrls.length; i += 1) {
95-
imageArray.push(
96-
<Image
97-
key={i}
98-
style={styles.image}
99-
source={{uri: this.imageUrls[i]}}
100-
/>,
110+
if (!this.state.startLoad) {
111+
return (
112+
<View style={styles.container}>
113+
<Button
114+
title="Load Images"
115+
onPress={() => this.setState({startLoad: 1})}
116+
/>
117+
<Button
118+
title="Load Websites"
119+
onPress={() => {
120+
this.loadWebsites();
121+
this.setState({startLoad: 2});
122+
}}
123+
/>
124+
</View>
125+
);
126+
}
127+
if (this.state.startLoad === 1) {
128+
const imageArray = [];
129+
for (let i = 0; i < this.imageUrls.length; i += 1) {
130+
imageArray.push(
131+
<Image
132+
key={i}
133+
style={styles.image}
134+
source={{uri: this.imageUrls[i]}}
135+
/>,
136+
);
137+
}
138+
return <View style={styles.imageContainer}>{imageArray}</View>;
139+
} else {
140+
return (
141+
<View style={styles.container}>
142+
<Text style={styles.welcome}>RNCronet Test</Text>
143+
<Text style={styles.instructions}>
144+
Google: {this.state.google}ms{'\n'}
145+
AltSvc: {JSON.stringify(this.state.googleHeaders, null, 1)}
146+
</Text>
147+
<Text style={styles.instructions}>
148+
facebook: {this.state.facebook}ms{'\n'}
149+
AltSvc: {JSON.stringify(this.state.facebookHeaders, null, 1)}
150+
</Text>
151+
<Text style={styles.instructions}>
152+
Github:{this.state.github}ms{'\n'}
153+
AltSvc: {JSON.stringify(this.state.githubHeaders, null, 1)}
154+
</Text>
155+
</View>
101156
);
102157
}
103-
return (
104-
<View style={styles.container}>
105-
<Text style={styles.welcome}>RNCronet Test</Text>
106-
<Text style={styles.instructions}>
107-
G: {this.state.google}ms F: {this.state.facebook}ms GT:{' '}
108-
{this.state.github}ms
109-
</Text>
110-
<View style={styles.imageContainer}>{imageArray}</View>
111-
</View>
112-
);
113158
}
114159
}
115160

116161
const styles = StyleSheet.create({
117162
container: {
118163
flex: 1,
119-
justifyContent: 'center',
164+
height: 500,
165+
justifyContent: 'space-evenly',
120166
alignItems: 'center',
121167
backgroundColor: '#F5FCFF',
122168
},
@@ -133,9 +179,9 @@ const styles = StyleSheet.create({
133179
imageContainer: {
134180
width: '100%',
135181
flex: 1,
182+
paddingLeft: 4,
183+
paddingTop: 10,
136184
textAlign: 'center',
137-
alignContent: 'flex-start',
138-
alignItems: 'center',
139185
flexDirection: 'row',
140186
flexWrap: 'wrap',
141187
},

‎example/android/app/src/main/java/com/example/MainActivity.java

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,8 @@ public void loadLibrary(String libName) {
4141
.setStoragePath(cacheDir.getAbsolutePath())
4242
.enableHttpCache(CronetEngine.Builder.HTTP_CACHE_DISK, 10 * 1024 * 1024)
4343
.addQuicHint("www.google.com", 443, 443)
44+
.addQuicHint("encrypted-tbn0.gstatic.com", 443, 443)
45+
.enablePublicKeyPinningBypassForLocalTrustAnchors(true)
4446
.build();
4547
URL.setURLStreamHandlerFactory(cronetEngine.createURLStreamHandlerFactory());
4648

0 commit comments

Comments
 (0)