AJAX header with Hebrew letters

Whenever I use AJAX to send a file to a server, the code looks like this:

$.ajax({
            type: 'POST',
            async: true,
            crossDomain: true,
            url: 'http://' + address + '/api/file/upload',
            data: formData,
            processData: false,
            contentType: false, 
            headers: {
                "apiKey": "myKey",
                "FileName": "קובץ.txt"
            },
            success: function (data, textStatus, jqXHR) {}});

while everything works perfectly, if I include a Hebrew file name in the header, it triggers an error:

Error Scan fileTypeError: Failed to execute 'setRequestHeader' on 'XMLHttpRequest': Value is not a valid ByteString

The header with "FileName": "קובץ.txt" fails to work.

Answer №1

One way to convert text to utf8 is by using the following method:

unescape(encodeURIComponent(yourText)) //encode

decodeURIComponent(escape(yourText)) //decode

Answer №2

As stated on this source, it appears that headers in this scenario are limited to ASCII characters. In the event that you need to transmit a UTF-16 value to the endpoint, consider including it within the POST body.

If there is a requirement to include the value as a header, one alternative is to encode the file name in Base 64 and then decode it on the server side. For a demonstration of base-64 encoding בוקר, refer to this example.

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

Conflict between Angular's ng-repeat directive and Sass styling

Currently, I am working on a project and encountering an issue that is causing some difficulty: In order to create a navigation bar with equally distributed list elements based on the number of items, I am utilizing ng-repeat for data binding and Sass for ...

Algorithm for File Naming

Given an array of desired file names in the order of their creation, where two files cannot have the same name. If a file has a duplicate name, it will be appended with (k), where k is the smallest positive integer that creates a unique name. Output an ar ...

Dynamic anime-js hover animation flickering at high speeds

I have implemented the anime-js animation library to create an effect where a div grows when hovered over and shrinks when moving the mouse away. You can find the documentation for this library here: The animation works perfectly if you move slowly, allow ...

What are the steps to position the cursor at the end of a WYMeditor box and place focus on it?

On my forum, I am using WYMEditor which allows users to "quote" messages from others. However, when a quote is inserted into the input box, it often takes up more space than the box itself causing messy messages. I want to automatically scroll the content ...

Unable to retrieve blobs from a directory using the Node.js SDK

I'm experiencing an issue while trying to download blobs from a blob container in Azure. I am able to successfully download files when they are located in the root container, but I encounter errors when trying to download files from inside a folder. ...

Tips for implementing and utilizing onclick functions in EJS

My goal is to develop a trivia game with interactive features. I aim to enable users to click on an answer, which will trigger a border effect and increase the points variable. Below is the layout of the entire page: <% include ../partials/boilerp ...

What is the best way to list the choices associated with a specific category?

The Node.js package I'm currently working with requires an argument of a specific type, which I can see is defined through a TypeScript declaration as follows: export declare type ArgType = 'A' | 'B' | 'C'; I am interes ...

In JavaScript programming, the function is always executed after the bottom code

I am currently working on a piece of code that is partially functional. The purpose of this code is to verify the existence of an email address in a database. If the email does not exist, it should return true; $(document).ready(function() { var ema ...

Setting default values for JSON objects by analyzing the data of other objects within the array

I've been grappling with this issue for about 6 days now, so please bear with me if my explanation is a bit convoluted. I'm using NVD3 to showcase graphs based on data retrieved from BigQuery. While the data and graph setup are correct, the probl ...

NextJS does not automatically define environment variables

My current challenge involves working with the next-auth library, which relies on using environment variables in a specific way: Providers.GitHub({ clientId: process.env.GITHUB_ID, clientSecret: process.env.GITHUB_SECRET, }), Despite following ...

Converting a JavaScript timestamp into a human-readable date and time using as.POSIXct in R

Is there a way to convert a timestamp from this format into a readable human date? I have generated the timestamp using JavaScript: Date.now(); An example of the output is: 1468833354929 After storing it in a database, when I attempt to convert it usi ...

Employing JQuery to attach "focus" and "blur" functions to the "window" element does not function properly in IE

How can I implement JQuery functionality like the example below: let focusFlag = 1; jQuery(window).bind("focus", function(event) { focusFlag = 1; }); jQuery(window).bind("blur", function(event) { focusFlag = 0; }); Can anyone explain why this code doesn ...

Picture Map Showing Icons Arranged in Active Spots

My project allows users to visualize an ImageMap with designated hotspots indicating printer locations in the office. Upon hovering over these hotspots, I plan to add a tooltip containing the printer name and offer the option to remotely install printer dr ...

Trouble with the display none function

I am trying to achieve the following: If my shopping cart is empty, I want another div to display over the top of it. Instead of seeing the cart, users should see a message saying 'your cart is empty'. Currently, I have set the other div to dis ...

What is the best way to capture and store the chosen text in a Kendo multiselect variable?

I recently transformed the kendo dropdownlist into a kendo multiselect. The dropdownlist now has 2 items: D-UDMS-TMA Data Mgmt System U-TDMS-SMA Mgmt System $("#btnSendFlow").click(function () { debugger; var FlowData_array = ...

Difference between ng-controller variable and ng-init variable

When working with the code snippet below in angularJS, <script type="text/javascript"> angular.module('app').controller('add', ['$scope',function($scope) { $scope.name = "Bonita Ln"; }]); </script& ...

Send data to the view via the pivot in Laravel framework

I'm feeling a bit lost with my recipe project... Currently, I am working on a recipe project and trying to learn the ropes. However, I am struggling to display the data from a pivot table in the view. Here's how it works: The user creates a rec ...

When implementing helmetJS into my project, I noticed that Font Awesome was displaying white squares

Initially, I created an application that utilized this code in the HTML and incorporated classes with Font Awesome icons, which functioned effectively. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css&q ...

Utilizing Localstorage to populate a table with content using JQuery

Dealing with a major issue here. My HTML contains a table, and in my JavaScript code I am utilizing local storage (something new for me). When I add a new row to the table, it gets stored in local storage as a JSON object. To assign an ID to the row, I cur ...

Is there a glitch in jQuery that causes other items in the UI to disappear when deleting a single item from local storage, even though they

After clicking delete on a record, it is successfully deleted from Localstorage. However, upon page reload, none of the "drop downs" show the other records in Localstorage even though they still exist. How can I address this issue? Seeking guidance on res ...