当前位置: 首页 > news >正文

02.URL的基本知识和使用

一.认识 URL

1. 为什么要认识 URL ?

  • 虽然是后端给我的一个地址,但是哪部分标记的是服务器电脑,哪部分标记的是资源呢?所以为了和服务器有效沟通我们要认识一下

2. 什么是 URL ?

  • 统一资源定位符,简称网址,用于定位网络中的资源(资源指的是:网页,图片,数据,视频,音频等等)

3. URL 的组成?

  • 协议,域名,资源路径(URL 组成有很多部分,我们先掌握这3个重要的部分即可)

4. 什么是 http 协议 ?

  • 叫超文本传输协议,规定了浏览器和服务器传递数据的格式(而格式具体有哪些稍后我们就会学到)

5. 什么是域名 ?

  • 标记服务器在互联网当中的方位,网络中有很多服务器,你想访问哪一台,就需要知道它的域名才可以

6. 什么是资源路径 ?

  • 一个服务器内有多个资源,用于标识你要访问的资源具体的位置

二.URL 查询参数

1. 什么是查询参数 ?

  • 携带给服务器额外信息,让服务器返回我想要的某一部分数据而不是全部数据

  • 举例:查询河北省下属的城市列表,需要先把河北省传递给服务器

2. 查询参数的语法 ?

  • 在 url 网址后面用?拼接格式:http://xxxx.com/xxx/xxx?参数名1=值1&参数名2=值2
  • 参数名一般是后端规定的,值前端看情况传递即可

3. axios 如何携带查询参数?

  • 使用 params 选项即可

    axios({url: '目标资源地址',params: {参数名:}
    }).then(result => {// 对服务器返回的数据做后续处理
    })
    

    查询城市列表的 url地址:http://hmajax.itheima.net/api/city

    参数名:pname (值要携带省份名字)

4. 需求:获取“河北省”下属的城市列表,展示到页面,对应代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>查询参数</title>
</head>
<body><!-- 城市列表: http://hmajax.itheima.net/api/city参数名: pname值: 省份名字--><p></p><script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>axios({url: 'http://hmajax.itheima.net/api/city',// 查询参数params: {pname: '辽宁省'}}).then(result => {console.log(result.data.list)document.querySelector('p').innerHTML = result.data.list.join('<br>')})</script>
</body>
</html>

小结

1. URL 是什么?

 统一资源定位符,网址,用于访问服务器上资源

2. 请解释这个 URL,每个部分作用?

http://hmajax.itheima.net/api/news

协议://域名/资源路径

3. URL 查询参数有什么用?

浏览器提供给服务器额外信息,获取对应的数据

4. axios 要如何携带查询参数?

使用 params 选项,携带参数名和值在对象结构中

相关文章:

02.URL的基本知识和使用

一.认识 URL 1. 为什么要认识 URL ? 虽然是后端给我的一个地址&#xff0c;但是哪部分标记的是服务器电脑&#xff0c;哪部分标记的是资源呢&#xff1f;所以为了和服务器有效沟通我们要认识一下 2. 什么是 URL &#xff1f; 统一资源定位符&#xff0c;简称网址&#xff…...

人工智能指数报告2023

人工智能指数报告2023 主要要点第 1 章 研究与开发第 2 章 技术性能第 3 章 人工智能技术伦理第 4 章 经济第 5 章 教育第 6 章 政策与治理第 7 章 多样性第 8 章 舆论 人工智能指数是斯坦福大学以人为本的人工智能研究所&#xff08;HAI&#xff09;的一项独立倡议&#xff0c…...

Android如何对应用进行系统签名

一、使用命令 获取签名文件 从系统源码环境中获取签名相关文件&#xff1a; platform.x509.pem、platform.pk8 、signapk.jar platform.x509.pem、platform.pk8 位于 ../build/target/product/security 目录下。signapk.jar 位于 ../out/host/linux-x86/framework 目录下。 …...

【系统安全加固】Centos 设置禁用密码并打开密钥登录

文章目录 一&#xff0c;概述二&#xff0c;操作步骤1. 服务器端生成密钥2. 在服务器上安装公钥3.下载私钥到本地&#xff08;重要&#xff0c;否则后面无法登录&#xff09;4. 修改配置文件&#xff0c;禁用密码并打开密钥登录5. 重启sshd服务6. 配置xshell使用密钥登录 一&am…...

关于我在项目中封装的一些自定义指令

什么是指令 在Vue中提供了一套为数据驱动视图更为方便的操作&#xff0c;这些操作被称为指令系统。我们看到的v-来头的行内属性&#xff0c;都是指令&#xff0c;不同的指令可以完成或者实现不同的功能。 除了核心功能默认内置的指令&#xff08;v-model和v-show&#xff09;…...

react经验11:访问循环渲染的子组件内容

前有访问单个子组件的需求&#xff0c;现在进一步需要访问循环渲染中的子组件。 访问单个子组件的成员 实施步骤 子组件//child.tsx export declare type ChildInstance{childMethod:()>void } const Child(props:{value:stringonMounted?:(ref:ChildInstance)>void …...

