skip to Main Content

The error i got when using Google places api. The package im using is flutter_google_places.
The code works on Android but when i use it on web (Chrome), i got error

Future<Prediction?> searchLocation()async{
    print('print start ');

    try{
      Prediction? p = await PlacesAutocomplete.show(
          onError: (value) {
            print('this is the value of error ${value.errorMessage}');
            Fluttertoast.showToast(msg: '${value.errorMessage}');
          },
          offset: 0,
          radius: 10000,
          types: [],
          strictbounds: false,
          context: context,
          apiKey: kApiKey,
          // httpClient:,
          proxyBaseUrl: kIsWeb?'https://cors-anywhere.herokuapp.com/':null,
          mode: Mode.overlay, // Mode.fullscreen
          language: "en",
          components: [Component(Component.country, "pk")]
      );
        print('print perdiction ${p.toString()}');
        return p;
    }catch(error){
      print('This is the catch error: $error');
      return null;
    }

  }

The error i got on the terminal :

Error: ormatException: SyntaxError: Unexpected token ‘T’, "This API
e"… is not valid JSON
dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart
294:49 throw

dart-sdk/lib/_internal/js_dev_runtime/patch/convert_patch.dart 39:5
_parseJson dart-sdk/lib/convert/json.dart 610:36
convert dart-sdk/lib/convert/json.dart 216:41
decode packages/google_maps_webservice/src/places.dart 531:48
[_decodeAutocompleteResponse] packages/google_maps_webservice/src/places.dart 171:12
autocomplete
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 45:50
<fn> dart-sdk/lib/async/zone.dart 1661:54
runUnary dart-sdk/lib/async/future_impl.dart 156:18
handleValue dart-sdk/lib/async/future_impl.dart 840:44
handleValueCallback dart-sdk/lib/async/future_impl.dart 869:13
_propagateToListeners dart-sdk/lib/async/future_impl.dart 641:5
[_completeWithValue] dart-sdk/lib/async/future_impl.dart 715:7
callback dart-sdk/lib/async/schedule_microtask.dart 40:11
_microtaskLoop dart-sdk/lib/async/schedule_microtask.dart 49:5
_startMicrotaskLoop
dart-sdk/lib/_internal/js_dev_runtime/patch/async_patch.dart 181:15
<fn>

2

Answers


  1. Chosen as BEST ANSWER

    After lot of research and working on it, I finally got the solution. The problem is when i use proxyBaseUrl the respond i got form the api is no in correct forment, Now just comment the proxyBaseUrl:

    // proxyBaseUrl: kIsWeb?'https://cors-anywhere.herokuapp.com/':null,
    

    After this, you got the error on terminal like this:

    Error: XMLHttpRequest

    This error is a Javascript error and it can be inspected from AndroidStudio terminal or from the browser console. If you run into this problem it means that the requests to the API server are failing due to a CORS error.

    Now to solve this error go to flutter directory on you pc:

    In my case : {C:srcflutterbincache}

    Delete this file:

    Now go to this directory {C:srcflutterpackagesflutter_toolslibsrcweb}

    Open this file in any Editor : Open this file in any Editor

    Search and Comment this '--disable-extensions' in chrome.dart file

    and add this '--disable-web-security', just like this:

    Now all the errors are successfully removed :)


    1. The error says you receive invalid JSON
    2. The following piece of code overrides proxy value for web config, that’s is your lead, go check what’s wrong with that URL/server:
    proxyBaseUrl: kIsWeb?'https://cors-anywhere.herokuapp.com/':null,
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search