re questsダウンロード - re questsソースコードのダウンロード

re quests

その他のカテゴリー

1.0.0

ダウンロード

リクエスト

React の宣言型ネットワーキング。

クイックスタート

1. NPM (または Yarn) を使用してインストールします

 npm install --save re-quests

2. Requestをレンダリングしてネットワークリクエストを起動します。

 import Request from 're-quests' ;

...
render (
    < Request
        url = 'https://my-awesome-doma.in/me'
        onSuccess = { this . myAwesomeResponseHandler } >
    
        < div > { /* use View for react-native */ }
            < Request . Start >
                < MyAwesomeSpinner />
            </ Request . Start >
            < Request . Success >
                < MyAwesomeContent content = { this . state . content } />
            </ Request . Success >
            < Request . Failure >
                < MyAwesomeErrorMessage />
            </ Request . Failure >
        </ div >
    </ Request >
)

3. 応答を希望どおりに処理します。

 myAwesomeResponseHandler = ( response ) => {
    // set a local state
    this . setState ( {
        content : response . data
    } ) ;
    
    // or dispatch an event
    // this.props.dispatch(myAwesomeAction(response.data));
}

レシピ

よくある日常の問題とその方法については、レシピページをご覧ください。

開示

リクエストの送信に使用されるライブラリは axios です。 Requestコンポーネントは単なる宣言的なラッパーであり、axios の機能の一部を公開します。

小道具

 // `url` is the server URL that will be used for the request
url: PropTypes . string . isRequired ,

// the http method is not required by axios &
// defaults to 'get' if not provided
method : PropTypes . oneOf ( [ 'get' , 'post' , 'put' , 'patch' , 'delete' , 'head' ] ) ,

// `headers` are custom headers to be sent
headers : PropTypes . object ,

// `params` are the URL parameters to be sent with the request
// Must be a plain object or a URLSearchParams object
params : PropTypes . object ,

// `data` is the data to be sent as the request body
// Only applicable for request methods 'PUT', 'POST', and 'PATCH'
// When no `transformRequest` is set, must be of one of the following types:
// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
// - Browser only: FormData, File, Blob
// - Node only: Stream
data : PropTypes . oneOfType ( [
    PropTypes . string ,
    PropTypes . object ,
    PropTypes . instanceOf ( ArrayBuffer ) ,
    PropTypes . instanceOf ( ArrayBufferView ) ,
    PropTypes . instanceOf ( URLSearchParams )
] ) ,

// `paramsSerializer` is an optional function in charge of serializing `params`
// (e.g. https://www.npmjs.com/package/qs, http://api.jquery.com/jquery.param/)
// default: function(params) { return Qs.stringify(params, {arrayFormat: 'brackets'}) }
paramsSerializer : PropTypes . func ,

// `transformRequest` allows changes to the request data before it is sent to the server
// This is only applicable for request methods 'PUT', 'POST', and 'PATCH'
// The last function in the array must return a string, an ArrayBuffer, FormData, or a Stream
transformRequest : PropTypes . arrayOf ( PropTypes . func ) ,

// `transformResponse` allows changes to the response data to be made before
// it is passed to then/catch
transformResponse : PropTypes . arrayOf ( PropTypes . func ) ,

// `validateStatus` defines whether to resolve or reject the promise for a given
// HTTP response status code. If `validateStatus` returns `true` (or is set to `null`
// or `undefined`), the promise will be resolved; otherwise, the promise will be
// rejected.
// default: function (status) { return status >= 200 && status < 300; }
validateStatus : PropTypes . func ,

// `maxRedirects` defines the maximum number of redirects to follow in node.js.
// If set to 0, no redirects will be followed.
// default: 5
maxRedirects : PropTypes . number ,

// `timeout` specifies the number of milliseconds before the request times out.
// If the request takes longer than `timeout`, the request will be aborted.
timeout : PropTypes . number ,

// `auth` indicates that HTTP Basic auth should be used, and supplies credentials.
// This will set an `Authorization` header, overwriting any existing
// `Authorization` custom headers you have set using `headers`.
// { username: 'janedoe', password: 's00pers3cret' }
auth : PropTypes . shape ( {
    username : PropTypes . string ,
    password : PropTypes . string
} ) ,

// `responseType` indicates the type of data that the server will respond with
// options are 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'
// default: json
responseType : PropTypes . oneOf ( [ 'arraybuffer' , 'blob' , 'document' , 'json' , 'text' , 'stream' ] ) ,

// `xsrfCookieName` is the name of the cookie to use as a value for xsrf token
// default: 'XSRF-TOKEN'
xsrfCookieName : PropTypes . string ,

// `xsrfHeaderName` is the name of the http header that carries the xsrf token value
// default: 'X-XSRF-TOKEN'
xsrfHeaderName : PropTypes . string ,


// callback fired just before the request is fired
onStart : PropTypes . func ,

// callback fired after the response 
// comes back with status 2XX
onSuccess : PropTypes . func ,

// callback fired after the response 
// comes back with status other 2XX
onFailure : PropTypes . func ,

// callback fired when 
// something else goes wrong
onError : PropTypes . func ,

// defer signals the Request component to not fire the 
// request as soon as ready instead construct the request and 
// wait for the manual trigger
// useful for cases when either the data is incomplete 
// or we want to wait for a CTA 
defer : PropTypes . bool ,

// request can be tagged for enabling nested scenarios
// we might want to render a component based on 
// request sent way above the hierarchy of the component
// super grand parent component :P
tag : PropTypes . string