full support for flutter-web #385

fischerscode · 2020-05-27T18:56:41Z

I recently tried run my app in the browser.
Last time I tried this, it worked. This time it didn't.
The difference between success and failure is the login I added recently.

Unsupported operation: Platform._operatingSystem is printed in the log.

It seems like dart:io is causing the issue. firebase/flutterfire#1257

For live query we have two separated files. One for mobile/desktop and one for web.
We could do similar for all the files using dart:io.

Any ideas/suggestions? Or should we not support flutter-web?

Edit:
CoreStoreSembastImp would need an update, too. I think sembast has an extra package for web.

The text was updated successfully, but these errors were encountered:

phillwiggins · 2020-05-28T05:57:04Z

Hey

I definitley think we should support flutter-web. I've been majorly tied up over the last few months so not had a chance to look into it. I was under the impression that Sembast would support flutter-web but I could be wrong. It would be great if we supported all platforms that Dart is able to run on?

fischerscode · 2020-05-28T10:21:20Z

It seems like universal_io should solve this problem.
Has anyone used universal_io yet?

nstrelow · 2020-06-11T10:47:02Z

Can we not just include universal_io? Seems it should do the trick.

nstrelow · 2020-06-11T10:58:22Z

I think this is just due to Platform.isAndroid etc. not being supported. At least that's were it breaks for me first.
I believe we can just use kIsWeb from foundations to check for web first.

I'll create a PR later, as we need this now, if we still want web to keep on working for us.

nstrelow · 2020-06-11T15:01:17Z

So my bad #392 did not fix web, but circumvented the first issue that arose.
Next one is:

Overflow on channel: uk.spiralarm.flutter/devicelocale.  Messages on this channel are being discarded in FIFO fashion.  The engine may not be running or you need to adjust the buffer size if of the channel.
╭-- Parse Response
Class: _User
Function: ParseApiRQ.loginAnonymous
Status Code: -1
Type: UnknownError
Exception: MissingPluginException(No implementation found for method currentLocale on channel uk.spiralarm.flutter/devicelocale)
╰--

Seems to be that devicelocale.currentLocale does not work on web.

Edit: Devicelocale does not support web: magnatronus/flutter-devicelocale#9

nstrelow · 2020-06-11T16:18:59Z

To get the current locale without the package devicelocale we can use: https://api.flutter.dev/flutter/dart-ui/Window/locale.html

Would look like this in parse_installation.dart:

//Locale
    if (!kIsWeb) {
      final String locale = await Devicelocale.currentLocale;
      if (locale != null && locale.isNotEmpty) {
        set<String>(keyLocaleIdentifier, locale);
      }
    } else {
      final String locale = ui.window.locale.languageCode;
      if (locale != null && locale.isNotEmpty) {
        set<String>(keyLocaleIdentifier, locale);
      }
    }

Next unsupported package is package_info: flutter/flutter#46609

This could also be just skipped by checking for kIsWeb:

//App info
    if (!kIsWeb) {
      final PackageInfo packageInfo = await PackageInfo.fromPlatform();
      set<String>(keyAppName, packageInfo.appName);
      set<String>(keyAppVersion, packageInfo.version);
      set<String>(keyAppIdentifier, packageInfo.packageName);
    }
    set<String>(keyParseVersion, keySdkVersion);

But now when creating a new user, I get this error:

╭-- Parse Response
Class: _User
Function: ParseApiRQ.signUp
Status Code: -1
Type: UnknownError
Exception: XMLHttpRequest error.
╰-- 



----
ParseException (Type: UnknownError) :
Code: -1
Message: XMLHttpRequest error.----

Not sure where to go from here, maybe @phillwiggins has an idea what is going wrong?

nstrelow · 2020-06-11T16:53:09Z

I think I traced the last one to the incompatibility of the http package.

http added support for web with this note:

In order to use or reference the IoClient directly, you will need to import the new package:http/io_client.dart import. This is typically only necessary if you are passing a custom HttpClient instance to the constructor, in which case you are already giving up support for web.

IOClient uses the dart:io package, which is not available on web. Will see if there is an alternative.

This line in ParseHttpClient uses IOClient if a security context is given:

        _client = securityContext != null
            ? IOClient(HttpClient(context: securityContext))
            : Client();

I'll try to find a way of not using IOClient, but not sure if possible.

EDIT: It seems to use BrowserClient instead of IOClient and still fail. So probably still a different issue.

nstrelow · 2020-06-11T18:28:39Z

