尝试AI辅助编程

前言

纯水文一篇。

话说AI编程这两年已经红了有一阵了,应该是从Copilot出现开始的,然而作为穷人,我还没有试过。

最近因为Amazon推出了免费的CodeWhisperer,我才开始尝试这种好东西,确实方便很多。一般短的代码它给的都还行,就是中文注释经常有问题。长代码还是需要人工过一遍,不然还是有一些坑的。

然而这还不够,更强大的当然是让ChatGPT从头开始写。

正好早就想尝试毛毛象接口开发,但是又懒得看文档,不如直接让AI来搞吧。

ChatGPT生成代码

我说:

用python的bottle框架写一个使用mastodon账号登录的页面

AI的回复是:

抱歉,由于 Mastodon API 的限制,我作为 AI 不能为您提供此功能的完整代码,但我可以为您提供相关的步骤和代码示例。

首先,您需要从 Mastodon 您要使用的实例上获取以下信息:

  • Client ID
  • Client Secret
  • Redirect URI

例如,如果您要连接 Mastodon.social 实例,您可以访问 https://mastodon.social/settings/applications 创建一个新的应用程序。创建应用程序后,您将收到以上信息。

在您的 Python 代码中,导入以下库:

import os
from urllib.parse import urlencode
import requests
from bottle import request, redirect

设置 Mastodon 实例的基本信息和 OAuth2 认证 URL:

# Replace these with your own values
instance_url = "https://mastodon.social"
client_id = "your client id"
client_secret = "your client secret"
redirect_uri = "http://yourdomain.com/callback"

auth_url = f"{instance_url}/oauth/authorize"
token_url = f"{instance_url}/oauth/token"

创建一个 login 路由,当用户访问该路由时,会将他们重定向到 Mastodon 实例上的认证页面:

@app.route('/login')
def login():
    params = {
        "client_id": client_id,
        "redirect_uri": redirect_uri,
        "response_type": "code",
        "scope": "read write follow"
    }
    url = auth_url + '?' + urlencode(params)
    return redirect(url)

创建一个 callback 路由,该路由将接收 Mastodon 实例返回的授权码,并使用该授权码获取访问令牌:

@app.route('/callback')
def callback():
    code = request.query.get('code')
    if not code:
        return "Error: Missing authorization code"
    
    data = {
        "client_id": client_id,
        "client_secret": client_secret,
        "grant_type": "authorization_code",
        "code": code,
        "redirect_uri": redirect_uri
    }
    response = requests.post(token_url, data=data)
    if response.status_code != 200:
        return f"Error: {response.status_code} - {response.text}"
    
    token = response.json()
    access_token = token["access_token"]
    # Use the access token to make API requests
    return "Logged in successfully!"

最后,运行您的 Bottle 应用程序并访问 /login 路由即可。用户将被重定向到 Mastodon 认证页面,然后被重定向回您的应用程序,程序将使用 OAuth2 授权码获取访问令牌。

提示:更好的用户体验是,您可以根据用户的权限,展示不同的页面。例如,如果用户没有足够的访问权限,您可以展示一个友好的错误页面,而不是仅仅返回错误消息。

我再问:

如何在登录后的页面上显示mastodon账号的基本信息

AI返回:

要在登录后的页面上显示 Mastodon 账号的基本信息,您需要使用访问令牌调用 Mastodon API 获取该用户的信息。具体来说,您需要执行以下步骤:

callback 路由中,获取访问令牌之后,使用该令牌调用 /api/v1/accounts/verify_credentials 端点获取用户的信息:

headers = {"Authorization": f"Bearer {access_token}"}
response = requests.get(f"{instance_url}/api/v1/accounts/verify_credentials", headers=headers)
if response.status_code != 200:
    return f"Error: {response.status_code} - {response.text}"
    
user = response.json()

将用户信息作为渲染模板的参数,并在用户登录后的页面上展示出来。假设您使用了 Jinja2 模板引擎,以下是可行的示例代码:

@app.route('/dashboard')
def dashboard():
    headers = {"Authorization": f"Bearer {access_token}"}
    response = requests.get(f"{instance_url}/api/v1/accounts/verify_credentials", headers=headers)
    if response.status_code != 200:
        return f"Error: {response.status_code} - {response.text}"
    user = response.json()
    template_params = {
        "username": user["username"],
        "display_name": user["display_name"],
        "avatar_url": user["avatar"],
    }
    return template('dashboard', **template_params)

在您的模板文件中,您可以使用渲染模板时提供的参数显示用户信息:

<h1>Welcome {{ display_name }}!</h1>
<p>Your username is {{ username }}</p>
<img src="{{ avatar_url }}" alt="{{ display_name }}'s avatar">

该示例代码从用户信息中提取出用户的用户名、显示名称和头像 URL,并将它们作为模板渲染参数传递给 dashboard 路由。然后在模板文件中,展示用户的欢迎信息、头像和用户名。

我说:

不用模板,直接返回HTML

AI马上改了一版:

如果您不想使用模板文件,也可以在 Python 代码中直接写 HTML 代码来展示 Mastodon 账号信息。

以下是一个示例代码,它使用了 Python 字符串插值来动态地插入用户信息,生成 HTML 代码并将其返回:

@app.route('/dashboard')
def dashboard():
    # Your code for obtaining access_token and user data

    dashboard_data = f"""
        <html>
        <head>
            <title>Welcome, {user["display_name"]}!</title>
        </head>
        <body>
            <h1>Welcome, {user["display_name"]}!</h1>
            <p>Your username is {user["username"]}</p>
            <img src="{user["avatar"]}" alt="{user["display_name"]}'s avatar">
        </body>
        </html>
    """

    return dashboard_data

在示例代码中,我们使用了 Python 3.6 及以上版本中的 f-string 功能,使用 {} 花括号将变量插入到 HTML 代码中。我们从 Mastodon API 中获取了用户信息,并将其插入到生成的 HTML 代码中。

返回的 HTML 代码可以在 Bottle 应用程序中直接使用。这种方式不需要使用模板引擎,但是如果您的 HTML 代码很长,它可能会变得不易于维护。

请注意,直接在 Python 代码中编写 HTML 代码具有潜在的 XSS 漏洞。请务必确保您编写的代码始终按照预期方式呈现,并遵循 Web 应用程序安全最佳实践。

最后

我加的代码就只有:

  • 配置Mastodon app参数
  • Bottle实例的初始化和run()
  • access_token放到全局变量

然后这个页面就运行起来了,功能正常……

推送到[go4pro.org]