У меня проблема, когда он продолжает говорить Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '0')
, когда я почти уверен, что это правильно.
Мой ответ со страницы, с которой система получает текст, находится здесь:
"[{\u0027message\u0027: \u0027amazing\u0027, \u0027sent_by\u0027: \u0027Tester Wupx\u0027}, {\u0027message\u0027: \u0027wow\u0027, \u0027sent_by\u0027: \u0027Tester Wupx\u0027}, {\u0027message\u0027: \u0027name\u0027, \u0027sent_by\u0027: \u0027guest\u0027}]"
Вот мой код:
async function getNewMessages() {
await fetch(`/get_new_messages/s/${sId}`).then(async function(response) {
const body = await response.text();
arr = body.replace('[', "{'auto': [").replace(']', ']}')
console.info(arr)
json = await JSON.parse(arr);
document.querySelector('.channel-messages ul').innerHTML = null;
for (const i in Object.keys(json)) {
const obj = json["auto"][i];
document.querySelector('.channel-messages ul').insertAdjacentHTML('beforeend', `<li style = "padding-left: 10px; color: white; width: 100%;" onmouseover = "const collection = this.children; this.style.background = '#535357'; this.style.color = 'white';" onmouseout = "const collection = this.children; this.style.background = 'transparent'; this.style.color = 'white';"><b><img src = "/assets/images/Goobler-meowsicles.png" width=40/> <onclickFunc onclick = "">${obj["sent_by"]}</onclickFunc> <span class = "badge" style = "background: mediumpurple;">TESTER <i class = "fa fa-check"></i></span> </b> <br>${obj["message"]}</li>`);
console.info(obj)
}
/*document.querySelector('.channel-messages ul').insertAdjacentHTML('beforeend', `<li style = "padding-left: 10px; color: white; width: 100%;" onmouseover = "const collection = this.children; this.style.background = '#535357'; this.style.color = 'white';" onmouseout = "const collection = this.children; this.style.background = 'transparent'; this.style.color = 'white';"><b><img src = "/assets/images/Goobler-meowsicles.png" width=40/> <onclickFunc onclick = "">${json.message}</onclickFunc> <span class = "badge" style = "background: mediumpurple;">TESTER <i class = "fa fa-check"></i></span> </b> <br>${json["messages"]['message']}</li>`);*/
})
//location.reload()
} /*edited code*/
Я ценю ответы!
Пожалуйста, отредактируйте свой код, чтобы использовать временные переменные, такие как const auto = json['auto'];
и const message = auto[i]["message"]
. Зарегистрируйте каждую промежуточную переменную и сообщите нам, каковы результаты журналов (на самом деле вы, вероятно, поймете это, если просто разбьете их на переменные и зарегистрируете каждую часть).
@anonsaicoder9 да, это не сработало
замените \u0027
на \u0022
, то есть одинарные кавычки с двойными кавычками, поскольку одинарная кавычка не является допустимым JSON.
Обновлено
const body = await response.text();
const jsonText = body.replaceAll('\u0027', '\u0022');
const item = await JSON.parse(jsonText);
for (const obj of item.messages) {
document.querySelector('.channel-messages ul').insertAdjacentHTML('beforeend', `<li style = "padding-left: 10px; color: white; width: 100%;" onmouseover = "const collection = this.children; this.style.background = '#535357'; this.style.color = 'white';" onmouseout = "const collection = this.children; this.style.background = 'transparent'; this.style.color = 'white';"><b><img src = "/assets/images/Goobler-meowsicles.png" width=40/> <onclickFunc onclick = "">${obj.sent_by}</onclickFunc> <span class = "badge" style = "background: mediumpurple;">TESTER <i class = "fa fa-check"></i></span> </b> <br>${obj.message}</li>`);
}
Ваш ответ печатает каждый символ файла JSON, но мне нужен каждый объект, попробуйте еще раз проверить свой ответ на наличие опечаток или ошибок в коде. Он также возвращает неопределенное значение при получении объекта sent_by
.
Я не понял тебя. Однако, если вам нужен каждый объект, вы можете использовать obj
, а также получить доступ к другим полям, таким как obj.message
. Если в объекте отсутствует send_by, он вернет значение undefined. вы можете отфильтровать его по if (obj.sent_by)
. Идея в том, что вы можете заменить for
тело своей собственной логикой.
Когда я регистрируюсь sent_by
, как вы в ответе, по какой-то причине возвращает undefined, просмотрите мой код на pastebin pastebin.com/jJKWdqpi на предмет всего, что мне не хватает
Код выглядит нормально. Можете ли вы поделиться результатом console.info("Raw array: "+body);
?
Необработанный массив: "{\u0027messages\u0027: [{\u0027message\u0027: \u0027amazing\u0027, \u0027sent_by\u0027: \u0027Tester Wupx\u0027}, {\u0027message\u0027: \u0027wow\u0027, \u0027s: \u0027Tester Wupx\u0027}, {\u0027message\u0027: \u0027name\u0027, \u0027sent_by\u0027: \u0027guest\u0027}]}"
Я могу поделиться видео того, что происходит, когда я захожу getNewMessages()
, если хотите
Обновил ответ на основе ответа. Теперь это должно работать нормально
это дает мне ошибку Uncaught (in promise) TypeError: arr.messages is not iterable
Пожалуйста, поделитесь видео. Кажется, что ответ http периодически меняется. Также. проверьте на своем конце, что ответ HTTP не меняется каждый раз.
Выход кажется хорошим. Можете поделиться кодом getNewMessages()
?
это код, который я отправил в вопросе pastebin.com/jJKWdqpi
попробуйте это pastebin.com/1J8VHaGR. Также обратите внимание на уже обновленный код выше
Если ваш body
равен этому:
"[{\u0027message\u0027: \u0027amazing\u0027, \u0027sent_by\u0027: \u0027Tester Wupx\u0027}, {\u0027message\u0027: \u0027wow\u0027, \u0027sent_by\u0027: \u0027Tester Wupx\u0027}, {\u0027message\u0027: \u0027name\u0027, \u0027sent_by\u0027: \u0027guest\u0027}]"
Тогда попробуйте таким образом:
const body = await response.text();
// arr = body.replace('[', "{'auto': [").replace(']', ']}') <= remove this line
json = await JSON.parse(body);
console.info(json)
Исправил сам, объясню что сделал.
Вместо этого я изменил await response.text()
на await response.json()
.
Я отредактировал цикл for
Вот мой код сейчас:
async function getNewMessages() {
await fetch(`/get_new_messages/s/${sId}`).then(async function(response) {
const body = await response.json();
const jsonText = body.replaceAll('\u0027', '\u0022');
const item = await JSON.parse(jsonText)/*.replaceAll(`'`, `"`);*/
console.info("Edited array: "+jsonText);
console.info("Raw array: "+body);
console.info("Parsed array"+item)
document.querySelector('.channel-messages ul').innerHTML = null;
for (const obj of Object.entries(item.messages)) {
const message = obj[1].message
const sent_by = obj[1].sent_by
document.querySelector('.channel-messages ul').insertAdjacentHTML('beforeend', `<li style = "padding-left: 10px; color: white; width: 100%;" onmouseover = "const collection = this.children; this.style.background = '#535357'; this.style.color = 'white';" onmouseout = "const collection = this.children; this.style.background = 'transparent'; this.style.color = 'white';"><b><img src = "/assets/images/Goobler-meowsicles.png" width=40/> <onclickFunc onclick = "">${sent_by}</onclickFunc> <span class = "badge" style = "background: mediumpurple;">TESTER <i class = "fa fa-check"></i></span> </b> <br>${message}</li>`);
console.info(obj[1])
}
/*document.querySelector('.channel-messages ul').insertAdjacentHTML('beforeend', `<li style = "padding-left: 10px; color: white; width: 100%;" onmouseover = "const collection = this.children; this.style.background = '#535357'; this.style.color = 'white';" onmouseout = "const collection = this.children; this.style.background = 'transparent'; this.style.color = 'white';"><b><img src = "/assets/images/Goobler-meowsicles.png" width=40/> <onclickFunc onclick = "">${json.message}</onclickFunc> <span class = "badge" style = "background: mediumpurple;">TESTER <i class = "fa fa-check"></i></span> </b> <br>${json["messages"]['message']}</li>`);*/
})
//location.reload()
}
Пробовали
JSON.parse(JSON.parse(arr)[0]);
?