如何编写一个chrome插件调用本地ollama大模型实现网页划词ai总结？
网友回复
我们以chatgpt为例，ollama的api也是兼容chatgpt的。
创建一个 Chrome 插件来实现网页中选择文本进行 AI 问答，并调用 ChatGPT 的 API 接口，涉及以下步骤：
步骤概述：创建 Chrome 插件结构：包括 manifest.json、popup.html、popup.js 等文件。设置权限：确保插件有权限访问当前页面的内容和调用外部 API。与页面交互：允许用户选择页面上的文本。调用 ChatGPT API：使用 HTTP 请求发送选择的文本，并获取 AI 回答。显示结果：将 AI 回答显示在插件的弹出窗口中。具体实现步骤：1. 创建 manifest.json 文件{
"manifest_version": 3,
"name": "ChatGPT Q&A Plugin",
"version": "1.0",
"description": "Select text on a webpage and get AI answers using ChatGPT API.",
"permissions": [
"activeTab",
"storage",
"http://*/*",
"https://*/*"
],
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "icon16.png",
"48": "icon48.png",
"128": "icon128.png"
}
},
"icons": {
"16": "icon16.png",
"48": "icon48.png",
"128": "icon128.png"
},
"background": {
"service_worker": "background.js"
},
"permissions": [
"activeTab"
]
} 2. 创建 popup.html 文件 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ChatGPT Q&A</title>
<script src="popup.js"></script>
<style>
body {
width: 300px;
padding: 10px;
}
button {
margin-top: 10px;
}
</style>
</head>
<body>
<h2>ChatGPT Q&A</h2>
<textarea id="selectedText" rows="4" cols="30" placeholder="Select text on the webpage"></textarea>
<button id="askButton">Ask</button>
<div id="answer"></div>
</body>
</html> 3. 创建 popup.js 文件 document.addEventListener('DOMContentLoaded', function () {
const askButton = document.getElementById('askBu...点击查看剩余70%
by thinkfuture
我知道答案，我要回答
私活外包
