Sending emotional text data to the server

Whenever a user enters a mobile emoji like 😀 into the input field on my website, it is saved as ?? in the database.

The emojis are encoded in utf8mb4, so I have already updated the database collation to utf8mb4_general_ci.

Although the emoticons can be successfully saved now, when transferring a message containing an emoji from a client to my server, it still gets changed into ?? somewhere along the way. I am currently trying to pinpoint where and how to solve this issue.

The message is sent to the server through the following ajax call:

function updateStatus() {
    var status = $("#status").val();

    jsRoutes.controllers.Userdata.updateStatus( status ).ajax({
        success : function(data) {
              $("#profil").cftoaster({content: data});
        },
        error : function(err) {
              $("#profil").cftoaster({content: err.responseText});
        }
    });
}

On the server side, I am using the java-based Play Framework 2.4.4. Here is the beginning of the method called in the ajax request:

public static Result updateStatus(String status) {

        String receivedName = Application.getSessionUser();
        Logger.debug("RecvStatus: " + status);
        ...

}

The Logger output already shows ?? for an emoticon.

The route configuration looks like this:

PUT         /status/                          controllers.Userdata.updateStatus(status: String)

EDIT:

To ensure that the transfer from client to server is correct, I am now sending the actual Unicode values. I have modified my server-side function as follows:

Logger.debug("RecvStatus: " + status);
status = status.replace("\\","");
String[] arr = status.split("u");
status = "";
for(int i = 1; i < arr.length; i++){
    int hexVal = Integer.parseInt(arr[i], 16);
    status += (char)hexVal;
}
Logger.debug("RecvStatus: " + status);

This results in the following output:

[debug] application - RecvStatus: \ud83d\ude01
[debug] application - RecvStatus: ?

which indicates that the issue probably lies within Java.

Answer â„–1

In case you're facing a similar issue like me, here's how I tackled it.

Initially, I attempted to encode the String in Java to base64 and save it that way. Unfortunately, even after decoding the base64, the unicode details were lost and ?? appeared instead of emoticons.

So, what I did next was convert the incoming String to unicode, then to base64. When retrieving the Strings from the database, I first decode base64 and then transform the unicode data back into a readable String. This method ensured that emoticons were preserved and displayed correctly afterward.

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

Navigating beyond the final frame of an animation on an Android device

In my current project, I am working with an array of views representing seats in a cinema. My task is to apply a specific animation (scale and translate) to each view in order to create a zoom effect. The animation logic I am using is as follows: Anim ...

Intercommunicating Java and .NET web services: Limiting the SOAP output to a decimal with only 2 digits

As I attempt to make a call to a Java webservice from my .NET client, I encounter an issue with one of the fields in the request message being a decimal value. In setting this field using the proxy request object: decimal amount = 3.0; request.DecimalVal ...

Setting up a new package through JPSM installation

I utilize jspm in my web application. My goal is to install the npm:angular2 package without needing to set it up in the config.js file. Instead of loading the angular2 module via jspm, I manually added the angular2 library like this: <script src="jspm ...

Yaml scripting for BunJs CLI commands

Are there any CLI tools in bun.js that are capable of interpreting Yaml scripts? Similar to how npm processes package.json files in node.js, allowing script definition and execution from the command line interface, but with Yaml being a more readable form ...

I'm having trouble making an Ajax request to an AWS API Gateway using a custom domain name

My setup involves using an API gateway connected to a lambda function as a service. When I initially create the API gateway, I can call it using the following code snippet: var xhr = new XMLHttpRequest(); xhr.open('POST','https:/apigatewa ...

Using an array as an argument for .map() results in an error

This is quite unusual. Currently, I am passing an array containing a single object to the Render method of a React component: let content = this.state.links.map(link => { // eslint-disable-line return ( <li key={link._id}> <a href ...

Is there a way to copy this JavaScript variable and modify the displayed text?

I am working on a JavaScript code that is used to create a basic news page with a filter from a mySQL database. The code generates the heading, main content, and date created for each news item. I now need to add a "read more" link at the bottom of each ne ...

Ensure that TypeScript compiled files are set to read-only mode

There is a suggestion on GitHub to implement a feature in tsc that would mark compiled files as readonly. However, it has been deemed not feasible and will not be pursued. As someone who tends to accidentally modify compiled files instead of the source fil ...

The issue with the static Vue component is not resolving as expected. I am seeking a solution

Following the setup of the project using vue-cli 3.x, I declared this component in the main.js file. By the way, Unknown custom element: - have you properly registered the component? For recursive components, ensure to include the "name" option. I am st ...

"Transferring data from Ajax to PHP with a GET request: A step-by

I have created an AJAX script that passes the user's selected value from a combo box to PHP and also handles the submit button. AJAX: <script> function sendUserData(userType) { var value = $('#userType').val(); var page=& ...

Puppeteer encountered an error when trying to evaluate the script: ReferenceError: TABLE_ROW_SELECTOR was not defined

https://i.stack.imgur.com/PJYUf.jpg Recently, I started exploring pupeteer and node while using vscode. My goal is to log into a website and scrape a table. So far, this is what I have: (async () => { const browser = await puppeteer.launch({ headle ...

What's the opposite of JSON.stringify?

Currently, I am converting an object to a string, such as {'foo': 'bar'} What is the process for converting the string back into an object? ...

Manipulating vertices in Three.js

I am fairly new to Three.js and I am attempting to create a basic PlaneGeometry. The process would involve: The user will specify their preferred height and width for the PlaneGeometry The browser will then render the plane with the height and width ...

The jst.js error in sails JS template indicates that the variable _ cannot be found

I am brand new to the world of programming and am currently diving into JavaScript and Sails JS. I must admit, I am enjoying the learning process so far, but recently encountered a problem that has left me scratching my head. Please bear with me as I may n ...

When rendering, DirectionsRenderer replaces the Marker

I'm currently working on implementing a real-time tracking system for customers to track their deliveries. I have succeeded in setting up markers for the destination and pickup locations, as well as a route path towards them. However, I encountered an ...

Improving array performance in React: Comparing the performance of adding elements to an

As I delve into adding elements to an array for rendering components, I find myself using the useState hook and spread operator quite often. It looks something like this: setTestArray(array => [...array, data]); In regular JavaScript, adding elements i ...

What methods can I use to conceal #! from showing on the browser's address bar?

Imagine you have the below link: www.someurl.com/#!?page=index How would you convert it into one of these options: www.someurl.com/#!/index (using mod_rewrite) www.someurl.com/ajax/index (also using mod_rewrite, but replacing #! with ajax) www.someurl. ...

Can next.js rewrites be configured with environment variables?

Currently, I am in the process of developing my application with a next.js frontend and express.js backend. During development, I simply run the relevant dev servers in the terminal. However, now I am looking to deploy my app using Docker for production. I ...

Utilize AJAX to load an image gallery with fancybox3

I am currently working on an ASP.NET MVC 4 web page that features an image gallery. To optimize loading time, I want to asynchronously load the "large image" using an AJAX call instead of loading all large images upfront. Below is a snippet from my view: ...

How can I make a textarea automatically adjust its height to fit the content when the page is loaded?

Is there a way, using CSS or Javascript, to dynamically adjust the height of a textarea based on its content? Currently, I have a fixed height set in my CSS, but I would like it to automatically resize so that there is no vertical scroll bar when the pag ...