Alright scratch the http package. In the end is a CORS error. I think that should be fixable.

Access to XMLHttpRequest at 'https://herokuapp.com/parse/users' from origin 'http://localhost:60240' has been blocked by CORS policy: Request header field x-parse-installation-id is not allowed by Access-Control-Allow-Headers in preflight response.

fischerscode · 2020-06-11T18:34:49Z

There is an option provided by the server to add custom headers.

Using env variables:
PARSE_SERVER_ALLOW_HEADERS=...

nstrelow · 2020-06-11T19:10:46Z

PARSE_SERVER_ALLOW_HEADERS is not working for my heroku setup sadly. Not sure what I am doing wrong: PARSE_SERVER_ALLOW_HEADERS=X-Parse-Installation-Id. Maybe because I am using express with parse-server

Is this normally required to set when using a the mobile SDKs?

Looking at parse-server there are default headers, which do not include the installation-id:

export const DEFAULT_ALLOWED_HEADERS =
  'X-Parse-Master-Key, X-Parse-REST-API-Key, X-Parse-Javascript-Key, X-Parse-Application-Id, X-Parse-Client-Version, X-Parse-Session-Token, X-Requested-With, X-Parse-Revocable-Session, Content-Type, Pragma, Cache-Control';

I guess mobile does not care about CORS and preflight. But for supporting web, we should either:

Omit the installation-id when on web (change in flutter sdk)
Make installation-id a default header (change in parse-server)
Add to README, that setting custom headers via env in server is required for web to work. (change for the user)

EDIT: Was able to set allowHeaders in ParseServerOptions. The parsing of the heroku env vars does not work for some reason.

fischerscode · 2020-06-11T19:52:04Z

I think the best solution is to add a note to the REAMDE for bow. And once web is tested a bit more and seems to work with the additional header we should create a pr to parse-server.

I am using the env methode in a kubernetes enviroment. Maybe it is only supported when using the docker image.

nstrelow · 2020-06-11T19:55:12Z

I agree with first adding something to Readme and then looking further.

Could be that the env variables are not passed through to the ParseServer npm package.

PR incoming

fischerscode · 2020-06-14T14:57:40Z

@nstrelow
I had to add x-parse-installation-id (in lowercase).
Without doing so, I have not been able to login.
I will investigate this later.

gorillatapstudio · 2020-06-20T03:16:31Z

Exception when run for web: Unsupported operation: Platform._operatingSystem
caused by ParseUser.loginWith('facebook', facebookAuth);
which calls parse_installation.dart/_updateInstallation() and it calls Platform.isAndroid which is not supported by web yet.
Hack we can add kIsWeb before calling the Platform to avoid the crash.

fischerscode · 2020-06-20T10:09:14Z

@nstrelow has done this in #395.

phillwiggins · 2020-07-27T07:26:09Z

No activity on this in a white. Can this be closed?

fischerscode · 2020-07-27T08:59:25Z

I had no time recently to work on this, but I want to get back to this.
But we can close this for now and reopen or open a new issue as soon as more work on this topic is done.

fischerscode · 2020-08-07T12:40:20Z

I am currently experimenting with web support for ParseFile.
As the whole file procedure is completely different on web I thought it might be reasonable to great a ParseWebFile class similar to the ParseFile class for mobile. This should solve the problem on the SDK level and the SDK user would get either a ParseFile or a ParseWebFile depending on the current platform.
This should not break existing apps and would make the SDK user think about how to use the file in the app. (On web referring an image by the url might be the best solution and on mobile downloading might be better.)
Due to the implementation of the "registeredSubClass" feature in 1.0.27 the provisioning of the two different file classes should be rather simple.

Any other ideas/suggestions?

fischerscode · 2020-08-07T20:38:47Z

I have started implementing this idea in this branch currently it seems to work just fine, but I have only tested reading, yet.

fischerscode · 2020-08-09T13:50:37Z

