When employing unicode, the XMLHttpRequest body is truncated

Having an issue with XMLHttpRequest cutting off the body of a JSON encoded message when Emoji's are used.

var emoji = '"\u2764\uFE0F"';

var data = {
        id: messageid, time: new Date(),
        layout: { 'type': "message", title: emoji, body: emoji, largeIcon: "http://site/icons/icon.png", foregroundColor: "#445566", backgroundColor: "#222222" },
        createNotification: {
             layout: { 'type': "genericNotification", title: emoji, subtitle: emoji, largeIcon: "http://site/icons/icon.png" }
             }
   };

jsonenc = JSON.stringify(data);

console.log(jsonenc) //displays data fine.

var request = new XMLHttpRequest();
request.open('PUT', dict.url, true);
request.setRequestHeader('Content-Type', 'application/json;charset=UTF-16');
request.setRequestHeader('X-User-Token', dict.token);
request.setRequestHeader("Content-length", data.length);

request.send(dict.data);

Upon checking the JSON data in the console, it shows the full length. However, when inspecting the request using mitmproxy, it gets cut off like this:

{"id":"messageid-123456","time":"2015-05-29T03:43:17.566Z","layout":{"type":"message","title":"\"......\"","body":"\"......\"","largeIcon":"http://site/icons/icon.png","foregroundColor":"#445566","backgroundColor":"#222222"},"createNotification":{"layout":{"type":"genericNotification""title":"\"......\"","subtitle":"\"......\"","largeIcon":"http://site/icons/ic

Answer №1

request.setRequestHeader('Content-Type', 'application/json;charset=UTF-16');

The specified media type application/json does not have a charset parameter. Even if it did, using UTF-16 would be inappropriate in this context. When XMLHttpRequest sends a JS String, it encodes it as UTF-8.

request.setRequestHeader("Content-length", data.length);

This line of code has no effect because XMLHttpRequest automatically calculates the Content-Length based on the length of the data being sent. Using data.length here is incorrect since it represents the length in UTF-16 code units, while Content-Length should be measured in bytes.

When inspecting the request in mitmproxy, it appears truncated:

This issue seems to be related to the way mitmproxy's user interface handles the display of requests.

"title":"\"......\""

In UTF-8 encoding, U+2764,U+FE0F translates to bytes 0xE2,0x9D,0xA4,0xEF,0xB8,0x8F. mitmproxy displays the ASCII stream without attempting to decode it with another encoding, showing each byte with the high-bit set as a placeholder ..

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

Displaying Values/Marks in a Unique Order with Material-UI Slider Component

The default behavior of the Material-UI slider is to display marks/values in ascending order from min to max For instance, if you have a slider configured like this: const marks = [ { value: 1, label: '1' }, { value: 2, lab ...

The component inside the private route is failing to render without a manual page refresh

I am facing an issue with allowing access to users based on their assigned roles. The list of allowed URLs is retrieved in the 'urls' variable within a PrivateRoute component. However, this list does not load immediately after login. It only work ...

Prevent Chrome from automatically restoring the previous browsing session

Is there a way to prevent Chrome from restoring the session when reopening a closed page? Possibly using a special header? My company app relies heavily on user state, and I need to log employees out and delete all relevant data if they are inactive for 6 ...

Syntax for chained arrow functions

const retrieveData = link => dispatcher => { // ... } export const fetchInfo = searchTerm => (dispatcher) => { return dispatcher(retrieveData(searchTerm)); }; What role does dispatcher play in the retrieveData function? Is link the only p ...

Implementing a live search feature in Jquery, similar to the filtering capabilities found in Angular JS

How can I implement a filter option for the following HTML code that will dynamically display the input given in real time? <div class="block-parent"> <input type="text" name="search" class="search"> <div class="answer block1" style=" ...

A guide on utilizing a function import within an exported function within ReactJS

As a beginner in React, I have been exploring Named and Default Exports, but I encountered a problem that I am having trouble articulating. Below is the code that is causing confusion: namedExport.js const name = "xyz"; const age = 20; const my ...

I am looking to extract the information from the HTML code

I have the following code and I need to extract the backupURL value. Can someone help me with this? var tem="<li><a class="selectBackupFromList" backupURL="http://localhost/3/wordpress/wp-content/infinitewp/backups/localhost-3-wordpress_installCl ...

How can I split a nested json array into several individual arrays?

How can I transform a JSON structure from: { "id": "1", "object": [{ "object_1": "hi", "object_2": "hello" }, { "object_1": "hello& ...

Tips for sending a JavaScript variable to a PHP function in an Ajax URL

Can someone help me with inserting the parent value into the "getFaculties()" function when calling it using Ajax? function ajaxfunction(parent) { $.ajax({ type: 'GET', url: 'Connection.php?getFaculti ...

React JS for loop not displaying any output

I am trying to create a component that loops from 0 to the value entered as a prop. if (props.number !== "" && props.toPow !== "") { for (let i = 0; i < props.toPow; i++) { return ( <div> & ...

When using Mongoose paginate, there is always one missing document

I currently have a database with 6 documents and the following route: router.get('', async (req, res) => { const search = req.query.search !=null ? req.query.search : ""; const page = req.query.page !=null ? req.query.page : 1; const limit = ...

Display a modal before leaving the page?

I need to display a modal message when a user navigates away from the page, triggered by a successful AJAX call. The issue is that if the message loads too quickly, the user may not have enough time to read it before being directed to another page. This is ...

Crafting a clever smart banner using jquery.smartbanner for Android Firefox users

In order to display smartbanners on my mobile website, I utilize jquery.smartbanner. This implementation has been successful for ios, windows phone, and the default android browser. However, when testing on Firefox for android, the smartbanner is not visib ...

Variables from a node.js module

I am having trouble extracting a variable from a node.js module. My goal is to create a module that interacts with an authentication system, and it currently only returns a token. I require this token in the main.js file so that I can call other modules an ...

Nest JS encountering an error due to an undefined property

Recently, my application was running smoothly until I attempted to fetch the documentation using Swagger. It seems like there might be a dependency issue causing it to stop working, but I can't pinpoint the root of the problem. An error message keeps ...

Is it WinAPI LPWSTR or C++11 u16string that you're referring to?

When developing for Windows, I often come across WinAPI functions that require me to use LPWSTR as the string data type. Can I use C++11's u16string in my library instead? Are LPWSTR and u16string the same thing? It seems like LPWSTR is more related ...

Pass data to all routes in ExpressJS

After logging in, I am setting req.session variables as follows: req.session.loggedin = true req.session.firstname = loginDetails.firstName; I would like to streamline this process and pass this information to ALL routes without manually adding them to ea ...

There seems to be an issue with the functionality of the AJAX file upload feature in

I've developed a method for file uploading using AJAX technology (pure JavaScript) in CodeIgniter. Here's how it works: 1- I created a script.js file to manage the AJAX/JavaScript upload process. 2- I implemented a controller in CodeIgniter to ...

Is it possible to hide the iOS Safari navbar by simply scrolling the body?

One of the challenges I am facing with my website layout is the grid structure that consists of a fixed header, scrollable content, and a fixed footer. The issue arises when using iOS Safari because the bottom navbar and URL bar never go away even when scr ...

Increase or decrease values by clicking on Material UI IconButton

Looking to incorporate the functionality of an onClick() event for a Material UI IconButton that can either increase or decrease the Calories value for each item in the table. I've referenced the code from the Table React component page. https://i.ss ...