devtools icon indicating copy to clipboard operation
devtools copied to clipboard

Not showing response tab under network

Open mohitsharma3829 opened this issue 4 years ago • 28 comments

Dev tool not showing response tab

mohitsharma3829 avatar Apr 05 '21 11:04 mohitsharma3829

What version of DevTools are you on? @bkonyi will this be fixed with the 2.1.0 release?

kenzieschmoll avatar Apr 05 '21 16:04 kenzieschmoll

No, this the same issue we've been having. The full fix should be available once the next Flutter beta goes out.

On Mon, Apr 5, 2021, 9:19 AM Kenzie Schmoll @.***> wrote:

What version of DevTools are you on? @bkonyi https://github.com/bkonyi will this be fixed with the 2.1.0 release?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/flutter/devtools/issues/2860#issuecomment-813481894, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFYWZYEGUYH7VTDAJMZBPRDTHHPKXANCNFSM42MWH55A .

bkonyi avatar Apr 05 '21 16:04 bkonyi

@kenzieschmoll @bkonyi hi... I know the response tab is buggy since the advent of the dart Dev Tool... but right now it seems the whole network intercepting is not working since the publish of the 2.1.0 version...

image

I swear to God I have made network request(otherwise my app won't work....)

And we have at least the requesting networking showing in the past version... what's wrong? should I update my Flutter?

Here is the flutter doctor -v
[✓] Flutter (Channel stable, 2.0.3, on macOS 11.2.3 20D91 darwin-x64, locale en)
    • Flutter version 2.0.3 at /Users/benjaminli/software_dev/sdks/flutter
    • Framework revision 4d7946a68d (3 weeks ago), 2021-03-18 17:24:33 -0700
    • Engine revision 3459eb2436
    • Dart version 2.12.2

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
    • Android SDK at /Users/benjaminli/Library/Android/Sdk
    • Platform android-30, build-tools 30.0.2
    • ANDROID_HOME = /Users/benjaminli/Library/Android/Sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.4, Build version 12D4e
    • CocoaPods version 1.10.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)

[✓] VS Code (version 1.55.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Proxy Configuration
    • HTTP_PROXY is set
    • NO_PROXY is localhost,127.0.0.1,LOCALHOST
    • NO_PROXY contains 127.0.0.1
    • NO_PROXY contains localhost

[✓] Connected device (2 available)
    • sdk gphone x86 arm (mobile) • emulator-5554 • android-x86    • Android 11 (API 30) (emulator)
    • Chrome (web)                • chrome        • web-javascript • Google Chrome 89.0.4389.114

• No issues found!

Help.... what's going on... and it seems we can't select which version of the DevTool to use... it just automatically upgrade to the latest when I open the tool....

renntbenrennt avatar Apr 06 '21 18:04 renntbenrennt

Thanks for the heads up @SeasonLeee, looks like we had a bad version constraint and we're trying to use the new network profiling RPCs when we should be using the original implementation for applications built on the stable branch. We have a fix up in https://github.com/flutter/devtools/pull/2867 and will have a patch released shortly.

bkonyi avatar Apr 06 '21 19:04 bkonyi

@SeasonLeee updating to 2.1.1 should fix your issue.

bkonyi avatar Apr 06 '21 20:04 bkonyi

@bkonyi confirm fix.

and I also have another question, what exactly is this InternetAddress indicating?

image

on the right panel, its content type is websocket, well, I do have websocket in our project, but it's established by third party package, and actually, the websocket is still working, but this panel only shows this InternetAddress once... assuming this InternetAddress is websocket connection...

anyway, what is it?

renntbenrennt avatar Apr 07 '21 02:04 renntbenrennt

@SeasonLeee Hi! I have the same exact thing that you have and I don't even use or connect to any websocket server. A websocket request always happen after my http requests and it is slowing down my application's request time. Is anyone know why that websocket request happens ?

osmanaslancan avatar May 15 '21 18:05 osmanaslancan

Network devtools are broken for me as well, even after upgrading Flutter to 2.10.1.

I get api response logs in my console (flutter: Http status error [403]), but the network tab stays empty.

Flutter 2.10.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision db747aa133 (7 days ago) • 2022-02-09 13:57:35 -0600
Engine • revision ab46186b24
Tools • Dart 2.16.1 • DevTools 2.9.2

Flutter doctor

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.10.1, on macOS 11.6 20G165 darwin-x64, locale en-NL)
[✓] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2020.3)
[✓] Android Studio (version 2020.3)
[✓] IntelliJ IDEA Community Edition (version 2021.1)
[✓] IntelliJ IDEA Community Edition (version 2021.2.3)
[✓] VS Code (version 1.64.1)
[✓] Connected device (2 available)
[✓] HTTP Host Availability

