对于我的提取请求，我不断收到错误“字符串与预期模式不匹配”

Question

对于我的提取请求，我不断收到错误“字符串与预期模式不匹配”​​。我在这里和其他论坛上看到有些人有类似的问题，但无法确定问题所在。如果有人有任何建议，请告诉我。

function showRecipes(){
            const ingredients = document.getElementById('ingredients').value.replace(/\s/g, "");
            const meal = document.getElementById('meal').value;
            const display = document.getElementById('display'); //Where results will go

            let url = 'http://www.recipepuppy.com/api/';
            url += `?i=${ingredients}&q=${meal}`;

            fetch(url, { mode: "no-cors"})
                .then(response => {
                    response.json()
                        .then(data => {
                            data.results.forEach(recipe => {
                                const container = document.createElement('div');
                                container.setAttribute('class', 'container');

                                const h1 = document.createElement('h1');
                                h1.textContent = recipe.title;

                                const p = document.createElement('p');
                                p.textContent = recipe.ingredients;

                                display.appendChild(container);
                                container.appendChild(h1);
                                container.appendChild(p);
                            })
                        })
                        .catch(err => {
                            console.log(err);
                        })
                })
                .catch(err => {
                    console.log('ERROR: ' + err);
                })
        }

Answer 1

如果服务器的响应是文本，您可能会收到此错误，但您尝试使用res.json().

fetch(serverUrl, {method: 'GET'})
.then((res) => res.json())

res.text() 如果服务器返回文本是合适的。

在这种情况下，Safari 曾经给我 OP 的错误，但 Chrome 更具体：“位置 0 处的 json 中的意外标记 W” ——res.json()期望字符串的第一个字符是{或者[因为这是 JSON 开始的方式。

或者，正如 Safari 所说，“字符串与预期的模式不匹配。”

Answer 2

对于那些收到此消息，并且可能还调试其代码并发现包含与开发人员工具中给出的信息不匹配的信息的 HTTP 响应对象的人来说，这是由no-cors. 去掉no-cors，就不会出现这个问题了。