Are you sure you want to delete the question?

If your question is resolved, you may close it.

Leaving a resolved question undeleted may help others!

We hope you find it useful!

Cloud Functions から httpsCallableを使用してデータを受け取る際、TypeScriptが上手くコンパイラできない。

解決したいこと

Cloud Functions から httpsCallableを使用してデータを受け取る際、TypeScriptが上手くコンパイラできない。

発生している問題・エラー

Argument of type '({ data, }: HttpsCallableResult<{    displayName: string;}>) => Promise<void>' is not assignable to parameter of type '(value: HttpsCallableResult<unknown>) => void | PromiseLike<void>'.
  Types of parameters '__0' and 'value' are incompatible.
    Type 'HttpsCallableResult<unknown>' is not assignable to type 'HttpsCallableResult<{ displayName: string; }>'.
      Type 'unknown' is not assignable to type '{ displayName: string; }'.

やっていること

ユーザーが新規作成する際プロフィールを作成する(createProfile)
プロフィールが作成されたら、Firebase側のユーザー情報のdisplayNameを変更 → 何も返さない
プロフィールが失敗したら、エラー分をreturnして返す → エラー文を返す

プロジェクトは、JavaScriptで稼働済みでTypeScriptを随時変更していく過程でぶつかりました。とりあえず、動作するか確認するためinterfaceやtypeは宣言せず、直書きしちゃってます。

該当するソースコード

userSlice.ts
export const createProfile = createAsyncThunk(
  "user/createProfile",
  async (org: {
    type: string;
    name: string;
    person: string;
    position: string | null;
    postal: string;
    address: string;
    tel: string;
    agree: boolean;
    provider: string;
    fetch: boolean;
  }): Promise<string | void> => {
    const createProfile: HttpsCallable = httpsCallable(
      functions,
      "sh-createProfile"
    );

    const error = await createProfile(org)
      .then(
        async ({
          data,
        }: HttpsCallableResult<{ displayName: string }>): Promise<void> => {
          if (auth.currentUser) {
            await updateProfile(auth.currentUser, {
              displayName: data.displayName,
            });
          }
        }
      )
      .catch((e: Error): string => e.message);

    if (error) {
      return error;
    }
  }
);
@firebase/functions.d.ts
/**
 * A reference to a "callable" HTTP trigger in Google Cloud Functions.
 * @param data - Data to be passed to callable function.
 * @public
 */
export declare type HttpsCallable<RequestData = unknown, ResponseData = unknown> = (data?: RequestData | null) => Promise<HttpsCallableResult<ResponseData>>;

/**
 * Returns a reference to the callable HTTPS trigger with the given name.
 * @param name - The name of the trigger.
 * @public
 */
export declare function httpsCallable<RequestData = unknown, ResponseData = unknown>(functionsInstance: Functions, name: string, options?: HttpsCallableOptions): HttpsCallable<RequestData, ResponseData>;

/**
 * An interface for metadata about how calls should be executed.
 * @public
 */
export declare interface HttpsCallableOptions {
    /**
     * Time in milliseconds after which to cancel if there is no response.
     * Default is 70000.
     */
    timeout?: number;
}

/**
 * An `HttpsCallableResult` wraps a single result from a function call.
 * @public
 */
export declare interface HttpsCallableResult<ResponseData = unknown> {
    /**
     * Data returned from callable function.
     */
    readonly data: ResponseData;
}

モジュール内は、こうなっているようです。

0

1Answer

createProfile を定義するときに型パラメータを与えていないので HttpsCallable<unknown, unknown> と推論されてしまっているのが原因のような気がします。

1Like

Your answer might help someone💌