mardi 1 décembre 2020

Fluttter web app does not work with local golang http server

I know it sounds like a beginner's question, but there I go: I've developed a small app to be used locally in restaurantes for the waiters to be able to take orders in their phones. Pretty basic. I also developed a simple go http server to implement the necessary API. It works fine on "mobile" version, both in the emulator and actual devices.

The next step is to port the app so it can be used by the costumers in their phones' browsers. When I changed it to the web version, it worked correctly in Chrome and Edge, at least in terms of UI and navigation. But I am not able to use the API because I get the XMLHTTPError in all requests (that's what the error capture returns, I don't know how to get more details on that). I did a little research on the matter, and one of the answers includes changing configurations in Chrome, etc., which would be impossible for the costumers to do. Also it seems that a possibility is changing the go server from http to https.

This is my go lang http server code (part of)

func main() {
r := mux.NewRouter()
http.Handle("/", r)
r.HandleFunc("/api/getgarcon", get_garcon).Methods("GET")
log.Fatal(http.ListenAndServe(":8000", r))
}

get_garcon is a function that returns a JSON list of the registered waiters for login. As I said before, it works correctly if the client is a mobile app.

This is the flutter/dart code in the app

Future<List<Garcon>> getGarcon() async {
  var data;
  try {
    print(glbHttpServer + "api/getgarcon");
    data = await http.get(
      glbHttpServer + "api/getgarcon",
      headers: {'Content-Type': 'application/json','Access-Control-Allow-Origin':'*',
      'Access-Control-Allow-Methods':'HEAD, GET, POST, PUT, PATCH, DELETE, OPTIONS',
      'Access-Control-Allow-Headers':'X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method,Access-Control-Request-Headers, Authorization'},
    );
  } catch (e) {
    print("getgarcon=" + e.toString());
  }
  etc...

glbHttpServer is a variable whose value is like "https://ift.tt/36pnOGU" I added those headers trying to get this to work for the web app. Previously (for the mobile app) there was only the 'Content-Type': 'application/json' header.

As additional information, both the web app and the go server are on the same machine. If I type http://192.168.29.94:8000/api/getgarcon in a Chrome window (or Edge window), it works.Same with localhost or 127.0.0.1.

So what I'm asking here is: which is the least complicated way to go? Adding some different code in my app? Changing the server from http to https? Or is other solution available that I haven't found?

And most important: is it worth the effort, given that current state of flutter web?

Thanks for any help.




Aucun commentaire:

Enregistrer un commentaire