如何为使用OData适配器的DataManager请求添加Access-Token请求头？

有两种简便方案可以实现给DataManager的所有 outgoing请求添加指定请求头：

方案1：使用DataManager的beforeSend回调（推荐） #

直接在DataManager初始化时配置beforeSend函数，该函数会在每个请求发送前执行，你可以通过XMLHttpRequest对象添加请求头：

import { DataManager, ODataAdaptor } from '@syncfusion/ej2-data';
import { Grid } from '@syncfusion/ej2-grids';

// 初始化DataManager
const dataManager = new DataManager({
    url: '你的后端接口地址',
    adaptor: new ODataAdaptor(), // 根据实际适配类型选择，比如UrlAdaptor
    beforeSend: (request) => {
        // 添加Access-Token请求头，token可从本地存储或其他地方获取
        const token = localStorage.getItem('accessToken');
        if (token) {
            request.setRequestHeader('Access-Token', token);
        }
    }
});

// 绑定到Grid并启用分页、排序、筛选
const grid = new Grid({
    dataSource: dataManager,
    allowPaging: true,
    allowSorting: true,
    allowFiltering: true,
    columns: [
        { field: 'Id', headerText: 'ID', width: 100 },
        { field: 'Name', headerText: '名称', width: 200 }
        // 其他列配置...
    ]
});
grid.appendTo('#Grid');

方案2：自定义Adaptor（适配复杂场景） #

如果需要对请求做更多自定义处理，可以继承现有Adaptor（比如ODataAdaptor）并重写processRequest方法，在其中添加请求头：

import { ODataAdaptor, DataManager, Query } from '@syncfusion/ej2-data';
import { Grid } from '@syncfusion/ej2-grids';

// 自定义Adaptor
class CustomODataAdaptor extends ODataAdaptor {
    processRequest(url: string, requestObject: any, query?: Query): any {
        // 调用父类方法获取基础请求配置
        const processedReq = super.processRequest(url, requestObject, query);
        // 添加Access-Token请求头
        const token = localStorage.getItem('accessToken');
        processedReq.headers = {
            ...processedReq.headers,
            'Access-Token': token || ''
        };
        return processedReq;
    }
}

// 使用自定义Adaptor初始化DataManager
const dataManager = new DataManager({
    url: '你的后端接口地址',
    adaptor: new CustomODataAdaptor()
});

// 绑定Grid
const grid = new Grid({
    dataSource: dataManager,
    allowPaging: true,
    allowSorting: true,
    allowFiltering: true,
    columns: [/* 列配置 */]
});
grid.appendTo('#Grid');

两种方案都能确保分页、排序、筛选等所有由DataManager发起的请求都携带Access-Token头，满足服务器的要求。

内容的提问来源于stack exchange，提问作者Lego