5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传

目录

知识点

form表单的属性

js前端验证————>

upload.php

文件上传html

——引入了一个JS

js验证(可以直接看到原代码)

php(后端)验证————>

上传-html

file_up.php

浏览器禁用JS代码

ajax(Web数据交互方式)

ajax验证—————>

login.html

ajax.php

绕过

如何发现ajax?

两种验证

设计-购物*

user.php--购买页面

shop.php--验证

小结:

写网站:



知识点

1-js前端验证-文件上传

2-js-Ajax传递-登录-状态

3-JS-Ajax传递-购物-参数


5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第1张图片


form表单的属性

标签用来采集数据,标签的属性则是用来规定如何把采集到的数据发送到服务器

form表单-CSDN博客

属性 描述
action URL地址 规定当提交表单时,向何处发送表单数据
method get或post 规定以何种方式把表单数据提交到 action URL
enctype multipart/form-data text/plain application/x-www-form-urlencoded 规定在发送表单数据之前如何对其进行编码
target (四个的值的前面都有一个下划线) blank self parent top framename 规定在何处打开 action URL


js前端验证————>

upload.php

文件上传html

   
   

——引入了一个JS

js验证(可以直接看到原代码)


php(后端)验证————>

上传-html

文件上传

   

   

file_up.php

";
echo $file_type."
"; echo $file_size."
"; echo $file_tmpname."
"; echo $file_error."
"; ​ if (@$file_error>0){    echo '上传出错!'; } else{    move_uploaded_file(@$_FILES["upload"]["tmp_name"], "../upload/" . @$_FILES["upload"]["name"]);    echo "文件存储在: " . "upload/" . @$_FILES["upload"]["name"]; } ?>


浏览器禁用JS代码

————右键-检查-找三个点-设置,.........

需要启用Javascript

Google Chrome(谷歌浏览器)
​
    点击浏览器工具栏上的Chrome菜单图标 。
    选择设置。
    在“设置”页面上,点击显示高级设置…链接。
    在“隐私设置”部分中,点击内容设置…
    在“JavaScript”部分中,选中允许所有网站运行JavaScript(推荐)。
    点击完成。
​
Firefox(火狐浏览器)
​
    检查浏览器是否运行了拦截 JavaScript 的扩展件。Firefox默认启用 JavaScript,通常您只能通过运行扩展件来禁用。
    检查 Firefox 高级设置。在 Firefox 的配置文件中,有一个不易察觉的选项可启用或禁用 JavaScript。
    如要查看您是否意外禁用了该选项,可在 Firefox 地址栏中输入 about:config 并按回车键。
    阅读警告消息并单击“我保证会小心”按钮。更改这些文件和设置可能会导致您的 Firefox 无法使用。
    在页面顶部的搜索栏中,输入 javascript.enabled 并按回键。
    javascript.enabled 的值应为 true。如果显示为“false”,则在该条目上单击右键,并选择“切换”。
    重启 Firefox 并尝试载入含有 JavaScript 的页面。
    如果其他所有方法失败,则请卸载和重新安装 Firefox 以恢复所有默认设置。
​
IE浏览器
​
    单击右上角的齿轮图标。从出现的菜单中选择“Internet 选项”。
    单击“安全”选项卡。单击窗口底部的“自定义级别”按钮,弹出“安全设置”对话框。
    找到“脚本”目录。单击“JAVA 小程序”下的“启用”选项,选择此选项后将允许 Internet Explorer 在页面上显示 JavaScript 元素。
    两次单击“确定”按钮关闭窗口。单击“刷新”按钮,用新设置重新载入网页。
​
Opera浏览器
​
    单击 Opera 菜单。在“设置”选项上方悬停鼠标。如找不到 Opera 菜单,只看到传统菜单栏,则单击“工具”。
    在“快速偏好”上方悬停鼠标。勾选名为“启用 JavaScript”的复选框。
    刷新当前网页。这将载入您的新设置。
​
Safari浏览器
​
    单击 Safari 菜单。选择“偏好”,然后单击“安全”选项卡。
    确保“启用 JavaScript”选项已勾选。如未勾选复选框,则 JavaScript 在网页上不载入。
    在 iOS 设备上启用 Java。点击“设置”图标,向下滚动至 Safari 部分。点击“高级”,然后将 JavaScript 选项切换到“开启”
​


ajax(Web数据交互方式)

引用框架(封装好了代码)——引入一个JS文件

ajax不需要传到后台。

--js的一种吧。

ajax验证—————>

login.html




    
    Ajax登录


帐号:
密码:

ajax.php

——这里正常情况下要连接数据库取值的。

'ok');
if($username=='jinhui' && $password=='1'){//这里可考虑连接数据库。
    $success['infoCode'] = 1;
}else{
    $success['infoCode'] = 0;
}
echo json_encode($success);
​
?>

绕过

抓包——右键-接受数据服务器返回来的数据包——修改一下

登录错误:

5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第2张图片

——————————————

——这样,只提示一个成功登录,————洞洞!!!

5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第3张图片

————在ajax.php中写成功登录(由php控制)————GG

————要看逻辑————

如何发现ajax?

直接看源代码

——有的会用包含文件,封装了。——

————看仔细点,点开引用的JS文件!!!


两种验证

——对文件上传的后缀名进行验证,符合需求的才能上传

——这个功能的实现可以由JS或PHP实现

——两种验证的区别:

PHP:验证的代码看不到,只能进行黑盒测试 ——后端,服务器

JS:--可以看到---白盒测试 ————前端,浏览器——浏览器可忽略(不用)js代码。

#数据的验证不止后端可以,前端也可以。

php将代码的所有结果给你,

请求——返回——返回结果(服务器不会理你,你就自我安慰吧)

js ajax 用浏览器来处理,

请求——返回——读取返回的数据——js ajax 代码进行解析——结果


设计-购物*

以前端设计价格为准

user.php--购买页面




    
    购买设计1





价格:8888
数量:

shop.php--验证

'ok');
$price=$_POST['price'];
$num=$_POST['number'];
$m=$price*$num;

if($m<10000){
    $success['code']=1;
}else{
    $success['code']=0;
}
echo json_encode($success);
?>

5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第4张图片

5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第5张图片

————抓包——改返回的数据,价格,服务器返回的数据状态值。

#注意是谁处理的那个数据。


GG还有(user1,shop1)(user2,shop2)​

——————只接受数据库的值--给数据写死, 数量,价格

——接收数据库的(注意代码顺序)

--先执行表单,才有数据的接收

5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第6张图片

——data里面的price可以修改,——

5.php开发-个人博客项目&JS-Ajax&前端逻辑&购物&登录&上传_第7张图片


小结:

修改 :状态值,数量,价格,(数据库有无的案例)

--状态值发现技巧:数据包的返回值有json类型格式 json code msgbox code data

写网站:

用框架:vue ,node.js


你可能感兴趣的:(php开发基础,php,开发语言,前端,网络安全,javascript,ajax,后端)