使用ChatGPT4o+colab+gradio+huggingface1小时内，完成快速搭建任何AI应用程序或网站【详细教程步骤】建议收藏

我使用ChatGPT4o+colab+gradio+huggingface1小时内，完成快速搭建AI人工智能应用，并且免费，下面是具体的步骤：

第一步：

代码丢给ChatGPT4o

完整代码如下：

我正在使用colab创建应用程序，现在想接入gradio，下面是现在的代码：import requests

# 替换为你的Unsplash Access Key
ACCESS_KEY = '你自己的密钥'
SEARCH_KEYWORD = 'Female Olympic Athletes Since 1924'  # 修改为你感兴趣的搜索关键词

def search_unsplash_photos(search_keyword):
    url = f"https://api.unsplash.com/search/photos"
    query = {
        'query': search_keyword,
        'client_id': ACCESS_KEY,
        'per_page': 10,  # 每页返回的结果数
    }
    response = requests.get(url, params=query)
    if response.status_code == 200:
        return response.json()['results']
    else:
        print("Error:", response.status_code)
        return []

# 使用API搜索图片
results = search_unsplash_photos(SEARCH_KEYWORD)

# 打印图片URLs
for photo in results:
    print(photo['urls']['regular'])

接入Gradio可以让你更方便地创建交互式的网页界面。下面是一个完整的示例代码，展示如何使用Gradio创建一个应用程序，允许用户输入搜索关键词，并展示从Unsplash API获取的图片。

import requests
import gradio as gr

# 替换为你的Unsplash Access Key
ACCESS_KEY = '你自己的密钥'

def search_unsplash_photos(search_keyword):
    url = f"https://api.unsplash.com/search/photos"
    query = {
        'query': search_keyword,
        'client_id': ACCESS_KEY,
        'per_page': 10,  # 每页返回的结果数
    }
    response = requests.get(url, params=query)
    if response.status_code == 200:
        return [photo['urls']['regular'] for photo in response.json()['results']]
    else:
        print("Error:", response.status_code)
        return ["Error: Unable to fetch photos"]

def display_photos(search_keyword):
    urls = search_unsplash_photos(search_keyword)
    return urls

# 使用Gradio创建界面
interface = gr.Interface(fn=display_photos, inputs="text", outputs=gr.Gallery(label="Photos from Unsplash"))

# 启动Gradio应用
interface.launch()

这段代码做了以下几件事情：

1. 定义了一个 search_unsplash_photos 函数，用于从Unsplash API中搜索图片。
2. 定义了一个 display_photos 函数，用于根据用户输入的关键词调用 search_unsplash_photos 函数并返回图片的URL。
3. 使用Gradio的 Interface 创建了一个界面，输入类型为文本，输出类型为图片画廊（gr.Gallery）。
4. 启动Gradio应用，使其运行在一个本地服务器上，用户可以通过网页访问。

你可以将这段代码直接复制到Colab中运行，之后Colab会生成一个链接，点击该链接即可访问你的Gradio应用。

在Colab中，你需要先安装Gradio库。你可以使用以下命令来安装Gradio：

!pip install gradio

在安装Gradio之后，再运行之前的代码。以下是完整的示例，包括安装Gradio的步骤：

# 安装Gradio
!pip install gradio

import requests
import gradio as gr

# 替换为你的Unsplash Access Key
ACCESS_KEY = '你自己的密钥'

def search_unsplash_photos(search_keyword):
    url = f"https://api.unsplash.com/search/photos"
    query = {
        'query': search_keyword,
        'client_id': ACCESS_KEY,
        'per_page': 10,  # 每页返回的结果数
    }
    response = requests.get(url, params=query)
    if response.status_code == 200:
        return [photo['urls']['regular'] for photo in response.json()['results']]
    else:
        print("Error:", response.status_code)
        return ["Error: Unable to fetch photos"]

def display_photos(search_keyword):
    urls = search_unsplash_photos(search_keyword)
    return urls

# 使用Gradio创建界面
interface = gr.Interface(fn=display_photos, inputs="text", outputs=gr.Gallery(label="Photos from Unsplash"))

# 启动Gradio应用
interface.launch()

这样你就可以在Colab中顺利运行Gradio应用了。安装过程可能需要几分钟时间，安装完成后可以点击生成的链接访问你的Gradio应用。

