Skip to content

Commit e0e4702

Browse files
authored
Update README.md
1 parent 1359ecb commit e0e4702

File tree

1 file changed

+36
-284
lines changed

1 file changed

+36
-284
lines changed

README.md

Lines changed: 36 additions & 284 deletions
Original file line numberDiff line numberDiff line change
@@ -1,299 +1,51 @@
1-
[![Flutter Community: flutter_webview_plugin](https://fluttercommunity.dev/_github/header/flutter_webview_plugin)](https://github.com/fluttercommunity/community)
1+
|0. flutter_webview_plugin [🔻]()|
2+
|---|
23

3-
# NOTICE
4-
> We are working closely with the Flutter Team to integrate all the Community Plugin features in the [Official WebView Plugin](https://pub.dev/packages/webview_flutter). We will try our best to resolve PRs and Bugfixes, but our priority right now is to merge our two code-bases. Once the merge is complete we will deprecate the Community Plugin in favor of the Official one.
5-
>
6-
> Thank you for all your support, hopefully you'll also show it for Official Plugin too.
7-
>
8-
> Keep Fluttering!
4+
|1. Android V1 embedding에서 V2로 마이그레이션을 진행한 계기와 과정 [🔻]()|
5+
|---|
96

10-
# Flutter WebView Plugin
7+
|2. 실제로 마이그레이션한 플러그인을 사용한 웹뷰 에시 [🔻]()|
8+
|---|
119

12-
[![pub package](https://img.shields.io/pub/v/flutter_webview_plugin.svg)](https://pub.dartlang.org/packages/flutter_webview_plugin)
10+
|3. 오픈 소스에 기여 [🔻]()|
11+
|---|
1312

14-
Plugin that allows Flutter to communicate with a native WebView.
13+
<br></br>
1514

16-
**_Warning:_**
17-
The webview is not integrated in the widget tree, it is a native view on top of the flutter view.
18-
You won't be able see snackbars, dialogs, or other flutter widgets that would overlap with the region of the screen taken up by the webview.
15+
## 📍 flutter_webview_plugin
16+
[👉🏻 flutter_webview_plugin README.md 보러가기 👈🏻](https://github.com/fluttercommunity/flutter_webview_plugin#readme)
1917

20-
The getSafeAcceptedType() function is available only for minimum SDK of 21.
21-
eval() function only supports SDK of 19 or greater for evaluating Javascript.
18+
![68747470733a2f2f666c7574746572636f6d6d756e6974792e6465762f5f6769746875622f6865616465722f666c75747465725f776562766965775f706c7567696e](https://github.com/hardy716/flutter_webview_plugin/assets/101140679/2aadbd48-f378-4341-bbdf-8cbf056953e7)
2219

23-
## Getting Started
2420

25-
For help getting started with Flutter, view our online [documentation](http://flutter.io/).
21+
## 🧑🏻‍💻 Android V1 embedding에서 V2로 마이그레이션을 진행한 계기와 과정
22+
[👉🏻 블로그 보러가기 👈🏻](https://hardy716.github.io/blog/trouble-shooting/2023-04-19-troubleshooting-3/)
2623

27-
#### iOS
24+
<br></br>
2825

29-
In order for plugin to work correctly, you need to add new key to `ios/Runner/Info.plist`
26+
## 📱 실제로 마이그레이션한 플러그인을 사용한 웹뷰 에시
27+
<p align="start">
28+
<img src="https://github.com/hardy716/flutter_webview_plugin/assets/101140679/5c6efa10-fef7-40fb-b631-a0caf90ea43e" width="200" height="400" hspace="30">
29+
<img src="https://github.com/hardy716/flutter_webview_plugin/assets/101140679/0f257245-3425-4ae6-944f-c0501cec1fc9" width="200" height="400" hspace="30">
30+
</p>
3031

31-
```xml
32-
<key>NSAppTransportSecurity</key>
33-
<dict>
34-
<key>NSAllowsArbitraryLoads</key>
35-
<true/>
36-
<key>NSAllowsArbitraryLoadsInWebContent</key>
37-
<true/>
38-
</dict>
39-
```
32+
<br></br>
4033

41-
`NSAllowsArbitraryLoadsInWebContent` is for iOS 10+ and `NSAllowsArbitraryLoads` for iOS 9.
4234

35+
## 🌟 오픈 소스에 기여
4336

44-
### How it works
37+
1. 코드 기여 및 이슈 응답
38+
39+
해당 플러그인을 안드로이드 v1 임베딩에서 v2로 마이그레이션한 버전을 오픈소스에 공유했습니다.
40+
41+
또한, 커뮤니티 멤버들의 이슈에 답변을 제공하며 후속 발견된 에러도 수정하였습니다.
42+
43+
![스크린샷 2023-09-13 오후 4 19 46](https://github.com/hardy716/flutter_webview_plugin/assets/101140679/cb55bbf9-136d-43f1-b05c-087f9a2496b3)
4544

46-
#### Launch WebView Fullscreen with Flutter navigation
47-
48-
```dart
49-
new MaterialApp(
50-
routes: {
51-
"/": (_) => new WebviewScaffold(
52-
url: "https://www.google.com",
53-
appBar: new AppBar(
54-
title: new Text("Widget webview"),
55-
),
56-
),
57-
},
58-
);
59-
```
60-
61-
Optional parameters `hidden` and `initialChild` are available so that you can show something else while waiting for the page to load.
62-
If you set `hidden` to true it will show a default CircularProgressIndicator. If you additionally specify a Widget for initialChild
63-
you can have it display whatever you like till page-load.
64-
65-
e.g. The following will show a read screen with the text 'waiting.....'.
66-
```dart
67-
return new MaterialApp(
68-
title: 'Flutter WebView Demo',
69-
theme: new ThemeData(
70-
primarySwatch: Colors.blue,
71-
),
72-
routes: {
73-
'/': (_) => const MyHomePage(title: 'Flutter WebView Demo'),
74-
'/widget': (_) => new WebviewScaffold(
75-
url: selectedUrl,
76-
appBar: new AppBar(
77-
title: const Text('Widget webview'),
78-
),
79-
withZoom: true,
80-
withLocalStorage: true,
81-
hidden: true,
82-
initialChild: Container(
83-
color: Colors.redAccent,
84-
child: const Center(
85-
child: Text('Waiting.....'),
86-
),
87-
),
88-
),
89-
},
90-
);
91-
```
92-
93-
`FlutterWebviewPlugin` provide a singleton instance linked to one unique webview,
94-
so you can take control of the webview from anywhere in the app
95-
96-
listen for events
97-
98-
```dart
99-
final flutterWebviewPlugin = new FlutterWebviewPlugin();
100-
101-
flutterWebviewPlugin.onUrlChanged.listen((String url) {
102-
103-
});
104-
```
105-
106-
#### Listen for scroll event in webview
107-
108-
```dart
109-
final flutterWebviewPlugin = new FlutterWebviewPlugin();
110-
flutterWebviewPlugin.onScrollYChanged.listen((double offsetY) { // latest offset value in vertical scroll
111-
// compare vertical scroll changes here with old value
112-
});
113-
114-
flutterWebviewPlugin.onScrollXChanged.listen((double offsetX) { // latest offset value in horizontal scroll
115-
// compare horizontal scroll changes here with old value
116-
});
117-
118-
````
119-
120-
Note: Do note there is a slight difference is scroll distance between ios and android. Android scroll value difference tends to be larger than ios devices.
121-
122-
123-
#### Hidden WebView
124-
125-
```dart
126-
final flutterWebviewPlugin = new FlutterWebviewPlugin();
127-
128-
flutterWebviewPlugin.launch(url, hidden: true);
129-
```
130-
131-
#### Close launched WebView
132-
133-
```dart
134-
flutterWebviewPlugin.close();
135-
```
136-
137-
#### Webview inside custom Rectangle
138-
139-
```dart
140-
final flutterWebviewPlugin = new FlutterWebviewPlugin();
141-
142-
flutterWebviewPlugin.launch(url,
143-
fullScreen: false,
144-
rect: new Rect.fromLTWH(
145-
0.0,
146-
0.0,
147-
MediaQuery.of(context).size.width,
148-
300.0,
149-
),
150-
);
151-
```
152-
153-
#### Injecting custom code into the webview
154-
Use `flutterWebviewPlugin.evalJavaScript(String code)`. This function must be run after the page has finished loading (i.e. listen to `onStateChanged` for events where state is `finishLoad`).
155-
156-
If you have a large amount of JavaScript to embed, use an asset file. Add the asset file to `pubspec.yaml`, then call the function like:
157-
158-
```dart
159-
Future<String> loadJS(String name) async {
160-
var givenJS = rootBundle.loadString('assets/$name.js');
161-
return givenJS.then((String js) {
162-
flutterWebViewPlugin.onStateChanged.listen((viewState) async {
163-
if (viewState.type == WebViewState.finishLoad) {
164-
flutterWebViewPlugin.evalJavascript(js);
165-
}
166-
});
167-
});
168-
}
169-
```
170-
171-
### Accessing local files in the file system
172-
Set the `withLocalUrl` option to true in the launch function or in the Webview scaffold to enable support for local URLs.
173-
174-
Note that, on iOS, the `localUrlScope` option also needs to be set to a path to a directory. All files inside this folder (or subfolder) will be allowed access. If ommited, only the local file being opened will have access allowed, resulting in no subresources being loaded. This option is ignored on Android.
175-
176-
### Ignoring SSL Errors
177-
178-
Set the `ignoreSSLErrors` option to true to display content from servers with certificates usually not trusted by the Webview like self-signed certificates.
179-
180-
**_Warning:_** Don't use this in production.
181-
182-
Note that on iOS, you need to add new key to `ios/Runner/Info.plist`
183-
184-
```xml
185-
<key>NSAppTransportSecurity</key>
186-
<dict>
187-
<key>NSAllowsArbitraryLoads</key>
188-
<true/>
189-
<key>NSAllowsArbitraryLoadsInWebContent</key>
190-
<true/>
191-
</dict>
192-
```
193-
194-
`NSAllowsArbitraryLoadsInWebContent` is for iOS 10+ and `NSAllowsArbitraryLoads` for iOS 9.
195-
Otherwise you'll still not be able to display content from pages with untrusted certificates.
196-
197-
You can test your ignorance if ssl certificates is working e.g. through https://self-signed.badssl.com/
198-
199-
200-
201-
202-
### Webview Events
203-
204-
- `Stream<Null>` onDestroy
205-
- `Stream<String>` onUrlChanged
206-
- `Stream<WebViewStateChanged>` onStateChanged
207-
- `Stream<double>` onScrollXChanged
208-
- `Stream<double>` onScrollYChanged
209-
- `Stream<String>` onError
210-
211-
**_Don't forget to dispose webview_**
212-
`flutterWebviewPlugin.dispose()`
213-
214-
### Webview Functions
215-
216-
```dart
217-
Future<Null> launch(String url, {
218-
Map<String, String> headers: null,
219-
Set<JavascriptChannel> javascriptChannels: null,
220-
bool withJavascript: true,
221-
bool clearCache: false,
222-
bool clearCookies: false,
223-
bool hidden: false,
224-
bool enableAppScheme: true,
225-
Rect rect: null,
226-
String userAgent: null,
227-
bool withZoom: false,
228-
bool displayZoomControls: false,
229-
bool withLocalStorage: true,
230-
bool withLocalUrl: true,
231-
String localUrlScope: null,
232-
bool withOverviewMode: false,
233-
bool scrollBar: true,
234-
bool supportMultipleWindows: false,
235-
bool appCacheEnabled: false,
236-
bool allowFileURLs: false,
237-
bool useWideViewPort: false,
238-
String invalidUrlRegex: null,
239-
bool geolocationEnabled: false,
240-
bool debuggingEnabled: false,
241-
bool ignoreSSLErrors: false,
242-
});
243-
```
244-
245-
```dart
246-
Future<String> evalJavascript(String code);
247-
```
248-
249-
```dart
250-
Future<Map<String, dynamic>> getCookies();
251-
```
252-
253-
```dart
254-
Future<Null> cleanCookies();
255-
```
256-
257-
```dart
258-
Future<Null> resize(Rect rect);
259-
```
260-
261-
```dart
262-
Future<Null> show();
263-
```
264-
265-
```dart
266-
Future<Null> hide();
267-
```
268-
269-
```dart
270-
Future<Null> reloadUrl(String url);
271-
```
272-
273-
```dart
274-
Future<Null> close();
275-
```
276-
277-
```dart
278-
Future<Null> reload();
279-
```
280-
281-
```dart
282-
Future<Null> goBack();
283-
```
284-
285-
```dart
286-
Future<Null> goForward();
287-
```
288-
289-
```dart
290-
Future<Null> stopLoading();
291-
```
292-
293-
```dart
294-
Future<bool> canGoBack();
295-
```
296-
297-
```dart
298-
Future<bool> canGoForward();
299-
```
45+
2. 풀 리퀘스트
46+
47+
해당 플러그인의 안드로이드 v1 임베딩에서 v2로의 마이그레이션 버전을 개발하여 풀 리퀘스트를 제출하였습니다.
48+
49+
(현재 공식 반영은 이루어지지 않은 상태입니다)
50+
51+
![스크린샷 2023-09-13 오후 5 05 23](https://github.com/hardy716/flutter_webview_plugin/assets/101140679/76b6976a-85d3-47ad-ae01-62bd63c13bb0)

0 commit comments

Comments
 (0)