Java开发工程师面试题(业务功能)

一、订单超时未支付自动关闭的几种实现方式。 定时任务扫描&#xff1a;在订单创建时&#xff0c;为订单创建一个定时任务&#xff0c;并设置一个超时时间。后端服务器会定期检查任务的创建时间是否超过了超时时间。如果是&#xff0c;则将订单设置为关闭状态。这种方案需要后…...

BUUCTF-Misc-百里挑一

题目链接&#xff1a;BUUCTF在线评测 (buuoj.cn) 下载附件打开是一个流量包文件&#xff1a; 全是在传图片时候的流量&#xff0c;先把图片保存出来文件–>导出对象–>HTTP–>保存到一个文件夹 然后使用kali下的exiftool找到了一半flag exiftool *|grep flag 另外一半…...

【力扣刷题练习】42. 接雨水

题目描述&#xff1a; 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图&#xff0c;计算按此排列的柱子&#xff0c;下雨之后能接多少雨水。 题目解答&#xff1a; class Solution {public int trap(int[] height) {int n height.length;int ans 0;if (n < 3)return…...

鸿蒙实战开发:数据交互【RPC连接】

概述 本示例展示了同一设备中前后台的数据交互&#xff0c;用户前台选择相应的商品与数目&#xff0c;后台计算出结果&#xff0c;回传给前台展示。 样例展示 基础信息 RPC连接 介绍 本示例使用[ohos.rpc]相关接口&#xff0c;实现了一个前台选择商品和数目&#xff0c;后台…...

QLC SSD:LDPC纠错算法的优化方案

随着NAND TLC和QLC出现,LDPC也在不断的优化研究,提升纠错能力。小编看到有一篇来自Microchip发布的比较详细的LDPC研究数据,根据自己的理解分析解读给大家,如有错误,请留言指正! 文档中测试LDPC(Low-Density Parity-Check)码是为了评估其在不同配置下对数据错误的有效…...

【Flutter 面试题】main()和runApp()函数在Flutter的作用分别是什么?有什么关系吗?

【Flutter 面试题】main()和runApp()函数在Flutter的作用分别是什么&#xff1f;有什么关系吗&#xff1f; 文章目录 写在前面解答补充说明 写在前面 关于我 &#xff0c;小雨青年 &#x1f449; CSDN博客专家&#xff0c;GitChat专栏作者&#xff0c;阿里云社区专家博主&…...

ChatGPT高效提问——说明提示技巧

ChatGPT高效提问——说明提示技巧 现在&#xff0c;让我们开始体验“说明提示技巧”&#xff08;IPT, Instructions Prompt Technique&#xff09;和如何用它生成来自ChatGPT的高质量的文本。说明提示技巧是一个通过向ChatGPT提供需要依据的具体的模型的说明来指导ChatGPT输出…...

从零学算法41

41.给你一个未排序的整数数组 nums &#xff0c;请你找出其中没有出现的最小的正整数。 请你实现时间复杂度为 O(n) 并且只使用常数级别额外空间的解决方案。 示例 1&#xff1a; 输入&#xff1a;nums [1,2,0] 输出&#xff1a;3 示例 2&#xff1a; 输入&#xff1a;nums […...

FPGA高端项目:FPGA基于GS2971的SDI视频接收+OSD动态字符叠加,提供1套工程源码和技术支持

目录 1、前言免责声明 2、相关方案推荐本博已有的 SDI 编解码方案本方案的SDI接收转HDMI输出应用本方案的SDI接收图像缩放应用本方案的SDI接收纯verilog图像缩放纯verilog多路视频拼接应用本方案的SDI接收HLS图像缩放HLS多路视频拼接应用本方案的SDI接收HLS多路视频融合叠加应用…...

UML-类图详解

UML中基本概念说明 UML类图中关系连接线说明 ​ UML类图说明 号表示public、-表示表示private、#表示protected ​ UML类关系详解 泛化&#xff08;Generalization&#xff09;关系 简单的讲就是类之间的继承关系。在UML中&#xff0c;泛化关系用空心三角形实线来表示&…...

Python 快速获取PDF文件的页数

有时在处理或打印一个PDF文档之前&#xff0c;你可能需要先知道该文档包含多少页。虽然我们可以使用Adobe Acrobat这样的工具来查看页数&#xff0c;但对于程序员来说&#xff0c;编写脚本来完成这项工作会更加高效。本文就介绍一个使用Python快速获取PDF文件页数的办法。 安装…...

uniapp开发小程序使用x-www-form-urlencoded; charset=UTF-8 编码格式请求案例

使用x-www-form-urlencoded&#xff0c;header要放在前面&#xff0c;第一行位置。 uni.request({ header: { content-type: application/x-www-form-urlencoded; charsetUTF-8},url: ,method:POST, //请求方式POST\GETdata:that.loginData,success: funct…...

酷开科技服务升级,酷开系统给消费者更好的使用体验!

