asjqkkkk / markdown_widget

📖Rendering markdown by flutter!Welcome for pr and issue.
MIT License
312 stars 90 forks source link

desktop view can't render markdown image from link. But mobile view support. #146

Closed IsmailHosenIsmailJames closed 8 months ago

IsmailHosenIsmailJames commented 8 months ago

I have tried your package. I got a bug when I paste a simple markdown image with a https link. Desktop view was not able to render the image. The markdwon text was this :

![Google Logo](https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png)

I also tried same thing in you demo page. Same things happen.

these image from your demo page

Screenshot from 2023-12-22 21-04-57

Screenshot from 2023-12-22 21-05-49 Screenshot from 2023-12-22 21-04-57

this is my code

Row(
        children: [
          Expanded(
            child: TocWidget(controller: tocController),
          ),
          Expanded(
            child: MarkdownWidget(
              data: widget.markdown,
              tocController: tocController,
            ),
          ),
        ],
      ),

here is the image

Screenshot from 2023-12-22 21-05-45

asjqkkkk commented 8 months ago

Hi @IsmailHosenIsmailJames , this is a CORS issue on web

image
IsmailHosenIsmailJames commented 8 months ago

But I have got a solution. The solution is to compile with html for web render. This is the command for compiled with html render:

flutter build web --web-renderer html
IsmailHosenIsmailJames commented 8 months ago

i run this command for run your project with html renderer

ismail@ismail:~/markdown_widget/example$ flutter run -d chrome --web-renderer html

then it works perfectly.

here is the image

Screenshot from 2023-12-22 22-09-54

will I close this issue ?

asjqkkkk commented 8 months ago

But I have got a solution. The solution is to compile with html for web render. This is the command for compiled with html render:

flutter build web --web-renderer html

yes, but this solution will cause many other abnormal behaviors if you want to show the network images on web, you need change the settings of image server to support CORS such as this picture: ![](https://img2.baidu.com/it/u=2546290954,811864095&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=281)

image
IsmailHosenIsmailJames commented 8 months ago

I actually building a social paltfrom where my students and my classmates will learn programming and will post here to share with others the learning resources. For this I am using Firebase as backend. User will upload their images and videos here. So I have no option to change my server settings to support this kind of images on my website. No problem I will compile it with HTML Render. because I previously using this for my website. Because Html render is light weight for my website.

IsmailHosenIsmailJames commented 8 months ago

I want to work with you on open source projects. For that I need to understand your code. Do you consider me?

asjqkkkk commented 8 months ago

Hi @IsmailHosenIsmailJames , using HTML as a rendering option may be lighter, but since it's just a fallback option for Flutter web, I may not have the time or ability to address the issues it may cause. If you encounter any issues with this open-source library, feel free to raise an issue anytime. I will review them when I have time and provide answers within my capabilities.