搜尋

首頁  >  問答  >  主體

node.js - 做一个单页网站,用ajax时,相应的后端用node要怎么写

菜鸟遇到的问题是:pjax改变url,并作相应刷新局部页面。但是如果直接进入到这个url,就会出现问题(页面显示Ajax返回的JSON数据),求大神提供个正确思路

PHPzPHPz2875 天前635

全部回覆(3)我來回復

  • 阿神

    阿神2017-04-17 11:04:17

    我的方法是用Accept頭來判斷請求類型。
    比如對於同樣一個url, /products
    請求的時候設置accept為text/html,方法為get,則會返回一個html頁麵。
    如果accept為application/json,方法為get,則返回一個json格式的product列表。/products?limit=20則會返回列表中前20個項目。
    如果accept為application/json,方法為put,則會添加一個product。
    大概就是這樣,通過url,http method,accept來控製請求的結果,

    Request URL:/products
    Request Method:GET
    
    Request Headers
    Accept:application/json, text/plain, */*
    
    Response Headers
    date:Sun, 24 Nov 2013 07:02:46 GMT
    items-count:3
    page-count:1
    page-number:1
    page-step:20
    Server:BWS/1.0
    vary:Accept-Encoding
    x-powered-by:Express
    

    回覆
    0
  • PHP中文网

    PHP中文网2017-04-17 11:04:17

    如果後端用了express框架的話就好辦了。

    res.format({
      'text/html': function() {
        // 这里是直接用 url 访问的 render 逻辑
        // res.render('products', {...});
      },
      'application/json': function() {
        // 这里是 ajax 方式的逻辑
        // res.send({...});
      }
    });
    

    回覆
    0
  • 怪我咯

    怪我咯2017-04-17 11:04:17

    大部分的JavaScript框架在發送Ajax請求時會附帶一個標識Ajax的請求頭:

    {"HTTP_X_REQUESTED_WITH" : "XmlHttpRequest"}
    

    如果沒有,可以手動設置一個,在jQuery中是這樣:

    $.ajax {
      beforeSend: function(jqXHR, settings) {
        jqXHR.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
      }
    };
    

    這樣在服務端就可以根據請求頭作判斷了,類似於這樣:

    if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
         /* special ajax here */
         // send JSON data
     } else {
         // send html data
     }
    

    回覆
    0
  • 取消回覆