看电视的时候你是不是也会有选择困难症&#xff1f;不知道要看哪个&#xff1f;不知道如何操作&#xff1f;体验不够顺畅&#xff1f;现在&#xff0c;有了酷开系统9.2&#xff0c;这些通通不再是问题&#xff01;酷开科技&#xff0c;一直致力于服务升级&#xff0c;给消费者更…...

【leetcode热题】单词拆分

难度&#xff1a; 中等通过率&#xff1a; 33.7%题目链接&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 题目描述 给定一个非空字符串 s 和一个包含非空单词列表的字典 wordDict&#xff0c;判定 s 是否可以被空格拆分为一个或多个在字典中出现的单词。 说明&#…...

5分钟部署清华TurboDiffusion,视频生成加速100倍,小白也能玩转AI视频

5分钟部署清华TurboDiffusion&#xff0c;视频生成加速100倍&#xff0c;小白也能玩转AI视频 1. TurboDiffusion技术背景与核心价值 1.1 技术发展历程 TurboDiffusion是由清华大学等机构联合推出的视频生成加速框架。该框架解决了传统扩散模型在视频生成过程中存在的计算效率…...

Qwen3-ASR-1.7B多说话人分离展示:会议录音自动分角色

Qwen3-ASR-1.7B多说话人分离展示&#xff1a;会议录音自动分角色 会议记录不再需要人工分辨谁说了什么&#xff0c;AI现在能帮你自动区分每个发言人 1. 引言 想象一下这样的场景&#xff1a;一场两小时的多人会议刚刚结束&#xff0c;你需要整理会议纪要。传统的做法是反复听录…...

Pixel Mind Decoder 本地开发环境搭建:使用PyCharm进行调试与开发

Pixel Mind Decoder 本地开发环境搭建&#xff1a;使用PyCharm进行调试与开发 1. 准备工作与环境配置 在开始使用PyCharm进行Pixel Mind Decoder的开发之前&#xff0c;我们需要先完成一些基础准备工作。这部分内容将帮助你快速搭建起开发环境&#xff0c;为后续的调试和开发…...

构建语音驱动的智能Agent:集成SenseVoice-Small与AI决策框架

构建语音驱动的智能Agent&#xff1a;集成SenseVoice-Small与AI决策框架 你有没有想过&#xff0c;对着电脑说句话&#xff0c;它就能帮你写代码、查资料、甚至控制智能家居&#xff1f;这听起来像是科幻电影里的场景&#xff0c;但现在&#xff0c;通过将强大的语音识别模型与…...

nlp_structbert_sentence-similarity_chinese-large一键部署教程:Python环境快速配置指南

nlp_structbert_sentence-similarity_chinese-large一键部署教程&#xff1a;Python环境快速配置指南 想快速上手一个强大的中文文本相似度计算模型吗&#xff1f;今天咱们就来聊聊怎么在星图GPU平台上&#xff0c;用最简单的方式把 nlp_structbert_sentence-similarity_chine…...

网盘直链解析技术指南:突破下载限制的高效解决方案

网盘直链解析技术指南&#xff1a;突破下载限制的高效解决方案 【免费下载链接】Online-disk-direct-link-download-assistant 可以获取网盘文件真实下载地址。基于【网盘直链下载助手】修改&#xff08;改自6.1.4版本&#xff09; &#xff0c;自用&#xff0c;去推广&#xf…...

SenseVoice-Small模型在.NET生态中的集成实践

SenseVoice-Small模型在.NET生态中的集成实践 1. 项目背景与价值 语音识别技术正在快速融入各种应用场景&#xff0c;从智能客服到会议转录&#xff0c;从语音助手到内容创作&#xff0c;处处都能看到它的身影。对于.NET开发者来说&#xff0c;如何在熟悉的生态中集成高质量的…...

UG/NX Block UI Styler字符串控件避坑指南:常见问题与解决方案

UG/NX Block UI Styler字符串控件避坑指南&#xff1a;常见问题与解决方案 在UG/NX二次开发中&#xff0c;Block UI Styler作为可视化对话框设计工具&#xff0c;其字符串控件&#xff08;String Control&#xff09;是使用频率最高的交互元素之一。无论是参数输入、状态显示还…...

云效Codeup代码评审功能深度体验:如何用它提升团队代码质量(附真实项目案例)

云效Codeup代码评审实战指南&#xff1a;从规范制定到CI/CD集成 在当今快节奏的软件开发环境中&#xff0c;代码质量直接决定了产品的稳定性和可维护性。作为技术负责人&#xff0c;我经历过无数次因代码质量问题导致的深夜加班和紧急修复。直到团队开始系统化使用云效Codeup的…...

别再手动改MTL文件了!一个Python脚本搞定ENVI打开Landsat 8/9 L2影像的报错问题

用Python自动化修复Landsat L2影像的ENVI兼容性问题 遥感数据处理中&#xff0c;Landsat 8/9的L2级别影像在ENVI软件中打开时经常遇到兼容性问题。传统的手动修改MTL文件方法不仅效率低下&#xff0c;还容易出错。本文将介绍一个Python自动化解决方案&#xff0c;帮助您彻底摆脱…...