理解 Interface 類

在本節中，我們將仔細研究 Interface 類，並瞭解用於建立它的主要引數。

如何建立 Interface

您會注意到 Interface 類有 3 個必需引數

Interface(fn, inputs, outputs, ...)

這些引數是

fn: 由 Gradio 介面封裝的預測函式。此函式可以接受一個或多個引數並返回一個或多個值。
inputs: 輸入元件型別。Gradio 提供了許多預建元件，例如 "image" 或 "mic"。
outputs: 輸出元件型別。同樣，Gradio 提供了許多預建元件，例如 "image" 或 "label"。

有關元件的完整列表，請檢視 Gradio 文件。每個預建元件都可以透過例項化與該元件對應的類來進行自定義。

例如，正如我們在上一節中看到的，您可以透過傳入 Textbox(lines=7, label="Prompt") 元件來建立具有 7 行和標籤的文字框，而不是將 "textbox" 傳遞給 inputs 引數。

讓我們來看另一個例子，這次使用的是 Audio 元件。

一個簡單的音訊示例

如前所述，Gradio 提供了許多不同的輸入和輸出。因此，讓我們構建一個使用音訊的 Interface。

在本例中，我們將構建一個音訊到音訊函式，該函式接受一個音訊檔案並簡單地將其反轉。

我們將使用 Audio 元件作為輸入。使用 Audio 元件時，您可以指定是否希望音訊的 source 是使用者上傳的檔案，還是使用者用麥克風錄製的聲音。在本例中，讓我們將其設定為 "microphone"。為了有趣，我們將向我們的 Audio 新增一個標籤，上面寫著“在這裡說話…”。

此外，我們希望將音訊作為 numpy 陣列接收，以便我們可以輕鬆地將其“反轉”。因此，我們將 "type" 設定為 "numpy"，這會將輸入資料作為 (sample_rate, data) 的元組傳遞到我們的函式中。

我們還將使用 Audio 輸出元件，它可以自動將帶有采樣率和 numpy 資料陣列的元組渲染為可播放的音訊檔案。在本例中，我們無需進行任何自定義，因此我們將使用字串快捷方式 "audio"。

import numpy as np
import gradio as gr


def reverse_audio(audio):
    sr, data = audio
    reversed_audio = (sr, np.flipud(data))
    return reversed_audio


mic = gr.Audio(source="microphone", type="numpy", label="Speak here...")
gr.Interface(reverse_audio, mic, "audio").launch()

上面的程式碼將生成一個類似於下面的介面（如果您的瀏覽器沒有要求您麥克風許可權，請在單獨的標籤頁中開啟演示）。

您現在應該能夠錄製自己的聲音並聽到自己反向說話 - 令人毛骨悚然 👻!

處理多個輸入和輸出

假設我們有一個更復雜的函式，它具有多個輸入和輸出。在下面的示例中，我們有一個函式，它接受一個下拉列表索引、一個滑塊值和一個數字，並返回一個音樂音調的音訊樣本。

看看我們如何傳遞輸入和輸出元件列表，並嘗試理解發生了什麼。

這裡的關鍵是，當您傳遞

一個輸入元件列表時，每個元件按順序對應一個引數。
一個輸出元件列表時，每個元件對應一個返回值。

下面的程式碼片段顯示了三個輸入元件如何與 generate_tone() 函式的三個引數相對應。

import numpy as np
import gradio as gr

notes = ["C", "C#", "D", "D#", "E", "F", "F#", "G", "G#", "A", "A#", "B"]


def generate_tone(note, octave, duration):
    sr = 48000
    a4_freq, tones_from_a4 = 440, 12 * (octave - 4) + (note - 9)
    frequency = a4_freq * 2 ** (tones_from_a4 / 12)
    duration = int(duration)
    audio = np.linspace(0, duration, duration * sr)
    audio = (20000 * np.sin(audio * (2 * np.pi * frequency))).astype(np.int16)
    return (sr, audio)


gr.Interface(
    generate_tone,
    [
        gr.Dropdown(notes, type="index"),
        gr.Slider(minimum=4, maximum=6, step=1),
        gr.Textbox(type="number", value=1, label="Duration in seconds"),
    ],
    "audio",
).launch()

launch() 方法

到目前為止，我們一直在使用 launch() 方法啟動介面，但我們還沒有真正討論它做了什麼。

預設情況下，launch() 方法將在本地執行的 Web 伺服器中啟動演示。如果您在 Jupyter 或 Colab 筆記本中執行程式碼，那麼 Gradio 將在筆記本中嵌入演示 GUI，以便您能夠輕鬆地使用它。

您可以透過不同的引數自定義 launch() 的行為。

inline - 是否在 Python 筆記本中內聯顯示介面。
inbrowser - 是否在預設瀏覽器的新標籤頁中自動啟動介面。
share - 是否從您的計算機為介面建立一個可公開共享的連結。就像 Google Drive 連結一樣！

我們將在下一節中更詳細地介紹 share 引數！

✏️ 讓我們實踐一下！

讓我們構建一個介面，允許您演示一個 **語音識別** 模型。為了更有趣，我們將接受 *麥克風輸入* 或 *上傳檔案*。

像往常一樣，我們將使用 🤗 Transformers 中的 pipeline() 函式載入我們的語音識別模型。如果您需要快速回顧，可以返回到第 1 章的這一節。接下來，我們將實現一個 transcribe_audio() 函式來處理音訊並返回轉錄結果。最後，我們將使用 Audio 元件為輸入和輸出文字包裝這個函式，並建立一個 Interface。整個應用程式程式碼如下：

from transformers import pipeline
import gradio as gr

model = pipeline("automatic-speech-recognition")


def transcribe_audio(mic=None, file=None):
    if mic is not None:
        audio = mic
    elif file is not None:
        audio = file
    else:
        return "You must either provide a mic recording or a file"
    transcription = model(audio)["text"]
    return transcription


gr.Interface(
    fn=transcribe_audio,
    inputs=[
        gr.Audio(source="microphone", type="filepath", optional=True),
        gr.Audio(source="upload", type="filepath", optional=True),
    ],
    outputs="text",
).launch()

如果您的瀏覽器沒有請求麥克風許可權，請在另一個標籤頁中開啟演示。

就是這樣！現在您可以使用此介面來轉錄音訊。請注意，透過將 optional 引數設定為 True，我們允許使用者提供麥克風或音訊檔案（或兩者都不提供，但這將返回錯誤訊息）。