PandaJS 使用说明 (1.2)： Hello, World!
PandaJS 中服务器端处理的请求有两类，一类是 API 请求，另一类是页面请求。本文将介绍如何从客户端调用服务器端的 API ，并编写一个简单的 Hello, World! 示例。
准备工作
利用上一篇文章中介绍的方法，建立新项目 HelloPanada，删除以下目录中的内容，因为我们将从零开始建立示例程序：
1. scripts/app，scripts/test/app 和 scripts/test/both 目录中的文件
2. webapp 目录中的 html 文件
3. webapp/js 和 webapp/js/both 中的 js 文件，保留 webapp/lib 中的文件
现在我们可以在 src/com/pandajs/Luncher.java 上点击鼠标右键，选择 Run As -> Java Application，Web 应用可以正常启动（虽然现在没有与数据库相关的操作，但还是请先启动 mongod），并输出日志。
由于我们还没有编写处理请求的 JS 代码，因此现在还无法访问任何页面。
PandaJS 支持热部署，通常不需要重启应用。
那么接下来就让我们一边编写代码，一边看看效果吧。
HTML 页面
首先，我们需要建立一个 HTML 页面，来显示服务器端 API 返回的结果，并引入必要的客户端 JS 文件。
我们可以在 webapp 目录下创建文件 hello.html：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="css/hello.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="message" /></div>
<script src="js/lib/jquery.js"></script>
<script src="js/lib/jquery.tmpl.js"></script>
<script src="js/lib/json.js"></script>
<script src="js/lib/panda.js"></script>
<script src="js/hello.js"></script>
</body>
</html>
这个页面实际只包含了一个 id 为 message 的 div。我们会将服务器端 API 返回的结果放在这个 div 里。
我们将使用 jQuery Template 渲染页面，因此我们引入了 jQuery 和 jQuery Template；
同时 webapp/lib/panda.js 中包含了一些可以在客户端使用的便捷的函数。
Hello, World!
接下来我们就要正式地为我们伟大的 Hello, World! 应用编写代码了。
首先，我们需要在客户端 js 中向服务器端发起请求，并将结果显示在 ID 为 message 的 div 中。
webapp/js/hello.js
$(function(){
// 构造 request 对象
// 调用服务器端名称为 "hello.say" 的 API
var request = {
action: "hello.say"
};
// 发送请求
// 并将结果显示在 ID 为 message 的 div 中
panda.post(request, function(data) {
$("#message").html(data);
});
});
相应地，在服务器端需要编写 hello.say 的处理程序。
首先，需要在 scripts/app 目录下创建子目录 api 和 proxy。
这个时候，如果 web 应用正在运行，将会自动创建全局对象 api 和 proxy；
否则，将会在下次启动时创建。
引用
创建文件夹时自动创建全局对象，这是 0.0.2 版本新增的功能
我们暂时还不会在 proxy 目录下创建 js 文件，但需要在 api 目录下创建hello.js，
api.hello 是一个对象，实现了用于响应的客户端请求的方法：
scripts/app/api/hello.js
api.hello = {
say: function() {
return "Hello, World!";
}
};
在浏览器中输入
http://localhost/hello.html，就可以在左上角看到 Hello, World! 了。
引用
proxy 对象用于实现日志、权限控制、数据校验等需要拦截方法调用的功能
Hello, Panda!
光是让服务器端返回固定的结果，实在太单调了。
接下来，就让我们向服务器端传递一些参数吧。
首先，我们需要在构造 request 对象时增加参数：
$(function(){
// 在 request 对象中增加了参数 params
// 这个参数也可以是一个更复杂的 js 对象
var request = {
action: "hello.say",
params: { name: "Panda" }
};
panda.post(request, function(data) {
$("#message").html(data);
});
});
接着，我们需要修改服务器端 js，增加对参数的处理：
api.hello = {
// 增加参数 params
// 获取 params.name 并处理后返回
say: function(params) {
return "Hello, " + params.name + "!";
}
};
刷新页面，就可以在左上角看到 Hello, Panda! 了。
到此为止，一个简单的 hello, World! （以及 Hello, Panda!）应用就算完成了。
当然，直接在浏览器中输入 html 路径可能有点奇怪，我们在后面将看到如何用 page 对象处理页面请求。
不过，下一篇文章里，还是先让我们看一看文件上传与下载的相关内容吧。
分享到：
相关推荐
Python课程设计，含有代码注释，新手也可看懂。毕业设计、期末大作业、课程设计、高分必看，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。
Python课程设计，含有代码注释，新手也可看懂。毕业设计、期末大作业、课程设计、高分必看，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。
杂货产品检测43-YOLO（v5至v9）、CreateML、Paligemma、TFRecord、VOC数据集合集.rarIPCV分配-V6 2024-01-21 6:10 PM ============================= *与您的团队在计算机视觉项目上合作 *收集和组织图像 *了解和搜索非结构化图像数据 *注释，创建数据集 *导出，训练和部署计算机视觉模型 *使用主动学习随着时间的推移改善数据集 对于最先进的计算机视觉培训笔记本，您可以与此数据集一起使用 该数据集包括7012张图像。 家庭废物以createMl格式注释。 将以下预处理应用于每个图像： *像素数据的自动取向（带有Exif-Arientation剥离） *调整大小为640x640（拉伸） 没有应用图像增强技术。
Android 毕业设计，Android 毕业设计，小Android 程设计，含有代码注释，新手也可看懂。毕业设计、期末大作业、课程设计、高分必看，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。
1、资源项目源码均已通过严格测试验证，保证能够正常运行； 2、本项目仅用作交流学习参考，请切勿用于商业用途。
谁喜欢谁下载,没啥商业价值,comsol也能做,不过我这产量更大
Python课程设计，含有代码注释，新手也可看懂。毕业设计、期末大作业、课程设计、高分必看，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。
Android 毕业设计，Android 毕业设计，小Android 程设计，含有代码注释，新手也可看懂。毕业设计、期末大作业、课程设计、高分必看，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。
推箱子Python小游戏
该新媒体视域下的中国古诗词展演主要为管理员和用户两类用户角色提供需求，管理员在后台可以对系统进行全面管理，用户在前台可以进行查看系统信息，注册登录，查询校园失物，评论，下载校园失物等操作。 项目包含完整前后端源码和数据库文件 环境说明： 开发语言：Java 框架：ssm，mybatis JDK版本：JDK1.8 数据库：mysql 5.7 数据库工具：Navicat11 开发软件：eclipse/idea Maven包：Maven3.3 部署容器：tomcat7
内容概要：本文介绍了使用MATLAB实现PSO-BiLSTM-Attention粒子群优化双向长短期记忆神经网络融合注意力机制的多特征分类预测模型。通过PSO优化BiLSTM模型的超参数、引入注意力机制增强模型的特征提取能力，提升了多维度数据的分类精度。模型在金融风险预测、医疗健康预测、交通流量预测等多个领域具有广泛的应用前景。项目详细描述了模型架构、代码实现、训练与优化、模型评估与可视化、以及GUI界面设计等方面的内容。 适合人群：具备一定编程基础，工作1-3年的数据科学家和机器学习工程师。 使用场景及目标：① 金融、医疗、交通等领域的多特征分类预测任务；② 结合PSO优化BiLSTM超参数、引入注意力机制，提升模型预测准确度。 阅读建议：本文详细讲解了模型的理论背景、算法实现和应用案例，适合希望深入理解深度学习和优化算法的读者。建议结合代码和实际数据进行实验，以便更好地掌握模型的设计和优化过程。
Java项目-基于SSM的物资管理系统项目源码
Video_2024-12-18_000023.wmv
Python课程设计，含有代码注释，新手也可看懂。毕业设计、期末大作业、课程设计、高分必看，下载下来，简单部署，就可以使用。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。
系统实现： 用户功能模块：用户点击进入到系统操作界面，可以对主页、个人中心、我的收藏管理、订单管理等功能模块，我的收藏管理：通过列表可以获取用户ID、收藏ID、表名、收藏名称、收藏图片信息并进行修改操作 管理员功能模块：管理员通过用户名和密码填写完成后进行登录。管理员登录成功后进入到系统操作界面，可以对主页、个人中心、用户管理、商品分类管理、商品信息管理、系统管理、订单管理等功能模块进行相对应操作。 项目包含完整前后端源码和数据库文件 环境说明： 开发语言：Java 框架：ssm，mybatis JDK版本：JDK1.8 数据库：mysql 5.7 数据库工具：Navicat11 开发软件：eclipse/idea Maven包：Maven3.3 服务器：tomcat7
1、嵌入式物联网单片机项目开发实战。例程经过精心编写，简单好用。 2、代码使用KEIL 标准库开发，当前在STM32F103运行，如果是STM32F103其他型号芯片，依然适用，请自行更改KEIL芯片型号以及FLASH容量即可。 3、软件下载时，请注意keil选择项是jlink还是stlink。 4、有偿指导v：wulianjishu666; 5、如果接入其他传感器，请查看发布的其他资料。 6、单片机与模块的接线，在代码当中均有定义，请自行对照。 7、若硬件差异，请根据自身情况调整代码，程序仅供参考学习。 8、代码有注释说明，请耐心阅读。
项目包含完整前后端源码和数据库文件 环境说明： 开发语言：Java 框架：ssm，mybatis JDK版本：JDK1.8 数据库：mysql 5.7 数据库工具：Navicat11 开发软件：eclipse/idea Maven包：Maven3.3 部署容器：tomcat7
Java项目-基于SSM的网上淘书吧
内容概要：本文详细介绍了 Oracle 19c 中的闪回技术，包括闪回查询、闪回事务查询、闪回丢弃、闪回表、闪回数据库和闪回归档。具体讲解了每种闪回技术的原理、配置方法、操作步骤和限制条件，并提供了具体的实例和 SQL 命令。目的是帮助数据库管理员和开发人员理解和掌握如何利用这些技术来提高数据恢复和错误修复的能力，减少数据库管理的复杂性和风险。 适合人群：Oracle 数据库管理员、数据库开发人员及维护人员。 使用场景及目标：① 使用闪回技术快速恢复因误操作或其他错误导致的数据丢失；② 配置闪回技术以实现高效的数据库恢复；③ 在日常运维中监控和管理闪回操作。 其他说明：本文不仅提供了理论上的解释，还包含了实际操作的示例，以便读者能够更好地理解和应用这些技术。