×

AI 生成 web 应用，如何通过广告变现 “钱” 景无限

hqy hqy 发表于2025-05-20 21:24:45 浏览19 评论0

抢沙发发表评论

前面一篇博文AI生成的垃圾小游戏-上架谷歌应用市场全流程-图文介绍带大家将AI生成的APP发布到应用市场，接下来再给大家介绍一下如何进行变现。关于变现这块，计划分三篇进行介绍（pc、小程序、app），这里对感兴趣的小伙伴有一定的基础要求 

今天将介绍变现第一篇：wap/pc站点集成广告变现（文末点击原文可以查看效果哦~）

核心流程如下

•基于AI创建WEB应用（如让deepseek生成html应用）•在广告平台申请广告接入•WEB应用集成广告SDK•发布应用，供其他小伙伴在线访问

1. 前置准备

本文给大家介绍集成谷歌的AdSense广告的方式（选择谷歌的原因是他不卡个人账号，对个人开发者尤为友好，其他广告具体的集成方式和adsense的集成差别并不大） 在开始之前，我们需要准备两个必要的东西

•域名

•谷歌账号 (需要科学上网)

1.1 域名

之前的文章中介绍的是将web应用托管到CloudFlare的Pages服务，使用的是它们的二级域名； 
但是请注意，当我们希望给自己的网站挂广告时，会有一个域名所有权的验证要求，需要在一级域名下挂一个文件；使用第三方托管的pages服务时，我们无法实现这一点；因此搞一个自己的域名是必要条件
只要你对域名的要求不高，搞一个域名实际开销并不大；喜欢折腾的小伙伴，可以尝试一些免费的域名注册(register.us.kg， www.cloudns.net）

 当然个人建议买个自用的域名还是有必要的，避免域名养熟了不让续期被割韭菜；国内的域名托管商如阿里、腾讯、华为，都可以购买自用的域名 以阿里云为例，一个非常便宜的数字域名，10年68元


图片

1.2 AdSense

Google AdSense是一个快速简便的网上赚钱方法，可以让具有一定访问量规模的网站发布商为他们的网站展示与网站内容相关的 Google广告并将网站流量转化为收入。

关于如何注册谷歌账号、开通Adsense 这里不详细展开，确实有需要的小伙伴评论给出 几个事项说明：

•推荐通过注册gmail邮箱，来实现谷歌全家桶登录•账号开通不需要收费•收款信息可以使用国内的储蓄卡•满$100 下个月电汇•网站申请接入广告时，需要确保有一定的访问量（及pv/uv需要达到一定的标准）

2. 谷歌广告集成指南

接下来我们假设你已经有域名、并开通了Adsense账号

2.1 AdSense广告配置

2.1.1 新增网站

图片
图片
 然后我们需要在自己网站的主页上集成上面的内容，我们接下来选择最简单的 ads.txt， 点击之后将这个文本放在你的网站根目录下
图片
如果你有自己的服务器，可以在服务器的访问目录下直接放这个txt文件；如果没有自己的服务器，也可以借助免费的oss来实现（比如七牛云，将ads.txt文件放在buckert下面）

因为我有独立的服务器，因此直接将广告文件丢上去、外网直接访问效果如下

图片

然后点击上面的验证，接下来就会进入下面的四步

•验证•申请审核•提交CMP•等待谷歌审核


图片

2.1.2 申请广告单元

当上面整完之后，接下来我们就可以申请广告单元，准备集成到我们的web应用中了

广告 -> 按广告单元 -> 选择需要创建的广告单元

图片

我们这里选择第一种

•红框里的内容都是可以调整的 


图片
创建完成之后，你会得到下面的页面 
图片
上面的代码就是我们需要使用到的，点击完成之后就完事了

2.2 web应用集成广告

还是以之前做的 “垃圾消除” 小游戏为例，直接在 index.html 文件中，将上面的代码拷贝进去

2.2.1 代码集成

将上面的代码划分为三块

  • <scirpt> 对应的js文件, 放在head标签内

  • <ins> 对应的区域放在body内

  • <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> 放在head标签内

另外需要注意的是将上面的代码，包裹在下面的输入内，避免影响app、小程序运行时显示了adsense广告

<!-- #ifdef WAP -->
 这里是代码块内容
<!-- #endif -->



图片

2.2.2 web应用部署

接下来就是将我们的应用部署到公网上，让大家可以访问 


step1: 打包应用

  • mainfest.json 文件，找到web配置，在运行的基础路径上配置访问前缀（如果直接放在域名下访问的，可以不配置这个）

  • 菜单 -> 发行 -> 网站 PC WEB或手机H5 -> 在弹窗中输入你的域名

图片

打包成功之后，你会在控制台中看到下面的提示信息

图片

step2: 上传应用


然后进入上面的目录，将文件打包，准备上传到自己的服务器（或者第三方托管服务），在 毫无技术难度：由0到1基于AI完成“垃圾消除小游戏” 文章介绍的是托管到七牛云的oss，这里我们再介绍一下传到自己的服务器的方式

使用下面的shell命令，将文件压缩为tar.gz上传到服务器

# 因为上面打包的时候，设置的网站访问前缀是 /sheepgame/ 所以我们先讲打包目录重命名为 sheepgamemv web sheepgame
# 压缩tar -zcvf sheepgame.tar.gz sheepgame/
# 通过scp上传到自己的服务器上的web目录下# 将下面的ip换成你自己服务器信息，scp sheepgame.tar.gz xxx@47.115.228.93:/home/app/
# 登录到服务器进行解压tar -zcvf sheepgame.tar.gz

不习惯使用shell命令的小伙伴，可以借助文件上传工具来实现 （比如 beyond compare）

step3: 实测

上传成功之后，直接访问看看效果: https://ai.hhui.top/sheepgame/#/

  • pc访问效果：

图片

  • 移动端访问效果：

图片

3. 扩展说明

本文主要介绍的是如何接入谷歌广告到自己的站点上，通过曝光和点击来变现；针对这种方式，我们完全可以借助现在大模型的能力，生成一些html格式的网页工具，基于此搭建一个自己的网站，接下来更重要的事情就是营销和引流了(毫不避讳的说，运营比你生成这些web应用要重要很多很多)

给一个简单的示例：将大模型生成的各种小工具打包对外使用

比如我们直接对话DeepSeek，让他帮我生成一个工具导航网站，把我们自己用ai生成的工具都集成进去

# 非常简单的提示词帮我生成一个工具合集的导航页，其中区分工具类、游戏类；整体要求简洁美观然后帮我生成的内容如下


然后帮我生成的内容如下

图片

然后我们调整下导航栏，替换为之前使用AI生成的各种web应用；整体调整一下显示样式

图片
点击左下角的查看原文即可查看效果；本文的内容虽然简单，但是对于没有接触过的小伙伴估计还是有一点挑战的(如域名解析配置、服务器web应用托管)，遇到问题的小伙伴可以微信留言
下一篇将给大家介绍APP的集成广告变现方式（这个相比较于WEB变现技术要求更低，基本上可以实现无编程背景速通）


打赏

本文链接：https://www.kinber.cn/post/5124.html 转载需授权！

分享到：


推荐本站淘宝优惠价购买喜欢的宝贝:

image.png

 您阅读本篇文章共花了： 

群贤毕至

访客