Skip to content

Load HTML from assets or local files #27086

Closed
flutter/plugins
#4593
@durduman

Description

@durduman

I am loading a local HTML file into a Widget using flutter_webview package in the following way:

                        FutureBuilder<String>(
                            future: LocalLoader().loadLocal(),
                            builder: (context, snapshot) {
                              if (snapshot.hasData) {
//                                return Text("${snapshot.data}");
                                return WebView(
                                  initialUrl: new Uri.dataFromString(snapshot.data, mimeType: 'text/html').toString(),
                                  javascriptMode: JavascriptMode.unrestricted,
                                );

                              } else if (snapshot.hasError) {
                                return Text("${snapshot.error}");
                              }
                              return CircularProgressIndicator();
                            }
                        )

It loads the HTML just fine but if the tags point to other resources (such as an external CSS file or other local images), they will not be displayed in the webview.

These assets (CSS and the images files) are added to the project at the location specified path from the HTML ( relative local path ) and also the pubspec.


For example one of the HTML files contains this element:
<link rel=stylesheet href=styles/main.css>

When the HTML file loads in the webview, the CSS will not reflect in the style for that page.
If I manually add the CSS to the HTML (using <style> element to define it) it will work just fine.

Any suggestion on how I can make these HTMLS load their local resources? (even it it means changing the package or the way it was implemented)

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3Issues that are less important to the Flutter projectc: new featureNothing broken; request for a new capabilitycustomer: crowdAffects or could affect many people, though not necessarily a specific customer.p: webviewThe WebView pluginpackageflutter/packages repository. See also p: labels.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions