index.nvue 代码如下:因为调用了deepseek key,我发上来就把key隐藏了,其它的都没动,发出来给管理员看看
<template>
<div class="app-container">
<header class="app-header">
<h1>王诩扬专用AI</h1>
<p class="subtitle">上知天文,下知地理</p>
<div class="question-counter">
<span>今日剩余提问次数: <strong>{{ remainingQuestions }}</strong>/30</span>
</div>
</header>
<div class="question-area">
<textarea
v-model="question"
placeholder="请输入你的问题..."
class="question-input"
:rows="5"
:disabled="remainingQuestions <= 0 || isLoading"
></textarea>
<button
class="submit-btn"
@click="submitQuestion"
:disabled="!question.trim() || remainingQuestions <= 0 || isLoading"
>
{{ isLoading ? '思考中...' : '我要咨询' }}
</button>
</div>
<div class="answer-area" v-if="answer">
<h3 class="answer-title">AI回答:</h3>
<div class="answer-content" v-html="formatAnswer(answer)"></div>
</div>
<div class="error-message" v-if="errorMessage">
⚠️ {{ errorMessage }}
</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue';
// ======== 状态管理 ========
const question = ref('');
const answer = ref('');
const isLoading = ref(false);
const errorMessage = ref('');
const questionCount = ref(0);
const today = ref('');
const MAX_QUESTIONS_PER_DAY = 30;
const remainingQuestions = ref(MAX_QUESTIONS_PER_DAY);
// ======== 存储管理(纯内存,不依赖localStorage)=======
let memoryStorage: { date: string; count: number } = { date: '', count: 0 };
// ======== 初始化 ========
onMounted(() => {
try {
// 获取当前日期
const now = new Date();
today.value = now.toISOString().split('T')[0] || '';
// 初始化存储(纯内存,不依赖localStorage)
if (memoryStorage.date !== today.value) {
memoryStorage = { date: today.value, count: 0 };
}
questionCount.value = memoryStorage.count;
remainingQuestions.value = MAX_QUESTIONS_PER_DAY - questionCount.value;
} catch (error) {
console.error('初始化失败:', error);
questionCount.value = 0;
remainingQuestions.value = MAX_QUESTIONS_PER_DAY;
}
});
// 保存提问次数(纯内存)
function saveQuestionCount(): void {
memoryStorage = { date: today.value, count: questionCount.value };
}
// ======== 文本处理 ========
// 格式化回答内容
function formatAnswer(text: string): string {
return text ? text.replace(/\n/g, '<br>') : '';
}
// ======== 网络请求(适配小程序环境)=======
// 提交问题(使用环境兼容的请求方法)
async function submitQuestion(): Promise<void> {
const trimmedQuestion = (question.value || '').trim();
if (!trimmedQuestion) {
errorMessage.value = '请输入你的问题~';
return;
}
if (remainingQuestions.value <= 0) {
errorMessage.value = '今日提问次数已用完,明天再来吧!';
return;
}
isLoading.value = true;
errorMessage.value = '';
answer.value = '';
try {
// ======== 关键:使用环境专用请求API ========
// 假设是微信小程序环境,使用wx.request
if (typeof wx !== 'undefined' && wx.request) {
wx.request({
url: 'https://api.deepseek.com/v1/chat/completions',
method: 'POST',
header: {
'Content-Type': 'application/json',
'Authorization': Bearer (这儿本来是写deepseek key))
},
data: {
model: 'deepseek-chat',
messages: [
{
role: 'system',
content: '你是专为小朋友王诩扬设计的AI助手,回答要简单易懂、有趣生动,适合小朋友理解,每次回答不超过200字。'
},
{
role: 'user',
content: trimmedQuestion
}
],
max_tokens: 200,
temperature: 0.8,
top_p: 0.9
},
timeout: 30000,
success: (res: any) => {
isLoading.value = false;
if (res.statusCode >= 200 && res.statusCode < 300) {
const content = res.data?.choices?.[0]?.message?.content;
if (content) {
answer.value = content;
questionCount.value++;
remainingQuestions.value = MAX_QUESTIONS_PER_DAY - questionCount.value;
saveQuestionCount();
question.value = '';
} else {
errorMessage.value = 'AI未返回有效回答';
}
} else {
errorMessage.value = 请求失败 (${res.statusCode}): ${res.errMsg || '未知错误'}
;
}
},
fail: (err: any) => {
isLoading.value = false;
errorMessage.value = 请求失败: ${err.errMsg || '网络错误'}
;
}
});
}
// 其他环境 fallback(如支付宝小程序my.request)
else if (typeof my !== 'undefined' && my.request) {
my.request({
// 支付宝小程序请求参数(类似wx.request)
url: 'https://api.deepseek.com/v1/chat/completions',
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': Bearer sk-91b81580567642dbad0e6e93aaae5a39
},
data: { / 请求数据同上 / },
timeout: 30000,
success: (res: any) => { / 处理逻辑同上 / },
fail: (err: any) => { / 处理逻辑同上 / }
});
}
// 最后的应急方案
else {
throw new Error('请在支持的环境中使用(微信/支付宝小程序)');
}
} catch (err) {
isLoading.value = false;
const errorMsg = err instanceof Error ? err.message : String(err);
errorMessage.value = 提交失败: ${errorMsg}
;
}
}
</script>
<style scoped>
/ 简化样式,避免复杂布局 /
.app-container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
font-family: "Microsoft YaHei", sans-serif;
background-color: #f8f9fa;
min-height: 100vh;
}
.app-header {
text-align: center;
margin-bottom: 30px;
padding: 20px 0;
background: linear-gradient(135deg, #4CAF50 0%, #8BC34A 100%);
border-radius: 12px;
color: white;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.question-input {
width: 100%;
padding: 15px;
border: 2px solid #ddd;
border-radius: 10px;
font-size: 16px;
resize: none;
min-height: 100px; / 固定最小高度,避免DOM调整 /
box-sizing: border-box;
}
.submit-btn {
width: 100%;
padding: 15px;
margin-top: 15px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 10px;
font-size: 18px;
font-weight: bold;
cursor: pointer;
}
.submit-btn:disabled {
background-color: #cccccc;
cursor: not-allowed;
}
.answer-area {
padding: 20px;
background-color: white;
border-radius: 10px;
margin-top: 20px;
}
.error-message {
padding: 15px;
background-color: #fff3cd;
color: #856404;
border-radius: 8px;
margin-top: 20px;
text-align: center;
}
/ 新增:广告杀手CSS /
/ 隐藏常见悬浮广告位置 /
body > div:not(.app-container), / 除了我们的主容器外的所有顶层元素 /
div[class="ad"], / 类名含"ad"的元素 /
div[class="advert"], / 类名含"advert"的元素 /
div[style="fixed"][style="bottom"][style="right"], / 右下角固定元素 /
div[style="width: 50px"][style="height: 50px"][style="border-radius: 50%"] / 小圆形元素 /
{
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
position: absolute !important;
z-index: -9999 !important;
}
</style>
g***@qq.com (作者)
谢谢您这么晚还及时回复,我本来还以为要明天才有回复呢。
我的云打包都没有勾任何东西,因为我测试另一个app时,也是同样的设置,我还特意测试了2次,仔细检查过,一个都没勾选,打包出来后就没有广告。
另外,我在下面把源代码都全部贴上来了,确实没有用到过:webview ,到底是哪儿的原因呢?
如果你有时间,愿意帮忙测试的话,我可以把源代码发一份您,您打包看看?
2025-10-18 00:48