首页 > 其他分享 >Vue3+vite+axios+.net api 配置

Vue3+vite+axios+.net api 配置

时间:2024-08-12 15:17:05浏览次数:12  
标签:aa axios http +. id api public

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
  server: {
    host: "0.0.0.0",
    open: true, //启动项目自动弹出浏览器
    port: "3000",
    proxy: {
      "/api": {
        target: "http://localhost:5186",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""), // 不可以省略rewrite
      },
    },
  },
});

vite.config.js 配置

import axios from "axios";
const http = axios.create({
  baseURL: "/api",
  timeout: 10000, // 请求超时时间
});
const params = {
  id: 123,
};
const aa = {
  myProperty: "23232",
};
http.post("/api/Values", aa);
http.get("/api/Values", { params });

vue

 [Route("api/[controller]")]
 [ApiController]
 public class ValuesController : ControllerBase
 {
    
     // GET api/<ValuesController>/5
     [HttpPost]
     public string dssss([FromBody] aa id)
     {
         return id.MyProperty;
     }
     [HttpGet]
     public string sdsd(string id)
     {
         return id;
     }

     public class aa
     {
         public string MyProperty { get; set; }
     }

     
 }

接口代码

标签:aa,axios,http,+.,id,api,public
From: https://www.cnblogs.com/zongcheng86/p/18355023

相关文章

  • 【Rust光年纪】Rust数据结构库全方位解析:从核心功能到API概览
    提升Rust项目效率的利器:六款优秀数据结构库详解前言随着Rust编程语言的不断发展和普及,开发者们对于高效的数据结构库需求日益增长。在本文中,我们将介绍一些优秀的Rust数据结构库,它们分别为heapless、arrayvec、smallvec、evmap、hashbrown和generic-array。这些库提供了各......
  • Vue.js 项目中集成高德地图 API
    要在Vue.js项目中集成高德地图API,你可以按照以下步骤操作:###第一步:引入高德地图API首先,你需要在你的Vue项目中引入高德地图的JSAPI。可以通过在HTML文件中直接引入CDN链接或者使用npm安装的方式。####通过CDN引入:在`public/index.html`文件中的`<head......
  • Vue 3 Composition API:构建可复用逻辑的艺术
    Vue3引入了CompositionAPI,这是一种新的组件选项,允许开发者更灵活地组织组件逻辑。使用CompositionAPI,我们可以将组件逻辑分解为可复用的函数,从而提高代码的模块化和可维护性。本文将详细介绍如何使用Vue3的CompositionAPI创建可复用的逻辑。一、CompositionAP......
  • 文件IO常用api
    文件IO常用api打开/关闭文件fopen该api用于打开指定的文件FILE*fopen(constchar*__restrict__filename,constchar*__restrict__modes)constchar*__restrict__filename:表示要打开的文件和路径constchar*__restrict__modes:表示要访问模式return:结构体指针表示......
  • 使用API Monitor探测QQ安装包在创建桌面快捷方式时都调用了哪些API及COM接口,去解决C++
    目录1、通过代码制作安装包程序,不再使用专用的打包工具2、问题说明3、为啥路径中包含环境变量%ProgramFiles%会报找不到路径呢?4、使用APIMonitor监测QQ安装包在创建桌面快捷方式时都调用哪些COM组件的接口5、同时勾选IShelllinkDatalist接口类的接口,重新开启监测6、最后......
  • 调用百度api的情绪分析网站(Flask+HTML)搭建(附超详细代码)
      概要:本文调用多个api接口来进行不同类型(数据文件)情绪分析处理,并利用flask框架与前端联调将自己的情绪分析项目部署到服务器端。。实现下图功能。(第一篇文章小小记录下,要是有帮助就点个赞叭)一.免费申请百度api并调用首先在百度智能云中申请免费的自然语言处理api选......
  • Android studio报错 Caused by: org.gradle.api.internal.plugins.PluginApplicationE
    Androidstudio报错Causedby:org.gradle.api.internal.plugins.PluginApplicationExceptionAndroidstudio运行报错:Causedby:org.gradle.api.internal.plugins.PluginApplicationException:Failedtoapplyplugin[id‘com.android.application’]解决方法:在项......
  • OpenAI API: How do I handle errors in Python?
    题意:在使用OpenAIAPI进行Python开发时,怎样处理错误?问题背景:Itriedusingthebelowcode,buttheOpenAIAPIdoesn'thavethe AuthenticationError methodinthelibrary.HowcanIeffectivelyhandlesucherror.我尝试使用下面的代码,但是OpenAIAPI的库中并没......
  • API安全与等保测评:接口安全测试技术与工具选择
    关键技术点:1.认证与授权:检查API是否实施了强大的身份验证机制,如OAuth2.0、JWT,并验证授权逻辑是否严谨。2.输入验证:测试API对用户输入的处理,确保有效防止SQL注入、跨站脚本(XSS)等攻击。3.数据加密:评估传输层安全(TLS)配置以及敏感数据在存储和传输时的加密策略。4.速率限......
  • swagger-api生成接口文档
    引入swagger-api生成接口文档1.引入pom依赖<!--swagger2依赖--><dependency><groupId>io.springfox</groupId><artifactId>springfox-swagger2</artifactId><version>2.9.2</version&......