TypeError:无法将对象转换为原始值 [英] TypeError: Cannot convert object to primitive value

问题描述

我有一个文本编辑器(div)，并且有一个功能可以格式化其中的(选定)文本.当我标记文本的一部分并选择使其看起来像this(代码片段)时，我必须使用 以避免某些错误并使它变得用户友好.但是，此数据正被发送到服务器(nodeJS)，并且会导致一个错误，即内容拆分成一个对象，为避免此问题，我想在将 替换为空格后再发送给服务器.

我所做的是以下

I have a texteditor (div) and there's a function to format the (selected)text inside it. When I mark a part of the text and chose to make it look like this (code snippet) I have to use   to avoid some bugs and make it user-friendly. However this data is being sent to the server (nodeJS) and it causes a bug where the content splits up into an object and to avoid this issue, I wanted to replace   with a space before sending it to the server.

What I did was the following

// replace   by " "
let content = $('.editor').html().replace(/( )/gi, " ");

// replace editor html
$('.editor').html(content);

// print results
console.log("html: ",$('.editor').html());

在控制台中，它显示期望的内容(文本:as <code>dasdasd</code>):

in console it displays what is expected (text : as <code>dasdasd</code>):

html:  as<span> </span><code>dasdasd</code><span> </span>

但是在服务器端，我遇到以下错误:

however on the serverside i got the following error:

TypeError: Cannot convert object to primitive value

然后我决定打印包含来自编辑器内容的变量(看起来还可以吗?):

then i decided to print the variable which contains the content from editor (which seems fine?):

{ posterContent: 'as<span> </span><code>dasdasd</code><span> </span>' }

问题:如何避免用空格替换 而不需要将html转换为(字符串)以避免这种错误?

Question: how can I replace   with a space without having to convert html to (string) in order to avoid this error?

推荐答案

我知道您已经解决了该问题，但是您可能会对阅读此书感兴趣，因为您的问题是由于Web开发的基本概念(数据编码)引起了误解.

I know you solved the problem, but you might be interested in reading this, because your problem arised from a misunderstood basic concept of web dev which is data encoding.

据我了解，您不能将字符串 传递到后端，因为它被解析为对象，因此我假设您使用GET或POST的

As far as I understand, you can't pass the string   to your back-end because it's parsed as an object, so I assume you either used GET or POST's application/x-www-form-urlencoded encoding to send request. In simpler terms:

// this object
{
  a: 10,
  b: 20
}

// get passed to the server as this string
a=10&b=20

哪个很好.那是做事的一种方式.但是您必须处理用于发送特殊字符的正确编码，例如:

Which is fine. That's one way to do. But you have to deal with proper encoding for sending special characters, example:

// you have this object:
{
  a: 10,
  b: 'hello&world'
}

// you encode it naively to this
a=10&b=hello world

// the server understands this
{
  a: 10,
  b: 'hello',
  nbsp: ';world'
}

&会创建错误，因为它是一个特殊字符，不会被视为字符串的一部分. 即使您发现不使用&nbsp或将其替换为空格的技巧，也将认为您已经解决了问题，但是... 几乎所有的unicode字符都是特殊字符，需要进行编码以免产生错误.

The & creates the bug, because it's a special character and won't be treater as part of a string. Even if you find a trick to not use &nbsp, or to replace it by a space, you'll think you have solved the problem, but... almost all unicode characters are special characters and need to be encoded so as to not create bugs.

使用 encodeURIComponent ，或使用其他编码(例如JSON)发布数据.我个人会使用 fetch 它将为您完成所有工作，并为您省去与编码有关的所有问题:

Encode your strings using encodeURIComponent, or POST your data with a different encoding (for example, JSON). I'd personally use a function like fetch which does all the job for you and spare you with all the encoding-related issues:

let data = {
  userId: 1,
  id: 1
}

fetch('https://jsonplaceholder.typicode.com/posts',{
  method: 'POST',
  data: JSON.stringify(data)
})
.then(resp => resp.json())
.then(json => console.log(json));

这篇关于TypeError:无法将对象转换为原始值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！