flutter / samples

A collection of Flutter examples and demos
https://flutter.github.io/samples/
Other
17.19k stars 7.51k forks source link

experimental/desktop_photo_search doesn't handle utf8 correctly. #586

Closed domesticmouse closed 2 years ago

domesticmouse commented 3 years ago

@mit-mit who should I chat to about built_value and decoding utf8 data correctly? I'm guessing I need to use characters with built_value somehow?

mit-mit commented 3 years ago

cc @davidmorgan @lrhn

davidmorgan commented 3 years ago

Could you give a bit more info on the issue you're seeing, please?

domesticmouse commented 3 years ago

30,000' explanation is that I'm incorrectly rendering search requests that contain non-latin1 characters:

Screen Shot 2020-11-07 at 11 42 38 am

In digging into the problem (see https://github.com/flutter/samples/pull/587/files) I figured out a couple of things. First, our http package will default to decoding an application/json stream with the latin1 parser. Unfortunately for me, Unsplash API is returning API results using UTF8 without declaring it as such.

davidmorgan commented 3 years ago

Thanks--indeed, looks like the issue is outside built_value.

lrhn commented 3 years ago

And outside characters too. You'll have to set the encoding on the HTTP request manually.

import "package:http/http.dart";
...
  var response = await get(uri);
  var data = json.fuse(utf8).decode(response.bodyBytes);

(Do use the http package for HTTP requests, because using dart:io is not compatible with Flutter-for-Web).

domesticmouse commented 3 years ago

With the above integrated in https://github.com/flutter/samples/pull/590/commits/8e0f5c441fc2d4eaf7b3b4526c424336f6bd0202, it still trips up on the following on macOS (but renders fine in Chrome).

      "user": {
        "id": "JzhDKu_NfNs",
        "updated_at": "2020-11-08T00:33:05-05:00",
        "username": "arusfly",
        "name": "Arusfly 🌿",
        "first_name": "Arusfly 🌿",
        "last_name": null,
        "twitter_username": "arusfly",
        "portfolio_url": "http://www.instagram.com/vallartadiarios",
        "bio": null,
        "location": "Puerto Vallarta",
        "links": {
          "self": "https://api.unsplash.com/users/arusfly",
          "html": "https://unsplash.com/@arusfly",
          "photos": "https://api.unsplash.com/users/arusfly/photos",
          "likes": "https://api.unsplash.com/users/arusfly/likes",
          "portfolio": "https://api.unsplash.com/users/arusfly/portfolio",
          "following": "https://api.unsplash.com/users/arusfly/following",
          "followers": "https://api.unsplash.com/users/arusfly/followers"
        },
        "profile_image": {
          "small": "https://images.unsplash.com/profile-1588638936205-9c639973f359image?ixlib=rb-1.2.1&q=80&fm=jpg&crop=faces&cs=tinysrgb&fit=crop&h=32&w=32",
          "medium": "https://images.unsplash.com/profile-1588638936205-9c639973f359image?ixlib=rb-1.2.1&q=80&fm=jpg&crop=faces&cs=tinysrgb&fit=crop&h=64&w=64",
          "large": "https://images.unsplash.com/profile-1588638936205-9c639973f359image?ixlib=rb-1.2.1&q=80&fm=jpg&crop=faces&cs=tinysrgb&fit=crop&h=128&w=128"
        },
        "instagram_username": "vallartadiarios ",
        "total_collections": 0,
        "total_likes": 61,
        "total_photos": 33,
        "accepted_tos": true
      },
Screen Shot 2020-11-10 at 4 48 45 pm