• No issues found!

GunnarAK avatar Feb 16 '22 10:02 GunnarAK

@GunnarAK Yeah, I'm on 2.10.2 and Network devtools endlessly says "showing 0 of 0 requests" with a spinner going constantly. One thing you can do, if you're developing for the web too, is you can use Chrome DevTools to see your network traffic.

Unfortunately for me, the problem I'm dealing with happens on real device (not emulator or Chrome) so I really would like Flutter network tab to work so I can see what's going on :-(

jpangburn avatar Feb 28 '22 18:02 jpangburn

@GunnarAK @jpangburn what APIs are you using to make your network requests?

bkonyi avatar Feb 28 '22 18:02 bkonyi

@bkonyi I'm using Firebase. I tried the authentication module against both the local Firebase emulator (http) and against live Firebase (https) with a real device. It doesn't seem to matter if I'm running the Network DevTools tab directly in VSCode or if I run the entire Flutter DevTools in Chrome and have the Network tab open, I have them both open at the same time and neither gets any data. Also tried with iOS simulator pointed at local Firebase emulator, with Network DevTools tab open in VSCode and open in Chrome at the same time- still nothing.

jpangburn avatar Feb 28 '22 22:02 jpangburn

I'm using Dio to make requests to https://api.igdb.com/ I'm developing for iOS and Android.

It worked for me the week prior, but when reopening the project (no new changes) it decided to not show anything. No errors in my console/terminal/VSCode, where-ever.

PS: I'm quite new to Flutter/Dart. Trying to build a relatively simple Flutter application

GunnarAK avatar Mar 01 '22 12:03 GunnarAK

@jpangburn this is using the Flutter Firebase plugins, correct? I'm not 100% sure they're using the Dart HTTP implementation (they might be using the Android/iOS HTTP stacks), and if they're not, the network profiler unfortunately won't know anything about those requests. If that's the case, you should be able to use something like the Network Inspector in Android Studio.

@GunnarAK I'm also not 100% sure if Dio is using the built-in HTTP stack in dart:io. Can I trouble you to share your code for the request so I can build a reproduction case?

bkonyi avatar Mar 01 '22 22:03 bkonyi

@jpangburn after giving a quick look at the Firebase plugins, I'm 99% sure that the network requests aren't being made through dart:io, but through the Android networking stack. As far as I can tell, the Firebase plugins are wrapping the native Android/iOS Firebase APIs.

@kenzieschmoll we should document this or investigate what it would take to get network profiling data from the native HTTP stacks into DevTools.

bkonyi avatar Mar 01 '22 22:03 bkonyi

@bkonyi yes I’m using the plugins, and I’ve debugged into it before and they are using native platform delegates to connect. Sorry I didn’t know that this network monitor required dart io or it would have been clear why it didn’t work. Would be nice if it worked for the firebase plugins as I imagine they’re pretty popular?

jpangburn avatar Mar 02 '22 01:03 jpangburn

@bkonyi yes I’m using the plugins, and I’ve debugged into it before and they are using native platform delegates to connect. Sorry I didn’t know that this network monitor required dart io or it would have been clear why it didn’t work. Would be nice if it worked for the firebase plugins as I imagine they’re pretty popular?

@jpangburn no worries, it's not obvious that those plugins don't use dart:io or that the network profiler depends on dart:io. We definitely want to hook into more native profiling data where we can, but it's not as easy as it sounds, unfortunately. We should do a better job communicating the limitations of the network profiler at the very least... :-)

bkonyi avatar Mar 02 '22 01:03 bkonyi

@bkonyi Requests I made from Dio programs don't show up in DevTools' network

jahnli avatar Mar 02 '22 09:03 jahnli

@bkonyi Yes, as you say, it would also be nice if there was some large disclaimer that says "The Network DevTools will ONLY show traffic that comes from dart:io requests- be aware that many plugins may use native code for networking which will not show up here." Otherwise people like @jahnli, myself, and probably many others spend lots of time trying to figure out what they're doing wrong when really we should be using platform specific network monitoring tools. The current page has nothing like that, so new people are left to assume that it will just work.

jpangburn avatar Mar 02 '22 17:03 jpangburn

I am not sure but when I restart chrome (on macos) it tentatively works for a short period of time and stops working again. There are definitely some things are going on. I disabled all my chrome extensions just to make sure but no luck. Maybe I can try to restart my computer later but this is definitely hard to reproduce all time.

Thanks

aquadesk avatar Mar 02 '22 19:03 aquadesk

@bkonyi one week prior to my issues with the network inspector it worked. I did not make any changes to my codebase in the meantime. 😓 Due to the network inspector issues I tried upgrading Flutter hoping that would fix the issue. The upgrade was advised by my terminal output when installing the application on my Android device. Below you can find my dio implementation.

dependencies dio: ^4.0.4 json_serializable: ^6.1.4

devDependencies build_runner: ^2.1.7

Note: Network inspector is also empty when installing my app on a iOS simulator.

http_service.dart

import 'package:dio/dio.dart';

// should actually never be saved in git
const clientId = '***';
const accessToken = '***';

class HttpService {
  late Dio _dio;

  HttpService() {
    _dio = Dio(
      BaseOptions(
        baseUrl: 'https://api.igdb.com/v4/',
        headers: {
          "Authorization": "Bearer " + accessToken,
          "Client-ID": clientId,
          "Content-Type": "application/json",
        },
      ),
    );

    initializeInterceptors();
  }
  
  Future<Response> postRequest(String endpoint, String body) async {
    Response response;

    try {
      response = await _dio.post(
        endpoint,
        data: body,
      );
    } on DioError catch (e) {
      throw Exception(e.message);
    }

    return response;
  }

  initializeInterceptors() {
    // BROKEN: Only onRequest prints log, but onResponse never does??

    // _dio.interceptors.clear();
    // _dio.interceptors.add(
    //   InterceptorsWrapper(
    //     onError: (error, errorInterceptorHandler) {
    //       print(error.toString());
    //       throw error;
    //     },
    //     onRequest: (request, requestInterceptorHandler) {
    //       print("${request.method}: ${request.path}");
    //     },
    //     onResponse: (response, responseInterceptorHandler) {
    //       print(response.data);
    //     },
    //   ),
    // );
  }
}

listings.dart

import 'package:igdb_showcaser/models/listing.dart';
import 'package:igdb_showcaser/models/listing_full.dart';
import 'http_service.dart';

HttpService httpService = HttpService();

Future<List<Listing>> getGameListings() async {
  const requestBody = 'fields name, cover.*, created_at; sort created_at desc;';

  var response = await httpService.postRequest('games', requestBody);

  List<Listing> result =
      (response.data as List).map((i) => Listing.fromJson(i)).toList();

  return result;
}

models/listing.dart

import 'package:igdb_showcaser/models/cover.dart';
import 'package:json_annotation/json_annotation.dart';

// Run command: flutter pub run build_runner build
part 'listing.g.dart';

@JsonSerializable()
class Listing {
  // these values below should be available in json response (https://pub.dev/packages/json_serializable/example)
  int id;
  String name;
  Cover? cover;

  @JsonKey(name: 'created_at')
  int createdAt;

  Listing({
    required this.id,
    required this.name,
    this.cover,
    required this.createdAt,
  });

  factory Listing.fromJson(Map<String, dynamic> json) =>
      _$ListingFromJson(json);
  Map<String, dynamic> toJson() => _$ListingToJson(this);
}

models/cover.dart

import 'package:json_annotation/json_annotation.dart';

part 'cover.g.dart';

@JsonSerializable()
class Cover {
  int id;
  bool alpha_channel;
  bool animated;
  int game; // gameId
  int height;
  String image_id;
  String url;
  int width;
  String checksum;

  Cover({
    required this.id,
    required this.alpha_channel,
    required this.animated,
    required this.game,
    required this.height,
    required this.image_id,
    required this.url,
    required this.width,
    required this.checksum,
  });

  factory Cover.fromJson(Map<String, dynamic> json) => _$CoverFromJson(json);
  Map<String, dynamic> toJson() => _$CoverToJson(this);
}

GunnarAK avatar Mar 04 '22 08:03 GunnarAK

@jpangburn But he used to be perfectly able to work , it wasn't empty every time, it just popped up occasionally in Netowrk, and I think that was a problem,

jahnli avatar Mar 04 '22 09:03 jahnli

@jpangburn It will work for a short time and then stop working again

jahnli avatar Mar 04 '22 09:03 jahnli

I'm experiencing the same issue certain Network request are displayed inside Devtools but others don't show up

AristideVB avatar May 04 '22 10:05 AristideVB

Same issue

karelric avatar May 05 '22 12:05 karelric

same issue

laohanme avatar May 28 '22 06:05 laohanme

Same issue here as well.

sunderee avatar Jun 09 '22 12:06 sunderee

I'm having the same issue too

vinothvino42 avatar Aug 17 '22 07:08 vinothvino42

still not fixed...

marko-djukic avatar Aug 30 '22 10:08 marko-djukic

Same issue here as well

rutajdash avatar Nov 07 '22 10:11 rutajdash

same issue :/

ayberkcal avatar Nov 10 '22 08:11 ayberkcal

here too

FlorianFlatscher avatar Nov 13 '22 20:11 FlorianFlatscher

here too

adrienlaurent avatar Nov 18 '22 19:11 adrienlaurent