Skip to content

Commit c7e2507

Browse files
committed
It was moved to nativescript-core folder
1 parent 7c39be2 commit c7e2507

File tree

1 file changed

+180
-0
lines changed

1 file changed

+180
-0
lines changed

Diff for: nativescript-core/http.md

+180
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,180 @@
1+
---
2+
title: Http
3+
---
4+
5+
## Http
6+
7+
The import for the Http module.
8+
9+
```typescript
10+
import { Http } from '@nativescript/core'
11+
```
12+
13+
### getString
14+
15+
The `getString` method allows us to make a request and get the response body as a string value.
16+
17+
```typescript
18+
import { Http } from '@nativescript/core'
19+
20+
Http.getString('https://httpbin.org/get').then(
21+
(result: string) => {
22+
viewModel.set('getStringResult', r)
23+
},
24+
e => {}
25+
)
26+
```
27+
28+
### getJSON
29+
30+
The `getJSON` method gives us a simple way to get the response body as a JSON object.
31+
32+
```typescript
33+
import { Http } from '@nativescript/core'
34+
35+
Http.getJSON('https://httpbin.org/get').then(
36+
(result: any) => {
37+
console.log(result)
38+
},
39+
e => {}
40+
)
41+
```
42+
43+
### getFile
44+
45+
The `getFile` method allows us to download a file.
46+
47+
```typescript
48+
import { Http } from '@nativescript/core'
49+
50+
Http.getFile('https://d1lfyz5kwt8vu9.cloudfront.net/nativescript-logo-2021.png').then(
51+
resultFile => {
52+
// The returned result will be File object
53+
},
54+
e => {}
55+
)
56+
```
57+
58+
::: warning Note
59+
By default the file will be saved in Documents folder.
60+
:::
61+
62+
In the `getFile` method we could also specify the path, where the file to be saved. This scenario is demonstrated in the example below, where the image file will be kept in the current application folder.
63+
64+
```typescript
65+
import { File, Http, knownFolders, path } from '@nativescript/core'
66+
67+
const filePath: string = path.join(knownFolders.currentApp().path, 'test.png')
68+
69+
Http.getFile(
70+
'https://httpbin.org/image/png?testQuery=query&anotherParam=param',
71+
filePath
72+
).then(
73+
(resultFile: File) => {
74+
// The returned result will be File object
75+
},
76+
e => {}
77+
)
78+
```
79+
80+
### getImage
81+
82+
The `getImage` method allows us to get an image from a specific URL. The returned object will be ImageSource and it could be used for direct displaying the source into Image view in your UI.
83+
84+
```typescript
85+
import { Http, ImageSource } from '@nativescript/core'
86+
87+
Http.getImage('https://httpbin.org/image/jpeg').then(
88+
(r: ImageSource) => {
89+
// getImage method returns ImageSource object
90+
},
91+
e => {}
92+
)
93+
```
94+
95+
### request
96+
97+
This example `request` method demonstrates how we can access the response headers, content, and statusCode.
98+
99+
```typescript
100+
import { Http, HttpResponse } from '@nativescript/core'
101+
102+
Http.request({
103+
url: 'https://httpbin.org/get',
104+
method: 'GET'
105+
}).then(
106+
(response: HttpResponse) => {
107+
// Argument (response) is HttpResponse
108+
console.log(`Response Status Code: ${response.statusCode}`)
109+
console.log(`Response Headers: ${response.statusCode}`)
110+
console.log(`Response Content: ${response.content}`)
111+
},
112+
e => {}
113+
)
114+
```
115+
116+
This example demonstrates, how to get the request-response content and how to represent the received data as a `String` value or `JSON` object. We could also use `toImage` method when we download an image.
117+
118+
```typescript
119+
import { Http, HttpResponse } from '@nativescript/core'
120+
121+
Http.request({
122+
url: 'https://httpbin.org/get',
123+
method: 'GET'
124+
}).then(
125+
(response: HttpResponse) => {
126+
// Content property of the response is HttpContent
127+
const content = response.content
128+
129+
// The toString method allows you to get the response body as string.
130+
const str = content.toString()
131+
132+
// The toJSON method allows you to parse the received content to JSON object
133+
// var obj = content.toJSON();
134+
135+
// The toImage method allows you to get the response body as ImageSource.
136+
// var img = response.content.toImage();
137+
},
138+
e => {}
139+
)
140+
```
141+
142+
#### Post
143+
144+
The example demonstrates, how to make Http POST request and how to get request response.
145+
146+
```typescript
147+
import { Http, HttpResponse } from "@nativescript/core";
148+
149+
Http.request({
150+
url: "https://httpbin.org/post",
151+
method: "POST",
152+
headers: { "Content-Type": "application/json" },
153+
content: JSON.stringify({
154+
username: "[email protected],
155+
password: "someEncryptedPasswordValue",
156+
}),
157+
}).then(
158+
(response: HttpResponse) => {
159+
const result = response.content.toJSON();
160+
console.log(`Http POST Result: ${result}`)
161+
},
162+
(e) => {}
163+
);
164+
```
165+
166+
#### Methods
167+
168+
| Name | Type | Description |
169+
| ------------------------------------------------------------------- | ----------------------- | --------------------------------------------------------------------------------------------------- |
170+
| `getFile(url: string, destinationFilePath?: string): Promise<File>` | `Promise<File>` | Downloads the content from the specified URL and attempts to save it as file. |
171+
| `getImage(url: string): Promise<ImageSource>` | `Promise<ImageSource>` | Downloads the content from the specified URL and attempts to decode it as an image. |
172+
| `getJSON<T>(url: string): Promise<T>` | `Promise<T>` | Downloads the content from the specified URL as a string and returns its JSON.parse representation. |
173+
| `getString(url: string): Promise<string>` | `Promise<string>` | Downloads the content from the specified URL as a string. |
174+
| `request(options: HttpRequestOptions): Promise<HttpResponse>` | `Promise<HttpResponse>` | Makes a generic http request using the provided options and returns a HttpResponse Object. |
175+
176+
#### API References
177+
178+
| Name | Type |
179+
| ---------------------------------------------------------------------------------------- | -------- |
180+
| [@nativescript/core/http](https://docs.nativescript.org/api-reference/modules.html#http) | `Module` |

0 commit comments

Comments
 (0)