[SOLVED] Accessing URL Image CORS policy

Accessing URL Image CORS policy

In my flutter web when I'm trying to show network image, I'm getting an error of CORS. Access to XMLHttpRequest at 'https://my-network-image-url.jpg' from origin 'http://localhost:63785' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Its working properly in my Android/iOS Mobile Apps.

I already fetch same issue in my back-end PHP API. At that time adding headers in PHP file solve the issue.

header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Headers: X-Requested-With,content-type");

I'm confused how to add header in image get request.

Solution

You can mock the calls from any other endpoint which allows all cross origins like I have used the following,

String allowCORSEndPoint = "https://api.allorigins.win/raw?url=";

And while making a call you can use a a variable like this,

import 'dart:html' as html;

http.Response response = await http.get(
  Uri.parse(allowCORSEndPoint + url),
);