mirror of
https://github.com/status-im/react-native.git
synced 2025-01-10 01:25:39 +00:00
b659d7f0d1
Summary: An HTTP request may be redirected to another URL, sometimes we need to know the URL where the response comes from. If the server is in control, we can add an HTTP header X-Request-URL for the redirect URL. However there will be cases that 3rd party services are used. This PR retrieves the response URL from native networking module and passes to it XMLHttpRequest. The fetch API built on XMLHttpRequest also benefits from this feature. Closes https://github.com/facebook/react-native/pull/4981 Reviewed By: svcscm Differential Revision: D2811392 Pulled By: lexs fb-gh-sync-id: 3ec356fb92f8011b6a243d6879172877a3dc498a
113 lines
2.6 KiB
JavaScript
113 lines
2.6 KiB
JavaScript
/**
|
|
* The examples provided by Facebook are for non-commercial testing and
|
|
* evaluation purposes only.
|
|
*
|
|
* Facebook reserves all rights not expressly granted.
|
|
*
|
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
|
|
* OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
* FITNESS FOR A PARTICULAR PURPOSE AND NON INFRINGEMENT. IN NO EVENT SHALL
|
|
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
|
|
* AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
|
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
*
|
|
* @flow
|
|
*/
|
|
'use strict';
|
|
|
|
var React = require('react-native');
|
|
var {
|
|
StyleSheet,
|
|
Text,
|
|
TextInput,
|
|
View,
|
|
Platform,
|
|
} = React;
|
|
|
|
|
|
class XHRExampleFetch extends React.Component {
|
|
|
|
constructor(props: any) {
|
|
super(props);
|
|
this.state = {
|
|
responseText: null,
|
|
};
|
|
this.responseURL = null;
|
|
}
|
|
|
|
submit(uri: String) {
|
|
fetch(uri).then((response) => {
|
|
this.responseURL = response.url;
|
|
return response.text();
|
|
}).then((body) => {
|
|
this.setState({responseText: body});
|
|
});
|
|
}
|
|
|
|
render() {
|
|
|
|
var responseURL = this.responseURL ? (
|
|
<View style={{marginTop: 10}}>
|
|
<Text style={styles.label}>Server response URL:</Text>
|
|
<Text>{this.responseURL}</Text>
|
|
</View>
|
|
) : null;
|
|
|
|
var response = this.state.responseText ? (
|
|
<View style={{marginTop: 10}}>
|
|
<Text style={styles.label}>Server response:</Text>
|
|
<TextInput
|
|
editable={false}
|
|
multiline={true}
|
|
defaultValue={this.state.responseText}
|
|
style={styles.textOutput}
|
|
/>
|
|
</View>
|
|
) : null;
|
|
|
|
return (
|
|
<View>
|
|
<Text style={styles.label}>Edit URL to submit:</Text>
|
|
<TextInput
|
|
returnKeyType="go"
|
|
defaultValue="http://www.posttestserver.com/post.php"
|
|
onSubmitEditing={(event)=> {
|
|
this.submit(event.nativeEvent.text);
|
|
}}
|
|
style={styles.textInput}
|
|
/>
|
|
{responseURL}
|
|
{response}
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
var styles = StyleSheet.create({
|
|
textInput: {
|
|
flex: 1,
|
|
borderRadius: 3,
|
|
borderColor: 'grey',
|
|
borderWidth: 1,
|
|
height: Platform.OS === 'android' ? 44 : 30,
|
|
paddingLeft: 8,
|
|
},
|
|
label: {
|
|
flex: 1,
|
|
color: '#aaa',
|
|
fontWeight: '500',
|
|
height: 20,
|
|
},
|
|
textOutput: {
|
|
flex: 1,
|
|
fontSize: 17,
|
|
borderRadius: 3,
|
|
borderColor: 'grey',
|
|
borderWidth: 1,
|
|
height: 200,
|
|
paddingLeft: 8,
|
|
},
|
|
});
|
|
|
|
module.exports = XHRExampleFetch;
|