chore: 修改渲染器传送拦截器的方式,将采用合并的形式合并 axios 拦截器
This commit is contained in:
parent
828fe45a43
commit
4c59bfeb61
@ -1,18 +1,20 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import type { AxiosInterceptorManager, AxiosResponse } from 'axios';
|
||||||
|
|
||||||
import { getCurrentInstance, onMounted, ref, watch } from 'vue';
|
import { getCurrentInstance, onMounted, ref, watch } from 'vue';
|
||||||
|
|
||||||
import { useQuery } from '@tanstack/vue-query';
|
import { useQuery } from '@tanstack/vue-query';
|
||||||
import { jsonp, request } from '@vtj/utils';
|
import { jsonp, request } from '@vtj/utils';
|
||||||
import { createProvider } from '@vtj/web';
|
import { createProvider } from '@vtj/web';
|
||||||
import { ElLoading, ElMessage } from 'element-plus';
|
import { ElLoading, ElMessage } from 'element-plus';
|
||||||
|
import { isFn } from 'licia-es';
|
||||||
|
|
||||||
import { LowCodeService } from './service';
|
import { LowCodeService } from './service';
|
||||||
|
|
||||||
// 定义 wujie props 的类型
|
|
||||||
interface WujieProps {
|
interface WujieProps {
|
||||||
interceptors?: {
|
interceptors?: {
|
||||||
request?: (config: any) => any;
|
request: AxiosInterceptorManager<InternalAxiosRequestConfig>;
|
||||||
response?: (response: any) => any;
|
response: AxiosInterceptorManager<AxiosResponse>;
|
||||||
};
|
};
|
||||||
// 必填参数
|
// 必填参数
|
||||||
fileId: string;
|
fileId: string;
|
||||||
@ -23,6 +25,17 @@ interface WujieProps {
|
|||||||
[key: string]: any;
|
[key: string]: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
interface Window {
|
||||||
|
$wujie?: {
|
||||||
|
bus: {
|
||||||
|
$emit: (event: string, data?: any) => void;
|
||||||
|
};
|
||||||
|
props: WujieProps;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 定义必要的初始化参数
|
// 定义必要的初始化参数
|
||||||
interface InitParams {
|
interface InitParams {
|
||||||
// 必填参数
|
// 必填参数
|
||||||
@ -40,7 +53,7 @@ const isLoading = ref(false);
|
|||||||
const provider = ref(null);
|
const provider = ref(null);
|
||||||
const loadingInstance = ref(null);
|
const loadingInstance = ref(null);
|
||||||
const errorMessage = ref('');
|
const errorMessage = ref('');
|
||||||
const initParams = ref<InitParams | null>(null);
|
const initParams = ref<InitParams | null | WujieProps>(null);
|
||||||
|
|
||||||
// 判断是否为wujie子应用
|
// 判断是否为wujie子应用
|
||||||
const isWujieSubApp = window.$wujie !== undefined;
|
const isWujieSubApp = window.$wujie !== undefined;
|
||||||
@ -57,13 +70,11 @@ const getParamsFromUrl = (): Partial<InitParams> => {
|
|||||||
|
|
||||||
// 按优先级获取初始化参数
|
// 按优先级获取初始化参数
|
||||||
const getInitParams = (): InitParams | null => {
|
const getInitParams = (): InitParams | null => {
|
||||||
// 1. 优先从wujie props获取
|
|
||||||
if (isWujieSubApp && window.$wujie?.props) {
|
if (isWujieSubApp && window.$wujie?.props) {
|
||||||
const props = window.$wujie.props;
|
const props: WujieProps = window.$wujie.props;
|
||||||
// 确保必填参数存在
|
|
||||||
if (props.fileId && props.projectId) {
|
if (props.fileId && props.projectId) {
|
||||||
console.log('使用wujie props初始化渲染器');
|
console.log('使用无界初始化渲染器');
|
||||||
return props as InitParams;
|
return props as WujieProps;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -87,15 +98,32 @@ const isValidParams = (params: InitParams | null): params is InitParams => {
|
|||||||
|
|
||||||
// 初始化请求配置
|
// 初始化请求配置
|
||||||
const initRequestConfig = () => {
|
const initRequestConfig = () => {
|
||||||
// 处理请求拦截器
|
if (!isWujieSubApp) return console.log('不是无界渲染模式,不进行拦截器合并');
|
||||||
if (initParams.value?.interceptors?.request) {
|
const props = window.$wujie.props;
|
||||||
request.useRequest(initParams.value.interceptors.request);
|
const mergeRequestInterceptors = () => {
|
||||||
}
|
const requestHandlers = props.interceptors?.request?.handlers || [];
|
||||||
|
requestHandlers.forEach((handler) => {
|
||||||
|
if (isFn(handler?.fulfilled)) {
|
||||||
|
request.useRequest(
|
||||||
|
handler.fulfilled,
|
||||||
|
handler.rejected,
|
||||||
|
handler.options,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
// 处理响应拦截器
|
const mergeResponseInterceptors = () => {
|
||||||
if (initParams.value?.interceptors?.response) {
|
const responseHandlers = props.interceptors?.response?.handlers || [];
|
||||||
request.useResponse(initParams.value.interceptors.response);
|
responseHandlers.forEach((handler) => {
|
||||||
}
|
if (isFn(handler?.fulfilled)) {
|
||||||
|
request.useResponse(handler.fulfilled, handler.rejected);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
mergeRequestInterceptors();
|
||||||
|
mergeResponseInterceptors();
|
||||||
};
|
};
|
||||||
|
|
||||||
// 显示加载中
|
// 显示加载中
|
||||||
|
@ -23,12 +23,11 @@ Sentry.init({
|
|||||||
// 异常端信息追踪
|
// 异常端信息追踪
|
||||||
Sentry.browserTracingIntegration(),
|
Sentry.browserTracingIntegration(),
|
||||||
// 异常反馈
|
// 异常反馈
|
||||||
Sentry.feedbackIntegration({
|
// Sentry.feedbackIntegration({
|
||||||
// Additional SDK configuration goes in here, for example:
|
// colorScheme: 'system',
|
||||||
colorScheme: 'system',
|
// isNameRequired: true,
|
||||||
isNameRequired: true,
|
// isEmailRequired: true,
|
||||||
isEmailRequired: true,
|
// }),
|
||||||
}),
|
|
||||||
],
|
],
|
||||||
// Session Replay
|
// Session Replay
|
||||||
replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
|
replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sy/wujie-vue2-renderer-adapter",
|
"name": "@sy/wujie-vue2-renderer-adapter",
|
||||||
"version": "1.0.0-alpha.3",
|
"version": "1.0.0-alpha.4",
|
||||||
"description": "wujie-vue2 ycode renderer adapter",
|
"description": "wujie-vue2 ycode renderer adapter",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@ -113,5 +113,6 @@ export default defineComponent({
|
|||||||
:props="subAppProps"
|
:props="subAppProps"
|
||||||
:before-load="beforeLoad"
|
:before-load="beforeLoad"
|
||||||
:after-mount="afterMount"
|
:after-mount="afterMount"
|
||||||
|
:interceptors="interceptors"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sy/wujie-vue3-renderer-adapter",
|
"name": "@sy/wujie-vue3-renderer-adapter",
|
||||||
"version": "1.0.0-alpha.4",
|
"version": "1.0.0-alpha.5",
|
||||||
"description": "wujie-vue3 ycode renderer adapter",
|
"description": "wujie-vue3 ycode renderer adapter",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import type { AxiosResponse, InternalAxiosRequestConfig } from 'axios';
|
import type { AxiosInterceptorManager } from 'axios';
|
||||||
|
|
||||||
import type { Router, RouteRecordRaw } from 'vue-router';
|
import type { Router, RouteRecordRaw } from 'vue-router';
|
||||||
|
|
||||||
@ -10,29 +10,16 @@ import WujieVue from 'wujie-vue3';
|
|||||||
// @ts-ignore ignore the type error
|
// @ts-ignore ignore the type error
|
||||||
import { version } from '/package.json';
|
import { version } from '/package.json';
|
||||||
|
|
||||||
// 定义拦截器类型
|
|
||||||
interface AxiosInterceptors {
|
|
||||||
request?: {
|
|
||||||
onFulfilled?: (
|
|
||||||
config: InternalAxiosRequestConfig,
|
|
||||||
) => InternalAxiosRequestConfig | Promise<InternalAxiosRequestConfig>;
|
|
||||||
onRejected?: (error: any) => any;
|
|
||||||
};
|
|
||||||
response?: {
|
|
||||||
onFulfilled?: (
|
|
||||||
response: AxiosResponse,
|
|
||||||
) => AxiosResponse | Promise<AxiosResponse>;
|
|
||||||
onRejected?: (error: any) => any;
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
const props = withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
[key: string]: any;
|
[key: string]: any;
|
||||||
applicationId: number;
|
applicationId: number;
|
||||||
degrade?: boolean;
|
degrade?: boolean;
|
||||||
fileId: number | string;
|
fileId: number | string;
|
||||||
interceptors?: AxiosInterceptors;
|
interceptors?: {
|
||||||
|
request?: AxiosInterceptorManager<any>;
|
||||||
|
response?: AxiosInterceptorManager<any>;
|
||||||
|
};
|
||||||
name?: string;
|
name?: string;
|
||||||
// 传递给子应用的参数 payload
|
// 传递给子应用的参数 payload
|
||||||
payload?: Record<string, any>;
|
payload?: Record<string, any>;
|
||||||
@ -132,5 +119,6 @@ onBeforeUnmount(() => {
|
|||||||
:props="subAppProps"
|
:props="subAppProps"
|
||||||
:before-load="beforeLoad"
|
:before-load="beforeLoad"
|
||||||
:after-mount="afterMount"
|
:after-mount="afterMount"
|
||||||
|
:interceptors="interceptors"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user