header 中的 Azure AD 持有者令牌，用于验证对 Web API 的请求 - 更新方法有问题

Question

请问我们如何使用不记名令牌 UDPATE 记录。下面是我的 Service.js 和 authProvider.js 的代码。现在，它授权 API 但不更新记录。当我在开发工具中检查时，请求方法显示 'GET' 而不是 'PUT' 进行更新。而我的 GET 方法（authFetch 和 GET）工作正常（我能够通过授权从数据库中检索记录）。谁能指出我正确的方向？

service.js:

 export async function getItem(ItemNo) {
    return await authFetch(config.apiBaseUrl + `/item/${ItemNo}`, 'GET');
 }

 export async function updateItem(ItemNo, data) {
    return await authFetch(config.apiBaseUrl + `/item/${ItemNo}`, 'PUT', data);
 }

authProvider.js:

import { MsalAuthProvider, LoginType } from 'react-aad-msal';

//authFetch will return fetch method with ID Token in Authorization header.
export const authFetch = async (url, method, body) => {
const token = await authProvider.getIdToken();
return fetch(url, {
    method: body,
    headers: {
        Authorization: 'Bearer ' + token.idToken.rawIdToken,
        'Content-Type': 'application/json',
    },
    body: method === 'PUT' ? JSON.stringify(body) : undefined
});

};

组件中： FetchItem.js:

    async updateTutorial) {
    await updateItem(this.state.currentItem.itemNo,
        this.state.currentItem).then(
            (response) => {
                if (response.ok) {
                    response.json()
                        .then((responseData) => {
                            this.setState({
                                isLoading: false,
                                message: "Item updated successfully!"
                            })
                        });
                }
                else if (response.status === 401) {
                    throw new Error("User not authorized");
                }
                else {
                    throw new Error("Not working");
                }
            })
        .catch((err) => {
            console.error(err);
            this.setState({ isLoading: false, currentItem: 'Error: ' + err.message });
        });
}

Answer 1

您可以尝试将 authFetch 方法更改为：

export const authFetch = async (url, method, body) => {
    const token = await authProvider.getIdToken();
    return fetch(url, {
        method: body,
        headers: {
            Authorization: 'Bearer ' + token.idToken.rawIdToken,
            'Content-Type': 'application/json',
            //'Accept': 'application/json' // Add this line in addition
        },
        body: method === 'PUT' ? JSON.stringify(body) : undefined
    });
};

然后像下面这样称呼他们：

 export async function getItem(Serienr) {
    return await authFetch(config.apiBaseUrl + `/item/${ItemNo}`, 'GET');
 }

 export async function updateItem(ItemNo, data) {
    return await authFetch(config.apiBaseUrl + `/item/${ItemNo}`, 'PUT', data);
 }

请注意，上面的代码未经测试，因此您可能运行遇到问题。

header 中的 Azure AD 持有者令牌，用于验证对 Web API 的请求 - 更新方法有问题

Azure AD bearer Token in header to authenticate request to web API - Problem with update method

reactjs

azure

bearer-token