Vue学习笔记(7. axios异步请求)

news2024/12/23 14:12:33

1. axios请求方式

方式1:axios({method:"GET",url:"..."})

方式2:axios({method:"POST",url:"...",data:"..."})

方式3:axios.get("url...")

方式4:axios.post("url...","data...")

2. 安装axios

命令:npm install axios

3. 安装querystring

命令:npm install querystring,

注释:post请求提交数据用

4. 解决跨域访问

vue2.x和vue3.x的vue-cli项目解决案(在文件vue.config.js中追加下记代码)

 vue3.2的vite项目解决案(在文件vite.config.ts中追加下记代码)

5. 创建一个后端项目

用于测试处理的ajax请求

package releaseTest.controller;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import releaseTest.entity.User;


/**
 * Servlet implementation class AxiosTest
 */
@WebServlet("/AxiosTest")
public class AxiosTest extends HttpServlet {
	private static final long serialVersionUID = 1L;

    /**
     * Default constructor. 
     */
    public AxiosTest() {
    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setCharacterEncoding("utf-8");
		String id = request.getParameter("id");
		PrintWriter writer = response.getWriter();
		writer.write("{name:'张三'");
		writer.write(",id:"+id);
		writer.write(",age:18}");
		writer.flush();
		writer.close();
		
	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		String type = request.getParameter("type");
		String name = request.getParameter("name");
		String age = request.getParameter("age");

		System.out.println("type:"+type);
		System.out.println("name:"+name);
		System.out.println("age:"+age);
		
		PrintWriter writer = response.getWriter();
		writer.write("{status:'200'");
		if("1".equals(type)) {
			writer.write(",msg:'ajax普通方案'}");
		} else {
			writer.write(",msg:'ajax快捷方案'}");
		}
		writer.flush();
		writer.close();
	}

}

6. axios的4种请求方式

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/425600.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Python中的35个关键字

✅作者简介:CSDN内容合伙人、阿里云专家博主、51CTO专家博主、新星计划第三季python赛道Top1🏆 📃个人主页:hacker707的csdn博客 🔥系列专栏:零基础入门篇 💬个人格言:不断的翻越一座…

【 Spring MVC 核心功能(二) - 获取参数(下)】

文章目录一、使用 RequestBody 接收JSON对象二、使用 RequestPart 上传⽂件三、获取 Cookie四、获取 Header五、存储和获取 Session5.1 存储 Session5.2 获取 Session一、使用 RequestBody 接收JSON对象 有时客户端会通过 post 方式发送 json 格式的请求,那后端就可…

2.3.5双链表

单链表vs双链表 就是既有前驱指针也有后继指针,由line改为double。 双链表的插入怎么实现? s->nextp->next; p->next->priors s->priorp //把p赋给s的前驱指针指向的位置 p->nexts; 如果p刚好是最后一个元素。 p->next->prio…

基于ArcGIS的电子地图矢量化方法

一、电子地图及纸质地图矢量化的目的 地图数据来源有很多,其中栅格数据数字化是地图数据的重要来源。栅格数据的矢量化包括地理配准以及矢量化。矢量化后的地图数据往往可以为我们的空间统计分析提供实验依据,从而探究地理分布的时空差异性。 空间参考&a…

完整指南:如何安装Man手册

Man手册简介 man手册是Unix和类Unix操作系统中的命令行工具,用于提供关于特定命令、函数和文件的帮助文档。它通常包含命令的语法、选项、参数、示例以及其他相关信息。man手册可以通过在终端输入"man"命令,后跟要查看的命令或函数名称来访问…

huggingface transformer模型介绍

总结: 模型提高性能:新的目标函数,mask策略等一系列tricks Transformer 模型系列 自从2017,原始Transformer模型激励了大量新的模型,不止NLP任务,还包括预测蛋白质结构,时间序列预测。 有些模…

灌区流量监测设备-中小灌区节水改造

系统概述 灌区信息化管理系统主要对对灌区的水情、雨情、土壤墒情、气象等信息进行监测,对重点区域进行视频监控,同时对泵站、闸门进行远程控制,实现了信息的测量、统计、分析、控制、调度等功能。为灌区管理部门科学决策提供了依据&#xf…

Python 无监督学习实用指南:6~10

