首頁 > web前端 > js教程 > 主體

如何解決使用 jQuery.ajax 從 Node.js 取得 JSON 時出現的「意外令牌:」錯誤?

Patricia Arquette
發布: 2024-10-19 22:53:01
原創
736 人瀏覽過

How to Resolve the

jQuery.ajax#get 中出現意外的令牌冒號JSON

問題:

使用時jQuery.ajax#get 從Node.js API 檢索JSON 資料時,Chrome 中出現「Unexpected token :」錯誤。

Context:

  • 伺服器端程式碼: Node.js Express 伺服器傳回以下格式的JSON 資料:{"Name": "Tom","Description":"Hello it's me!"}.
  • 客戶端程式碼: 在jQuery 腳本中發出AJAX get 請求以擷取JSON 資料。

調查:

檢查 Chrome 中的錯誤表明 JSON 回應包含意外的冒號 (:)。

解決方案:

啟用JSONP 支援:

出現此問題的原因是客戶端期望JSONP 回應,該期望回應是封裝在JavaScript 函數呼叫中的JSON 資料。要啟用 JSONP 支持,伺服器必須在回應中包含“Padding”(“P”)。

<code class="text">jQuery111108398571682628244_1403193212453({"Name":"Tom","Description":"Hello it's me!"})</code>
登入後複製

伺服器端程式碼修改:

至要在Node.js Express 中支援JSONP,請修改伺服器程式碼如下:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  const callback = req.query.callback;
  const data = {
    Name: "Tom",
    Description: "Hello it's me!"
  };

  if (callback) {
    res.setHeader('Content-Type', 'text/javascript');
    res.end(callback + '(' + JSON.stringify(data) + ')');
  } else {
    res.json(data);
  }
});
登入後複製

或:

使用ExpressJS 內建的res.jsonp() 方法:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.jsonp({
    Name: "Tom",
    Description: "Hello it's me!"
  });
});
登入後複製

客戶端程式碼修改:

客戶端無需修改。預設情況下,jQuery 將傳遞帶有函數名稱的回呼查詢字串參數。

以上是如何解決使用 jQuery.ajax 從 Node.js 取得 JSON 時出現的「意外令牌:」錯誤?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板