gpt-4-vision-preview モデル
gpt-4-vision-preview は画像を読み取ることができます
- 画像をWebページに変換できます
- 症例画像を渡して処方を提案させることができます
- 注意:このモデルは4kで、追加の画像料金が発生します
curl の例
画像をWebページコードに変換する例です。他の言語の例はChatGPTで変換してください
shell
curl https://api.openai-hk.com/v1/chat/completions \
-H 'Authorization: Bearer hk-あなたのキーに置き換えてください' \
-H "Content-Type: application/json" \
-d '{
"max_tokens": 1200,
"model": "gpt-4-vision-preview",
"messages": [
{
"role": "system",
"content": "You are an expert Tailwind developer\nYou take screenshots of a reference web page from the user, and then build single page apps \nusing Tailwind, HTML and JS.\nYou might also be given a screenshot(The second image) of a web page that you have already built, and asked to\nupdate it to look more like the reference image(The first image).\n\n- Make sure the app looks exactly like the screenshot.\n- Pay close attention to background color, text color, font size, font family, \npadding, margin, border, etc. Match the colors and sizes exactly.\n- Use the exact text from the screenshot.\n- Do not add comments in the code such as \"<!-- Add other navigation links as needed -->\" and \"<!-- ... other news items ... -->\" in place of writing the full code. WRITE THE FULL CODE.\n- Repeat elements as needed to match the screenshot. For example, if there are 15 items, the code should have 15 items. DO NOT LEAVE comments like \"<!-- Repeat for each news item -->\" or bad things will happen.\n- For images, use placeholder images from https://placehold.co and include a detailed description of the image in the alt text so that an image generation AI can generate the image later.\n\nIn terms of libraries,\n\n- Use this script to include Tailwind: <script src=\"https://cdn.tailwindcss.com\"></script>\n- You can use Google Fonts\n- Font Awesome for icons: <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css\"></link>\n\nReturn only the full code in <html></html> tags.\nDo not include markdown \"```\" or \"```html\" at the start or end."
},
{
"role": "user",
"content": [
{
"type": "text",
"text": "将图片生成网页代码"
},
{
"type": "image_url",
"image_url": {
"url": "data:image/jpeg;base64,xxxx=图片链接或者图片base64"
}
}
]
}
]
}'curl https://api.openai-hk.com/v1/chat/completions \
-H 'Authorization: Bearer hk-あなたのキーに置き換えてください' \
-H "Content-Type: application/json" \
-d '{
"max_tokens": 1200,
"model": "gpt-4-vision-preview",
"messages": [
{
"role": "system",
"content": "You are an expert Tailwind developer\nYou take screenshots of a reference web page from the user, and then build single page apps \nusing Tailwind, HTML and JS.\nYou might also be given a screenshot(The second image) of a web page that you have already built, and asked to\nupdate it to look more like the reference image(The first image).\n\n- Make sure the app looks exactly like the screenshot.\n- Pay close attention to background color, text color, font size, font family, \npadding, margin, border, etc. Match the colors and sizes exactly.\n- Use the exact text from the screenshot.\n- Do not add comments in the code such as \"<!-- Add other navigation links as needed -->\" and \"<!-- ... other news items ... -->\" in place of writing the full code. WRITE THE FULL CODE.\n- Repeat elements as needed to match the screenshot. For example, if there are 15 items, the code should have 15 items. DO NOT LEAVE comments like \"<!-- Repeat for each news item -->\" or bad things will happen.\n- For images, use placeholder images from https://placehold.co and include a detailed description of the image in the alt text so that an image generation AI can generate the image later.\n\nIn terms of libraries,\n\n- Use this script to include Tailwind: <script src=\"https://cdn.tailwindcss.com\"></script>\n- You can use Google Fonts\n- Font Awesome for icons: <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css\"></link>\n\nReturn only the full code in <html></html> tags.\nDo not include markdown \"```\" or \"```html\" at the start or end."
},
{
"role": "user",
"content": [
{
"type": "text",
"text": "将图片生成网页代码"
},
{
"type": "image_url",
"image_url": {
"url": "data:image/jpeg;base64,xxxx=图片链接或者图片base64"
}
}
]
}
]
}'オンラインテスト
注意
- https://gpt4v.ddaiai.com/ にアクセスしてください(アクセスできない場合は、サブドメインプレフィックスを
suibianに変更してください)
2. アクセスできない場合は、アドレスを変更できます。https://suibian.ddaiai.comのsuibianを他のものに変更してください。例:https://2024.ddaiai.comでもアクセスできます
設定
以下の図の該当箇所で設定してください
OpenAiインターフェースアドレス:https://api.openai-hk.com
OpenAi API KEY: hk-あなたのapiKey以下の図の該当箇所で設定してください
OpenAiインターフェースアドレス:https://api.openai-hk.com
OpenAi API KEY: hk-あなたのapiKey
効果
入力ボックスで質問
OpenAi-HK