I want to display an image represented by the link https://www.authenticatorApi.com/pair.aspx?AppName=MyApp&AppInfo=John&SecretCode=12345678BXYT with CachedNetworkImage but get this Failed to decode image error.
However clicking the link directly will show you the qrcode image.
Please what can I do?
-
1This link is not an image, it's an html with an image inside, so use webview or flutter_html to display it in a container.Chance– Chance2022-09-25 02:18:33 +00:00Commented Sep 25, 2022 at 2:18
-
make this an answer so i can accept ituser18039014– user180390142022-10-10 16:32:33 +00:00Commented Oct 10, 2022 at 16:32
-
Answer entered.Chance– Chance2022-10-10 18:57:57 +00:00Commented Oct 10, 2022 at 18:57
Add a comment
|
2 Answers
That's not an image link, use an image that end with image extension like .png or .jpeg or .jpg or any other image format
some link like this
https://www.w3schools.com/html/pic_trulli.jpg
Comments
This link is not an image, it's an html with an image inside, so use webview or flutter_html to display it in a container.
class WebViewExample extends StatefulWidget {
const WebViewExample({Key? key}) : super(key: key);
@override
State<WebViewExample> createState() => WebViewExampleState();
}
class WebViewExampleState extends State<WebViewExample> {
@override
void initState() {
super.initState();
// Enable virtual display.
if (Platform.isAndroid) WebView.platform = AndroidWebView();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title:const Text('WebView'),),
body: const WebView(
initialUrl:
'https://www.authenticatorapi.com/pair.aspx?AppName=MyApp&AppInfo=John&SecretCode=12345678BXYT',
),
);
}
}
import 'package:flutter_html/flutter_html.dart';
class FlutterHtmlExample extends StatefulWidget {
const FlutterHtmlExample({Key? key}) : super(key: key);
@override
State<FlutterHtmlExample> createState() => FlutterHtmlExampleState();
}
class FlutterHtmlExampleState extends State<FlutterHtmlExample> {
@override
void initState() {
super.initState();
}
final htmlData = r'''<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<iframe src="https://www.authenticatorApi.com/pair.aspx?AppName=MyApp&AppInfo=John&SecretCode=12345678BXYT" title="W3Schools Free Online Web Tutorials"></iframe>
</body>
</html>''';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title:const Text('WebView'),),
body: SingleChildScrollView(
child: Html(
data: htmlData,
),
)
);
}
}
