반응형
플러터 웹 응용 프로그램을 위한 웹 보기
나는 처음 설레고 설레임을 통해 웹 애플리케이션을 만들기 시작한다. 나는 인터넷 페이지를 열기 위해 웹 뷰가 필요하다. webView는 iOS와 안드로이드에서 작동하지만 웹 애플리케이션은 지원하지 않습니다.
import 'dart:io';
import 'package:jsonmapper/articlemap.dart';
import 'package:main.dart';
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:webview_flutter/webview_flutter.dart';
class ArticlePage extends StatefulWidget {
final String title;
final String nid;
ArticlePage(this.title, this.nid, {Key key}) : super(key: key);
@override
_ArticlePageState createState() => _ArticlePageState();
}
class _ArticlePageState extends State<ArticlePage> {
ArticleMap _articleMap;
bool _firstnavigate = true;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
widget.title,
style: styles.textStyle(color: Colors.white),
overflow: TextOverflow.ellipsis,
),
),
body: Platform.isAndroid || Platform.isIOS
? WebView(
initialUrl: url,
javascriptMode: JavascriptMode.unrestricted,
navigationDelegate: (NavigationRequest request) {
if (_firstnavigate) {
_firstnavigate = false;
return NavigationDecision.navigate;
} else {
launch(request.url);
return NavigationDecision.prevent;
}
},
)
: launchURL(url),
);
}
launchURL(String url) async {
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
}
}
웹 애플리케이션에서 URL을 점심으로 먹을 때 이 오류가 발생합니다.
Expected a value of type 'widget?', but got one of type '_Future<dynamic>'
이 문제에 대한 아이디어나 더 나은 해결책이 있나요?!
2023년 해답
패키지는 버전 6.0.0에서 웹에 대한 지원을 추가했습니다! 공식 릴리스 정보는 에서 확인할 수 있습니다.
새 문서에는 다음이 포함됩니다. 다음은 요약입니다:
1. flot_inapp 웹뷰 종속성 추가
flutter_inappwebview: ^6.0.0-beta.22
2. 스크립트 추가
<head>
<!-- ... -->
<script type="application/javascript" src="/assets/packages/flutter_inappwebview/assets/web/web_support.js" defer></script>
<!-- ... -->
</head>
3. InApp WebView 위젯 사용
Scaffold(
body: SafeArea(
child: InAppWebView(
initialUrlRequest: URLRequest(url:WebUri('https://flutter.dev/')),
)
)
);
WebView 및 Flutter 웹에서 수행할 수 있는 작업에는 몇 가지 제한이 있지만 단순히 콘텐츠를 표시하는 경우에는 이 제한이 적용됩니다.
숙박업소에 a를 배달해야 하지만 다른 유형()을 반환합니다. 예를 들어, 사용자가 버튼을 클릭하여 URL을 실행하도록 하면 오류를 제거할 수 있습니다:
Platform.isAndroid || Platform.isIOS
? WebView(
initialUrl: url,
javascriptMode: JavascriptMode.unrestricted,
navigationDelegate: (NavigationRequest request) {
if (_firstnavigate) {
_firstnavigate = false;
return NavigationDecision.navigate;
} else {
launch(request.url);
return NavigationDecision.prevent;
}
},
) : ElevatedButton(
onPressed: () => launchURL(url),
child: Text('Go to Website'),
)
반응형
'개발하자' 카테고리의 다른 글
| 플러터 프로젝트의 기본 스왓치 오류 (1) | 2023.02.16 |
|---|---|
| Flurter : 다크 모드에서 텍스트 색상 변경 쿠퍼티노 날짜 선택기 (0) | 2023.02.15 |
| Flowter 웹 보기가 Flowter 웹에 대해 작동하지 않음 (0) | 2023.02.14 |
| Go는 파이썬과 유사한 "if x in" 구조를 가지고 있나요? (0) | 2023.02.13 |
| FastAPI에서 오리진 URL을 얻는 방법은? (0) | 2023.02.13 |