原文:Hands-on unsupervised learning with Python 协议:CC BY-NC-SA 4.0 译者:飞龙 本文来自【ApacheCN 深度学习 译文集】,采用译后编辑(MTPE)流程来尽可能提升效率。 不要担心自己的形象,只关…

23年5月高项学习笔记12 —— 干系人管理

过程: 1. 识别干系人:定期识别干系人,分析和记录他们的利益,参与度、相互依赖性、影响力和对项目的潜在的影响 输入:立项管理文件、沟通管理计划、干系人参与计划、需求文件、变更日志、问题日志、协议(协…

今天给大家介绍一篇基于springboot的医院管理系统的设计与实现

临近学期结束,你还在做java程序网络编程,期末作业,老师的作业要求觉得大了吗?不知道毕业设计该怎么办?网页功能的数量是否太多?没有合适的类型或系统?等等。这里根据疫情当下,你想解决的问题,今天给大家介绍一篇基…

2023/4/10总结

线段树 线段树是一种二叉树,通俗易懂的来说就是对于一个线段,我们会用一个二叉树来表示。线段树是一种工具,她能把对区间(线段)的修改与维护从0(N)的时间复杂度变成0(logN)。 如图: 如上图,我…

MYSQL SQL语句优化技术技巧

MySQL是一种流行的关系型数据库管理系统,它提供了各种各样的SQL语句优化技术,下面是一些常见的优化技巧: 1. 使用索引 索引可以大大提高查询性能。在MySQL中,可以使用CREATE INDEX语句在列上创建索引。当查询包含WHERE子句并且…

Google SEO 搜索中心

在公司发展还没有那么成熟的时候,也许你的测试网站是外网可以公开访问的,也许你网站中的机密图片在测试环境(不小心上到正式环境)却被搜索引擎无情抓取,以及有些内部用户才能使用的网址,你并不想被搜索引擎…

明着呼吁暂停,暗着囤积GPU,马斯克暗度陈仓玩得溜

众所周知,此前马斯克纠集了上千名科技工作者对生成式人工智能的深度训练表示了质疑,呼吁暂停继续对深度人工智能的训练,哪怕先暂停六个月。呼吁的尘埃还没有彻底落地,就传出了马斯克已经悄悄地囤积了上万枚GPU,构建自己…

《花雕学AI》15:BingGPT桌面端——尝鲜体验ChatGPT4.0同源技术新Bing的最新成果

引言: 本文将介绍 BingGPT桌面端的开发背景和目的,以及它与新 Bing 的关系和区别。本文还将说明BingGPT桌面端的主要功能和特点,以及如何下载、安装和使用。最后,本文将评价 BingGPT桌面端对于新 Bing 的人工智能聊天功能的推广和…

dolphinscheduler资源中心

资源中心 资源中心介绍 资源中心提供文件管理,UDF管理,任务组管理。 文件管理可以访问要执行的hive的sql文件 UDF管理可以放置fllink执行的自定义udf函数jar包,hive自定义的UDF函数jar包 以上的*.sql,*.jar文件可以理解为资源&#xff0c…

三本小书的前言

所有的事情既是好事也是坏事,人工智能也不例外;所有的事情既是坏事也是好事,人类智慧也不例外。《追问人工智能:从剑桥到北京》前 言一个地方不在大小,关键看有无灵气,剑桥就是这样一个神奇的地方&#xff…

第三章_Redis的十大数据类型

which 10 官网:https://redis.io/docs/data-types/ 一图说明 提前声明 这里说的数据类型是value的数据类型,key的类型都是字符串 十大数据类型分别是 redis字符串(String) String(字符串)。 string是…

USRP B210同步采集

MIMO Multiple Input Multiple Output的缩写,通过多只天线同时进行收发,增加无线网络基地台的涵盖范围。 MIMO(多输入多输出)是一项关键的无线技术,它可以将一个传输信号分割成多个流,而这些流则分散地传…

Uni-APP iOS环境打自定义调试基座

一、准备工作 主要操作步骤参考官方文档:https://ask.dcloud.net.cn/article/152 有少量区别。 准备好苹果开发者账号(过程略)。 二、创建 App IDs 进入网址:https://developer.apple.com/account/resources/identifiers/lis…