Angular 如何将承载令牌应用于Devextreme dxdata网格的odata源

使用angular，我试图使用odata源和devextreme dxdatagrid传入承载令牌，但我无法让它进行身份验证和提取数据，不断返回当前用户未登录到应用程序！，表明它没有进行身份验证

我可以使用邮递员成功地模拟呼叫。数据源定义如下：

constructor(
    injector: Injector,
    private _route: ActivatedRoute,
    private _router: Router
) {
    super(injector);
    let authString = "Bearer " + getToken();

    this.gridDataSource = {
        store: {
            type: 'odata',
            key: 'Id',
            keyType: "Int32",
            version: 4,
            url: 'http://localhost:21021/odata/Roles'
        },
        select: [
            'Id',
            'Name',
            'DisplayName'
        ],
        beforeSend: (e) => {  
            e.headers = {
                "Content-Type": "application/json",
                "Authorization": authString
            }
        }
    }
}

我假设我的beforesend头定义格式不正确，非常感谢您的帮助

尝试用btoa编码

---

我能够通过如下定义数据源使其工作：

this.gridDataSource=新数据源{ 商店：新店{ 网址：， 关键字：Id， 键类型：Int32， 版本：4， 发送前：e=>{ e、 标题={ 内容类型：application/json， 授权：“持票人”+abp.auth.getToken， }; } }

---

}

beforeSend函数必须位于store对象内部

    this.dataSource = {
      store: {
        type: 'odata',
        key: 'Id',
        url: 'https://localhost:44350/odata/Books',
        version: 4,
        withCredentials: true,
        beforeSend: (e) => {
          e.headers = {
            "Authorization": `Bearer ${jwtToken}`
          };
        }
      }

---

你能分享你的浏览器的xhr请求截图吗？xhr截图添加了一个窗口。btoa似乎没有帮助，还有其他想法吗？

    this.dataSource = {
      store: {
        type: 'odata',
        key: 'Id',
        url: 'https://localhost:44350/odata/Books',
        version: 4,
        withCredentials: true,
        beforeSend: (e) => {
          e.headers = {
            "Authorization": `Bearer ${jwtToken}`
          };
        }
      }