现在我把它部署到huggingface

按照以下步骤操作。这些步骤包括创建Hugging Face账户、准备代码、创建requirements.txt文件，以及将所有文件上传到Hugging Face Spaces。

这样，你的Gradio应用就成功部署到了Hugging Face Spaces。你可以分享你的Space链接，让其他人也能访问和使用你的应用。

1. 创建Hugging Face账户： 如果你还没有Hugging Face账户，请先注册一个账户：Hugging Face。

2. 准备代码： 确保你有以下文件：

   • app.py：包含你的Gradio应用代码。
   • requirements.txt：包含你的Python依赖包。

   在你的Colab笔记本中创建app.py文件，并将你的Gradio代码复制到该文件中：

   # 创建app.py文件并写入Gradio代码
   with open("app.py", "w") as file:
       file.write('''
   

   创建requirements.txt文件：

3. # 创建requirements.txt文件
   with open("requirements.txt", "w") as file:
       file.write('''
   gradio
   requests
   ''')
   

4. 将文件上传到Hugging Face Spaces：

   • 访问 Hugging Face Spaces。
   • 点击右上角的 "New Space" 按钮，创建一个新的Space。
   • 输入Space的名称，选择 "Gradio" 作为模板，然后点击 "Create Space"。
   • 创建完成后，你会看到一个空的Space。点击 "Files and versions" 标签，然后点击 "Upload files" 上传 app.py 和 requirements.txt 文件。
   • 上传完成后，Hugging Face Spaces会自动检测并运行你的Gradio应用。

5. 测试和发布：

   上传文件后，Hugging Face会自动构建并运行你的应用。你可以在浏览器中访问你的Space URL来测试你的应用。如果一切正常，你的Gradio应用将被成功部署并公开可用。

将app.py和requirements.txt文件从Colab上传到Hugging Face Spaces，可以按照以下步骤操作：

3. 上传文件到Hugging Face Spaces

4. 部署和测试

另外一种方式是：

直接用代码将colab的代码推送到huggingface

1. 创建并下载文件：

   在Colab中创建并下载app.py和requirements.txt文件。

   # 创建app.py文件并写入Gradio代码
   with open("app.py", "w") as file:
       file.write('''import requests
   import gradio as gr
   
   # 替换为你的Unsplash Access Key
   ACCESS_KEY = '你自己的密钥'
   
   def search_unsplash_photos(search_keyword):
       url = f"https://api.unsplash.com/search/photos"
       query = {
           'query': search_keyword,
           'client_id': ACCESS_KEY,
           'per_page': 10,  # 每页返回的结果数
       }
       response = requests.get(url, params=query)
       if response.status_code == 200:
           return [photo['urls']['regular'] for photo in response.json()['results']]
       else:
           print("Error:", response.status_code)
           return ["Error: Unable to fetch photos"]
   
   def display_photos(search_keyword):
       urls = search_unsplash_photos(search_keyword)
       return urls
   
   # 使用Gradio创建界面
   interface = gr.Interface(fn=display_photos, inputs="text", outputs=gr.Gallery(label="Photos from Unsplash"))
   
   # 启动Gradio应用
   interface.launch()
   ''')
   
   # 创建requirements.txt文件
   with open("requirements.txt", "w") as file:
       file.write('''
   gradio
   requests
   ''')
   
   # 下载app.py文件
   from google.colab import files
   files.download('app.py')
   
   # 下载requirements.txt文件
   files.download('requirements.txt')
   

   运行上述代码后，你会看到浏览器底部弹出下载文件的对话框，分别下载app.py和requirements.txt文件到本地。

   2. 创建Hugging Face Space

2. 访问 Hugging Face Spaces。
3. 点击右上角的 "New Space" 按钮。
4. 输入Space的名称，例如 unsplash-photo-search。
5. 选择 "Gradio" 作为模板。
6. 在创建好的Space页面，点击 "Files and versions" 标签。
7. 点击 "Upload files" 按钮。
8. 上传你刚才下载到本地的app.py和requirements.txt文件。
9. 上传完成后，Hugging Face会自动检测并运行你的Gradio应用。
10. 你会看到一个URL，点击该URL即可在浏览器中访问你的Gradio应用。