目标:
1、建立浏览器端的HTML
2、通过浏览器和后端完成数据交互
通过浏览器向后端写入数据(这里演示用POST方式)
通过浏览器向后端请求数据,(这里演示用GET方式)并显示在浏览器上
步骤如下:
1、把笔记一的工程名称更改为test2
2、新建一个文件夹命名为Public(名称随意)
在该文件夹下新建一个HTML文件,命名为index.html(名称随意)内容如下:
因为使用到jquery,在该文件夹下新建一个名称为js的文件夹,将jquery-1.11.0.min.js放在该文件夹下面
将建好的Public目录加入工程:
右键单击web服务:web-test——选择:添加公共内容文件夹…
弹出框选择刚才建好的Public文件夹,单击按钮:选择文件夹
添加好的目录结构如下
通过浏览器向后端写入数据的实现,使用上次项目的test.vi,为了便于区分,将test.vi重新命名为testw.vi,并更改为Post方式
通过浏览器向后端请求数据对应的VI服务,增加一个testr.vi文件,方式为GET
目录结构如下:
文件testw.vi的内容不变
打开文件testr.vi
在前面板新建三个字符串显示控件,并按照上一笔记方法,将三个控件Public化,对外输出连接,如下图:
将三个控件的返回数据进行赋值,并按照上一笔记对数据进行固化(否则返回的全是空字符串),如下图:
目前所有的开发工作已经完成,启动项目调试(方法和上一笔记相同)
查看一下index.html的URL地址:
复制URL网址,打开浏览器,将URL粘贴到导航,回车访问
访问结果如下:
测试通过浏览器向后端写入数据(用POST方式)
浏览器前端写入数据和接收的返回数据如下
测试通过浏览器向后端写入数据(用POST方式)
后端接收数据如下:
测试结果:达到预期目标
测试通过浏览器向后端请求数据,(这里演示用GET方式)并显示在浏览器上
后端返回的数据如下:
测试通过浏览器向后端请求数据,(这里演示用GET方式)并显示在浏览器上
前端接收的数据并显示在浏览器如下:
测试结果:达到预期目标