I can't seem to view the Request Payload of 10 million characters in the Chrome Network tab

Operating on a Mac with version 10.13, I have encountered an issue while using Chrome devtools. When inspecting an XHR request and clicking on the Headers for an application/JSON request with a payload exceeding 10 million characters, I am only able to see limited information. The data is being sent using the angular $http() post method.

If the JSON request has a payload less than 10 million characters, the request payload displays properly as shown in the image below.

https://i.sstatic.net/G4kpq.png

However, if the JSON request exceeds 10 million characters, the request payload does not display at all, as demonstrated in the following image.https://i.sstatic.net/ILcuK.png

I need assistance in identifying whether this issue stems from Javascript or Chrome. Can you please help me determine what mistake I may be making?

javascriptangularjsajaxgoogle-chrome

Answer №1

I've tried pure javascript to reproduce the issue without success.

To avoid cluttering StackOverflow with a 10 million character string, I will share the code on jsbin: 

var xhr = new XMLHttpRequest();
xhr.open("POST", 'google.com', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify({
    value: tenMilCharString
}));

Here is the link to the jsbin: https://jsbin.com/fatigahufo/edit?js

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

In my experience, I have encountered issues with certain routes not functioning properly within Express

I am currently working on developing a tic-tac-toe game and looking to store user data in a database. However, I am facing an issue with the router I intended to use for this purpose as it is returning an 'Internal server error message (500)'. B ...

javascriptnode.jsexpress

Ways to prevent body scrolling when the mobile menu is open

Is there a way to prevent the body from scrolling when I open a menu on a mobile device? function stopBodyScrollOnMenuOpen() { $('.header .navbar .navbar-toggler i').on('click', function (event) { $('body').toggleClass( ...

javascriptjqueryhtmlcssweb

Tips for arranging the items within the slider according to the specified direction (rtl, ltr) in the Owl Carousel slider for Angular

Is there a way to dynamically change the direction of the owl-carousel-o angular slider based on the selected language? Currently, I have set rtl: true in the owl-carousel configuration during initialization. However, when the user switches to a different ...

javascriptcssangularowl-carousel

Implementing Vue directives in separate files and importing them into components: A step-by-step guide

For a project using Vuelidate, I have set up a timeout for validation when a user types something. While I achieved success using mixins, I wanted to adhere to good coding practices by creating a Vue directive without globally registering it, and utilizing ...

javascriptvue.jsvue-componentvuelidatevue-directives

A guide to integrating gatsby-remark-images-grid in markdown with Gatsby.js

Currently, I am working on creating a blog using Gatsby.js with markdown and I want to incorporate CSS grid into my blog posts to showcase a beautiful grid layout of images. I am aware that Gatsby offers incredible plugins to address various challenges. ...

javascriptreactjsmarkdowngatsby

Filter feature malfunctioning in Select2

My dropdownmenu is implemented using Select2 and is populated via an Ajax call to PHP, which retrieves data from MySQL. In the search field of the Select2 dropdownmenu, the letters I type get underlined but the filter functionality does not work. As a res ...

javascriptajaxjsonjquery-select2

Utilizing Jquery Ajax for Validating Asp.Net Web Forms

Looking for the top-rated tutorial on implementing ASP.NET web form validation with jQuery (Ajax) without using a plugin. The goal is to create an Ajax form using jQuery. I have a registration form and upon submission, I aim to trigger an ASP.NET validati ...

jqueryasp.netajax

Transferring class titles between div elements

I would like to implement a feature where class names on div elements shift after a brief delay, perhaps 10 seconds. My goal is for the 3 classes listed below to cycle through the div elements and start over once it reaches the last one. For instance: & ...

javascriptjqueryhtmlcss

I am looking to display the results table on the same page after submitting a form to filter content. Can you provide guidance on how to achieve this?

Could someone provide guidance on how to approach the coding aspect of my current issue? I have a search form that includes a select form and a text box. Upon submission, a table is generated with results filtered from the form. Should I utilize a sessio ...

javascriptphpjqueryformssession

Can Express not use await?

Why am I encountering a SyntaxError that says "await is only valid in async function" even though I am using await inside an async function? (async function(){ 'use strict'; const express = require("express"); const bodyParser = ...

javascriptnode.jsexpressecmascript-6

Trouble with nested calls in $.getJSON

function dispatchVehicle(){ if(!checkAll()){ return false; } var action = window.url + '?&method=dispatchVehicles' + "&conLclFlag=" + conLclFlag + "&containerId=" + c ...

jqueryajaxjsongetjson

What is the best way to separate a string value with commas and send it to a controller?

Within my SQL table named Products, there is a field called AvailableSizes with a data type of NVARCHAR, which stores all the available sizes for a product. In my view, I have separated the values of the AvailableSizes field as shown below: <p> ...

javascriptajaxasp.net-mvc

When a project sets useBuiltIns to 'usage', there is an issue with importing the library generated by Webpack

I am eager to create a versatile UI component library and bundle it with Webpack. However, I encountered an issue when trying to import it into another project that has useBuiltIns: 'usage' specified in the babelrc file. The import fails with the ...

javascriptvue.jswebpackbabeljs

During the selenium testing process, there is an issue preventing clients from connecting to the server

I am currently developing selenium tests (coded in C# using the chrome webdriver) for a javascript web application that utilizes a backend server powered by WebApi 5.2.4. The CORS feature is enabled with lenient settings: namespace SealingService { pu ...

c#google-chromeseleniumasp.net-web-apicors

Obtain the query response time/duration using react-query

Currently utilizing the useQuery function from react-query. I am interested in determining the duration between when the query was initiated and when it successfully completed. I have been unable to identify this information using the return type or para ...

javascriptreactjstypescripttimereact-query

Efficiency of Promise-based parallel insert queries in MySQL falls short

I have developed a code in Node.js to execute insert queries using Promise.js but unfortunately, I am encountering an exception stating "Duplicate Primary Key" entry. Here is the snippet of the code: var Promise = require("promise"); var mySql = requir ...

javascriptnode.jspromisenode-mysql

Opting to monitor element visibility over relying solely on page load with Neustar WPM

I need help with writing a Neustar WPM script to time the button click until an overlay appears. Here is what my current script looks like: var webDriver = test.openBrowser(); var selenium = webDriver.getSelenium(); webDriver.get('https://www. ...

javascriptselenium

What is the best way to insert a bullet point in between items?

I am facing an issue with placing a bullet point between list items generated from ng-repeat in Angular. Despite my efforts, the bullet point keeps appearing after the items instead of between them. Here is how it currently looks: Venue1‏• $20 Ho ...

htmlcssangularjs

Unexpected token encountered when testing Ajax call with JSON response

Currently, I have a Vue application with the following code snippet... var vm = new Vue({ el: '#Workbooks', components: { 'workbook-list': workbooklist }, data: { workbooks: [], message: '', loading: true, ...

ajaxasp.net-mvcvue.jsjasminekarma-runner

Generate a dropdown menu with dynamic options populated from an API by adding an input type select element dynamically

Greetings! I am working on designing a decision tree that dynamically generates options based on user selections and API responses. When a user chooses a reason option, the corresponding reasons are fetched from the API and displayed in a select dropdown. ...

javascriptvue.js