I have created a pr that should enable full file support (#409).
As far as I know, the sembast CoreStore is the only thing, that's missing web support.
Does anyone know about an other issue?

SuperKMan · 2020-08-30T03:42:17Z

Last week I tried to run my app in the browser, it worked. but today It cannot log in to my app got the error below:

Class: _User Function: ParseApiRQ.login Status Code: -1 Type: UnknownError Exception: XMLHttpRequest error.

nstrelow · 2020-08-30T17:05:05Z

Sadly I have not encountered this issue and it could mean anything.

Good luck on trying to fix it 💪

SuperKMan · 2020-08-31T07:47:57Z

I'm lucky. It works today with nothing to fix.

fischerscode · 2020-08-31T08:07:57Z

Maybe it was something with the server or the connection to the server was not fully working.

SuperKMan · 2020-09-23T12:15:21Z

Thank you. I got an error about "CoreStoreSharedPrefsImp" when I use Dart package instead of Flutter package. Do you have any suggestion?

fischerscode · 2020-09-23T12:54:23Z

CoreStoreSharedPrefsImp is not supported by the dart package as the shared preferences package is only available on flutter.

Why are you using the dart package instead of the flutter one?

SuperKMan · 2020-09-23T21:48:33Z

Just try #454 because I don't know how to fix the XMLHttpRequest error.

fischerscode · 2020-09-23T22:42:08Z

Is there any hint in your browsers log?
For example at chrome:

right click -> inspect -> console -> reload your application
right click -> inspect -> network -> reload your application

SuperKMan · 2020-09-24T13:43:07Z

I got this error in the console.
Access to XMLHttpRequest at 'https://parseapi.back4app.com/login?username=mongkolpoj%40gmail.com&password=xxxxxx' from origin 'http://vcm.back4app.io' has been blocked by CORS policy: Request header field x-parse-installation-id is not allowed by Access-Control-Allow-Headers in preflight response.

nstrelow · 2020-09-24T13:48:29Z

So "X-Parse-Installation-Id"
is not added to the Access-Control-Allow-Headers

Check lower-case / upper-case writing.

SuperKMan · 2020-09-24T15:03:03Z

Thank you. I already add this JSON to Parse Server Options:
{
"allowOrigin": "*",
"allowHeaders": [
"X-Parse-Master-Key",
"X-Parse-REST-API-Key",
"X-Parse-Javascript-Key",
"X-Parse-Client-Key",
"X-Parse-Application-Id",
"X-Parse-Client-Version",
"X-Parse-Session-Token",
"X-Requested-With",
"X-Parse-Revocable-Session",
"Content-Type",
"X-Parse-Installation-Id"
]
}

SuperKMan · 2020-09-24T15:03:23Z

It works now when I changed the domain 'https://parseapi.back4app.com' to 'https://vcm.back4app.io' and deploy to Back4App. But still got an XMLHTTPRequest error when I ran from AndroidStudio.

SuperKMan · 2020-10-02T00:41:04Z

I got an error about debug property below. Any idea?

fischerscode · 2020-10-02T01:16:58Z

Do you have a ParseLiveListWidget in your widget tree before Parse.init() finished?

PawlikMichal25 · 2020-10-02T09:27:14Z

@fischerscode @phillwiggins
When do you expect to release version 1.0.28 to pub?
It could be even as 1.0.28-dev or something.

We have been using version 1.0.28 on Flutter Web for 3 weeks now and everything works smoothly 👍

fischerscode · 2020-10-02T10:04:23Z

@BaranMichal25
I would love, to add #458 to 1.0.28, maybe I will find time today to finish the tasks.
Only @phillwiggins can create a release on pub.dev, as it is his personal account.
1.0.28-dev sounds like a good idea, too.

We have been using version 1.0.28 on Flutter Web for 3 weeks now and everything works smoothly

Glad to hear that, I am currently running this branch which uses dio, and I had no time testing both branches.

@phillwiggins
Should we use dio in 1.0.28?
For me it runs great and it would add the upload progress (#366).

phillwiggins · 2020-10-02T10:05:36Z

I'm fine for DIO to be used. Are there many breaking changes?

…

On Fri, 2 Oct 2020 at 11:04, Maximilian Fischer ***@***.***> wrote: @BaranMichal25 <https://github.com/BaranMichal25> I would love, to add #458 <#458> to 1.0.28, maybe I will find time today to finish the tasks. Only @phillwiggins <https://github.com/phillwiggins> can create a release on pub.dev, as it is his personal account. 1.0.28-dev sounds like a good idea, too. We have been using version 1.0.28 on Flutter Web for 3 weeks now and everything works smoothly Glad to hear that, I am currently running this branch <https://github.com/fischerscode/Parse-SDK-Flutter/tree/testing-branch-1> which uses dio, and I had no time testing both branches. @phillwiggins <https://github.com/phillwiggins> Should we use dio in 1.0.28? For me it runs great and it would add support for the upload progress ( #366 <#366>). — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#385 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AB4CPXQJDFMGYTZMOIOVBFDSIWQTPANCNFSM4NMNDNEA> .

-- Kind Regards Phill Wiggins [email protected]

fischerscode · 2020-10-02T10:08:50Z

@phillwiggins
Great!
I think there are not breaking changes at all. (Expect I you are overriding the ParseHTTPClient?)

phillwiggins · 2020-10-02T10:10:24Z

Go for it then! I can release when you're ready. I'm not actually using Flutter at the moment. That project has been sidelined so I'm fine for breaking changes.

…

On Fri, 2 Oct 2020 at 11:09, Maximilian Fischer ***@***.***> wrote: @phillwiggins <https://github.com/phillwiggins> Great! I think there are not breaking changes at all. (Expect I you are overriding the ParseHTTPClient?) — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#385 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AB4CPXW4MC2UQPRR6S3PENDSIWREFANCNFSM4NMNDNEA> .

-- Kind Regards Phill Wiggins [email protected]

SuperKMan · 2020-10-02T10:52:43Z

Do you have a ParseLiveListWidget in your widget tree before Parse.init() finished?

This is my init code:
class _AppState extends State {
String text = '';

@OverRide
void initState() {
super.initState();
initData();
}

Future initCoreStore() async {
//return CoreStoreSembastImp.getInstance();
return CoreStoreSharedPrefsImp.getInstance();
}

Future initData() async {
final document = await getApplicationDocumentsDirectory();
Hive.init(document.path);
Hive.registerAdapter(ProvinceAdapter());
//Hive.openBox('province');
//await Hive.initFlutter();

//await initCoreStore();

// Initialize parse
await Parse().initialize(kApplicationId, kParseServerUrl,
    //masterKey: kParseMasterKey,
    clientKey: kParseClientKey,
    //debug: false,
    //liveQueryUrl: keyLiveQueryUrl, // Required if using LiveQuery
    autoSendSessionId: true,
    //securityContext: securityContext, // Again, required for some setups
    coreStore: await CoreStoreSharedPrefsImp
        .getInstance()); // Local data storage method. Will use SharedPreferences instead of Sembast as an internal DB

//parse serve with secure store and desktop support

//    Parse().initialize(keyParseApplicationId, keyParseServerUrl,
//        masterKey: keyParseMasterKey,
//        debug: true,
//        coreStore: CoreStoreSharedPrefsImp.getInstance());

var responseCfg = await ParseConfig().getConfigs();
// Check server is healthy and live - Debug is on in this instance so check logs for result
final ParseResponse response = await Parse().healthCheck();
if (response.success) {
  print('System ready');
} else {
  print(response.error);
}

}

SuperKMan · 2020-10-02T10:54:11Z

@fischerscode @phillwiggins
When do you expect to release version 1.0.28 to pub?
It could be even as 1.0.28-dev or something.

We have been using version 1.0.28 on Flutter Web for 3 weeks now and everything works smoothly 👍

I use 1.0.27

fischerscode · 2020-10-02T12:46:47Z

I think 1.0.27 does not fully support web, but most functions should work.
@SuperKMan
Are you waiting with building you ParseLiveListWidget until the Future of your initData() function finished?
For an example, have a look at the example_livelist.

SuperKMan · 2020-10-03T06:17:48Z

I think 1.0.27 does not fully support web, but most functions should work.
@SuperKMan
Are you waiting with building you ParseLiveListWidget until the Future of your initData() function finished?
For an example, have a look at the example_livelist.

Thank you.

nstrelow · 2020-10-07T10:11:07Z

@fischerscode Anything holding off the release?
Currently I set my pubspec.yaml to the last commit before the spilt 🙈 .

fischerscode · 2020-10-07T10:22:29Z

@nstrelow
No, I think everything works. I just had little time this week so far.
Tomorrow this should be different.
I aim to merge all pending PRs tomorrow. And maybe include a solution for #465.

Added section for tests at migration guide. Fix: parse-community#385 (comment)

Added section for tests at migration guide. Fix: #385 (comment)

fischerscode · 2020-10-11T10:22:40Z

With the release of 1.0.28, web should now be fully supported.
Please file an issue, if you encounter a problem.

nstrelow · 2020-10-11T20:39:49Z

@fischerscode Awesome, thanks for the hard work.
Will be delighted to update my pubspec.yaml to point to pub.dev again ^^

fischerscode mentioned this issue May 28, 2020

Does it support Flutter Web? #370

Closed

This was referenced Jun 11, 2020

[web] Check web before Platform.isX #391

Closed

[web] Check web before Platform.isX #392

Merged

WIP: Add sembast_web and load correct databaseFactoryWeb #394

Closed

nstrelow mentioned this issue Jun 11, 2020

Make web compatible calls for locale and skip PackageInfo #395

Merged

fischerscode mentioned this issue Aug 9, 2020

File Support for web #409

Merged

fischerscode mentioned this issue Sep 23, 2020

Can I use this not in a flutter project? For example in a dart aqueduct? #454

Closed

fischerscode mentioned this issue Oct 8, 2020

Release/1.0.28 #460

Merged

7 tasks

fischerscode added a commit to fischerscode/Parse-SDK-Flutter that referenced this issue Oct 9, 2020

Update migrate-1-0-28.md

c2c30fb

Added section for tests at migration guide. Fix: parse-community#385 (comment)

fischerscode mentioned this issue Oct 9, 2020

Update migrate-1-0-28.md | Added section for tests #471

Merged

fischerscode added a commit that referenced this issue Oct 9, 2020

Update migrate-1-0-28.md (#471)

ee68a84

Added section for tests at migration guide. Fix: #385 (comment)

fischerscode closed this as completed in e35d28d Oct 11, 2020

RodrigoSMarques mentioned this issue Feb 22, 2022

Error: access blocked by CORS policy #704

Closed

4 tasks

full support for flutter-web #385

full support for flutter-web #385

Comments

fischerscode commented May 27, 2020 • edited Loading

phillwiggins commented May 28, 2020

fischerscode commented May 28, 2020

nstrelow commented Jun 11, 2020

nstrelow commented Jun 11, 2020

nstrelow commented Jun 11, 2020 • edited Loading

nstrelow commented Jun 11, 2020 • edited Loading

nstrelow commented Jun 11, 2020 • edited Loading

nstrelow commented Jun 11, 2020 • edited Loading

fischerscode commented Jun 11, 2020 • edited Loading

nstrelow commented Jun 11, 2020 • edited Loading

fischerscode commented Jun 11, 2020

nstrelow commented Jun 11, 2020 • edited Loading

fischerscode commented Jun 14, 2020

gorillatapstudio commented Jun 20, 2020

fischerscode commented Jun 20, 2020

phillwiggins commented Jul 27, 2020

fischerscode commented Jul 27, 2020

fischerscode commented Aug 7, 2020

fischerscode commented Aug 7, 2020

fischerscode commented Aug 9, 2020 • edited Loading

SuperKMan commented Aug 30, 2020

nstrelow commented Aug 30, 2020

SuperKMan commented Aug 31, 2020

fischerscode commented Aug 31, 2020

SuperKMan commented Sep 23, 2020

fischerscode commented Sep 23, 2020

SuperKMan commented Sep 23, 2020

fischerscode commented Sep 23, 2020

SuperKMan commented Sep 24, 2020

nstrelow commented Sep 24, 2020

SuperKMan commented Sep 24, 2020

SuperKMan commented Sep 24, 2020

SuperKMan commented Oct 2, 2020

fischerscode commented Oct 2, 2020

PawlikMichal25 commented Oct 2, 2020

fischerscode commented Oct 2, 2020 • edited Loading

phillwiggins commented Oct 2, 2020 via email

fischerscode commented Oct 2, 2020

phillwiggins commented Oct 2, 2020 via email

SuperKMan commented Oct 2, 2020

SuperKMan commented Oct 2, 2020

fischerscode commented Oct 2, 2020

SuperKMan commented Oct 3, 2020

nstrelow commented Oct 7, 2020

fischerscode commented Oct 7, 2020

fischerscode commented Oct 11, 2020

nstrelow commented Oct 11, 2020

fischerscode commented May 27, 2020 •

edited

Loading

nstrelow commented Jun 11, 2020 •

edited

Loading

nstrelow commented Jun 11, 2020 •

edited

Loading

nstrelow commented Jun 11, 2020 •

edited

Loading

nstrelow commented Jun 11, 2020 •

edited

Loading

fischerscode commented Jun 11, 2020 •

edited

Loading

nstrelow commented Jun 11, 2020 •

edited

Loading

nstrelow commented Jun 11, 2020 •

edited

Loading

fischerscode commented Aug 9, 2020 •

edited

Loading

fischerscode commented Oct 2, 2020 •

edited

Loading