TypeError(“超级表达式必须为null或函数”)?反应,API调用

时间:2020-05-05 09:36:12

标签: javascript reactjs redux

我正在用Keycloak JS客户端创建一个React应用程序。我的Keycloak应用程序已很好地启动并在docker容器上运行。连接后,我需要执行一些操作。

文件:ContextAction.js

DEPS = SimpleKernel.cc

build: $(DEPS)
    @/home/johannes/workspace/emsdk/upstream/emscripten/emcc --bind -g4 \
        --source-map-base https://myhost/web-audio-samples/audio-worklet/design-pattern/wasm \
        -s WASM=1 \
        -s BINARYEN_ASYNC_COMPILATION=0 \
        -s SINGLE_FILE=1 \
        SimpleKernel.cc \
        -o simple-kernel.wasmmodule.js \
        --post-js ../lib/em-es6-module.js

clean:
    @rm -f simple-kernel.wasmmodule.js

文件:api-services / ff-api / Context

Uncaught TypeError: Cannot assign to read only property '__wasm_call_ctors' of object '[object Object]'
    at simple-kernel.wasmmodule.js:3794
(anonymous) @ simple-kernel.wasmmodule.js:3794
(index):34 Uncaught (in promise) DOMException: Failed to construct 'AudioWorkletNode': AudioWorkletNode cannot be created: The node name 'wasm-worklet-processor' is not defined in AudioWorkletGlobalScope.
    at demoCode (https://myhost/web-audio-samples/audio-worklet/design-pattern/wasm/:34:26)
demoCode @ (index):34
async function (async)
demoCode @ (index):32
DemoRunner.eButton.onclick @ Components.js:263
DevTools failed to load SourceMap: Could not load content for https://myhost/web-audio-samples/audio-worklet/design-pattern/wasm{{{ FILENAME_REPLACEMENT_STRINGS_WASM_BINARY_FILE }}}.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

在BaseService上,我想检查Keycloak提供的令牌是否仍然有效,否则我想更新它,然后进行API调用

文件:BaseService.js

import Dispatch from '../framework/redux/Dispatch';

import ContextService from '../api-services/ff-api/Context';
export const setContext = (userId) => dispatch => {
    Dispatch.loading(dispatch, 'SET_CURRENT_USER');

    ContextService.getUser(userId)
        .then(user_response => {
            // Dispatch.done(dispatch, SET_CURRENT_USER_REQUEST, user_response);
            dispatch({
                type: SET_CURRENT_USER_SUCCESS,
                current_user: user_response.data
            });
        })
}

在服务连接器上,我设置了axios并触发了呼叫

如果我想调用其他动作(例如getNotifications),一切都很好 我使用相同的工作流程创建了另一个文件NotificationAction,但出现此错误

import BaseService from '../BaseService';

class Context extends BaseService {
    constructor() {
        super();
        this.getUser = (userId) => {
            return this.serviceConnector().then((service) => { return service.callApi({ url: `users/${userId}` })});
        }
    }
}

const context = new Context();

export default context;
import ServiceConnector from './ServiceConnector'
import * as properties from '../app-config/properties'
import ApplicationStore from '../framework/redux/ApplicationStore'
import * as AuthorizationActions from '../actions/authorization_actions';

export default class BaseService {
    constructor() {
        this.serviceConnector = () => {
            const state = ApplicationStore.getState();
            const { keycloak } = state.authContext;

            // for every appi call we want to check the keycloak token 
            // if the token is expired (or nearly) we want to update it
            const getKeycloakPromise = () => new Promise((resolve, reject) => {
                if (keycloak.isTokenExpired() || keycloak.isTokenExpired(AuthorizationActions.TOKEN_REFRESH_RATE)) {
                    keycloak
                    .updateToken(AuthorizationActions.TOKEN_REFRESH_RATE)
                    .success(refreshed => {
                        if (refreshed) {
                            ApplicationStore.dispatch(AuthorizationActions.updateToken(keycloak.token));
                        } // else token still valid
                        resolve(keycloak.token)
                    })
                    .error(() => {
                        // eslint-disable-next-line no-console
                        console.error('Failed to retrieve an updated token or session has expired.');
                        ApplicationStore.dispatch(AuthorizationActions.logout({ now: true }));
                    });
                } else {
                    resolve(keycloak.token)
                }
            });
            const processKeycloakAsycn = async () => {
                return await getKeycloakPromise()
            };

            return processKeycloakAsycn().then((token) => {
                return (new ServiceConnector(properties.API_URL || '', token));
            }).catch((error) => {
                console.log('Error from processDataAsycn() with async( When promise gets rejected ): ' + error);
            });
        };
    }
}

搜索后,我发现此错误可能与对导入和继承的误解有关,但我看不到任何错误。

我不明白为什么……您能帮我吗?

0 个答案:

没有答案