1# Using Incognito Mode
2
3
4When creating a **\<Web>** component, you can enable incognito mode for it by setting the optional parameter [incognitoMode](../reference/apis-arkweb/ts-basic-components-web.md#incognitomode) to **true**. When incognito mode, data such as cookies and cache data during web page browsing is not stored in local persistent files. This means that such data is lost when the **\<Web>** component is destroyed.
5
6- Create a [\<Web>](../reference/apis-arkweb/ts-basic-components-web.md#web) component in incognito mode.
7 
8   ```ts
9  // xxx.ets
10  import { webview } from '@kit.ArkWeb';
11
12  @Entry
13  @Component
14  struct WebComponent {
15    controller: webview.WebviewController = new webview.WebviewController();
16
17    build() {
18      Column() {
19        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
20      }
21    }
22  }
23  ```
24
25- Use [isIncogntoMode](../reference/apis-arkweb/js-apis-webview.md#isincognitomode11) to check whether the current **\<Web>** component is in incognito mode.
26
27  ```ts
28  // xxx.ets
29  import { webview } from '@kit.ArkWeb';
30  import { BusinessError } from '@kit.BasicServicesKit';
31
32  @Entry
33  @Component
34  struct WebComponent {
35    controller: webview.WebviewController = new webview.WebviewController();
36
37    build() {
38      Column() {
39        Button('isIncognitoMode')
40          .onClick(() => {
41            try {
42              let result = this.controller.isIncognitoMode();
43              console.log('isIncognitoMode' + result);
44            } catch (error) {
45              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
46            }
47          })
48        Web({ src: 'www.example.com', controller: this.controller })
49      }
50    }
51  }
52  ```
53
54In incognito mode, you can use the following APIs for geolocation information, cookies, and cache data:
55
56- Use [allowGeolocation](../reference/apis-arkweb/js-apis-webview.md#allowgeolocation) to allow the specified origin to use the geolocation information.
57
58  ```ts
59  // xxx.ets
60  import { webview } from '@kit.ArkWeb';
61  import { BusinessError } from '@kit.BasicServicesKit';
62
63  @Entry
64  @Component
65  struct WebComponent {
66    controller: webview.WebviewController = new webview.WebviewController();
67    origin: string = "file:///";
68
69    build() {
70      Column() {
71        Button('allowGeolocation')
72          .onClick(() => {
73            try {
74              // The second parameter of allowGeolocation specifies whether to allow the specified origin to use the geolocation information in incognito mode (true) or in non-incognito mode (false).
75              webview.GeolocationPermissions.allowGeolocation(this.origin, true);
76            } catch (error) {
77              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
78            }
79          })
80        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
81      }
82    }
83  }
84  ```
85
86- Use [deleteGeolocation](../reference/apis-arkweb/js-apis-webview.md#deletegeolocation) to clear the geolocation permission status of a specified origin.
87
88  ```ts
89  // xxx.ets
90  import { webview } from '@kit.ArkWeb';
91  import { BusinessError } from '@kit.BasicServicesKit';
92
93  @Entry
94  @Component
95  struct WebComponent {
96    controller: webview.WebviewController = new webview.WebviewController();
97    origin: string = "file:///";
98
99    build() {
100      Column() {
101        Button('deleteGeolocation')
102          .onClick(() => {
103            try {
104              // The second parameter of deleteGeolocation specifies whether to clear the geolocation permission status of a specified origin in incognito mode (true) or in non-incognito mode (false).
105              webview.GeolocationPermissions.deleteGeolocation(this.origin, true);
106            } catch (error) {
107              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
108            }
109          })
110        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
111      }
112    }
113  }
114  ```
115
116- Use [getAccessibleGeolocation](../reference/apis-arkweb/js-apis-webview.md#getaccessiblegeolocation) to asynchronously obtain the geolocation permission status of the specified origin.
117
118  ```ts
119  // xxx.ets
120  import { webview } from '@kit.ArkWeb';
121  import { BusinessError } from '@kit.BasicServicesKit';
122
123  @Entry
124  @Component
125  struct WebComponent {
126    controller: webview.WebviewController = new webview.WebviewController();
127    origin: string = "file:///";
128
129    build() {
130      Column() {
131        Button('getAccessibleGeolocation')
132          .onClick(() => {
133            try {
134              // The third parameter of getAccessibleGeolocation specifies whether to obtain the geolocation permission status of the specified origin in incognito mode (true) or in non-incognito mode (false). This API uses an asynchronous callback to return the result.
135              webview.GeolocationPermissions.getAccessibleGeolocation(this.origin, (error, result) => {
136                if (error) {
137                  console.log('getAccessibleGeolocationAsync error: ' + JSON.stringify(error));
138                  return;
139                }
140                console.log('getAccessibleGeolocationAsync result: ' + result);
141              }, true);
142            } catch (error) {
143              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
144            }
145          })
146        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
147      }
148    }
149  }
150  ```
151
152- Use [deleteAllData](../reference/apis-arkweb/js-apis-webview.md#deletealldata) to delete all data in the Web SQL Database.
153
154  ```ts
155  // xxx.ets
156  import { webview } from '@kit.ArkWeb';
157  import { BusinessError } from '@kit.BasicServicesKit';
158
159  @Entry
160  @Component
161  struct WebComponent {
162    controller: webview.WebviewController = new webview.WebviewController();
163
164    build() {
165      Column() {
166        Button('deleteAllData')
167          .onClick(() => {
168            try {
169              // The parameter of deleteAllData specifies whether to delete all data in the Web SQL Database in incognito mode (true) or in non-incognito mode (false).
170              webview.WebStorage.deleteAllData(true);
171            } catch (error) {
172              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
173            }
174          })
175        Web({ src: $rawfile('index.html'), controller: this.controller, incognitoMode: true })
176          .databaseAccess(true)
177      }
178    }
179  }
180  ```
181
182- Use [fetchCookieSync](../reference/apis-arkweb/js-apis-webview.md#fetchcookiesync11) to obtain the cookie corresponding to the specified URL.
183
184  ```ts
185  // xxx.ets
186  import { webview } from '@kit.ArkWeb';
187  import { BusinessError } from '@kit.BasicServicesKit';
188
189  @Entry
190  @Component
191  struct WebComponent {
192    controller: webview.WebviewController = new webview.WebviewController();
193
194    build() {
195      Column() {
196        Button('fetchCookieSync')
197          .onClick(() => {
198            try {
199              // The second parameter of fetchCookieSync specifies whether to obtain the cookie in incognito mode (true) or in non-incognito mode (false).
200              let value = webview.WebCookieManager.fetchCookieSync('https://www.example.com', true);
201              console.log("fetchCookieSync cookie = " + value);
202            } catch (error) {
203              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
204            }
205          })
206        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
207      }
208    }
209  }
210  ```
211
212- Use [configCookieSync](../reference/apis-arkweb/js-apis-webview.md#configcookiesync11) to set a cookie for the specified URL.
213
214  ```ts
215  // xxx.ets
216  import { webview } from '@kit.ArkWeb';
217  import { BusinessError } from '@kit.BasicServicesKit';
218
219  @Entry
220  @Component
221  struct WebComponent {
222    controller: webview.WebviewController = new webview.WebviewController();
223
224    build() {
225      Column() {
226        Button('configCookieSync')
227          .onClick(() => {
228            try {
229              // The third parameter of configCookieSync specifies whether to obtain the cookie for the specified URL in incognito mode (true) or in non-incognito mode (false).
230              webview.WebCookieManager.configCookieSync('https://www.example.com', 'a=b', true);
231            } catch (error) {
232              console.error(`ErrorCode: ${(error as BusinessError).code},  Message: ${(error as BusinessError).message}`);
233            }
234          })
235        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
236      }
237    }
238  }
239  ```
240
241- Use [existCookie](../reference/apis-arkweb/js-apis-webview.md#existcookie) to check whether cookies exist.
242
243  ```ts
244  // xxx.ets
245  import { webview } from '@kit.ArkWeb';
246
247  @Entry
248  @Component
249  struct WebComponent {
250    controller: webview.WebviewController = new webview.WebviewController();
251
252    build() {
253      Column() {
254        Button('existCookie')
255          .onClick(() => {
256            // The parameter of existCookie specifies whether to check for cookies in incognito mode (true) or in non-incognito mode (false).
257            let result = webview.WebCookieManager.existCookie(true);
258            console.log("result: " + result);
259          })
260        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
261      }
262    }
263  }
264  ```
265
266- Use [clearAllCookiesSync](../reference/apis-arkweb/js-apis-webview.md#clearallcookiessync11) to delete all cookies.
267
268  ```ts
269  // xxx.ets
270  import { webview } from '@kit.ArkWeb';
271
272  @Entry
273  @Component
274  struct WebComponent {
275    controller: webview.WebviewController = new webview.WebviewController();
276
277    build() {
278      Column() {
279        Button('clearAllCookiesSync')
280          .onClick(() => {
281            // The parameter of clearAllCookiesSync specifies whether to delete all cookies in incognito mode (true) or in non-incognito mode (false).
282            webview.WebCookieManager.clearAllCookiesSync(true);
283          })
284        Web({ src: 'www.example.com', controller: this.controller, incognitoMode: true })
285      }
286    }
287  }
288  ```
289