【Vue】jsonp 在 Vue 中的使用

刺骨的言语ヽ痛彻心扉 2023-02-13 03:17 2阅读 0赞

### 本期内容 ###

在前端访问后端数据的时候经常会出现跨域问题，jsonp 便是其中一种解决的方式，前提是接口能够支持 jsonp 的访问。

**目录**

1、安装

2、添加到 main.js 中

3、按如下语法使用

4、以访问百度鹰眼轨迹 API 为例，发起 Get 请求

--------------------

## 1、安装 ##

npm install vue-jsonp --save

## 2、添加到 main.js 中 ##

import VueJsonp from 'vue-jsonp'
    Vue.use(VueJsonp)

## 3、按如下语法使用 ##

var jsonParams={
        paramsA : ...
    }
    this.$jsonp('url',jsonParams).then(res => {
      ...
    })

## 4、以访问百度鹰眼轨迹 API 为例，发起 Get 请求 ##

以下请求仅展示，具体需求请参考 [百度鹰眼轨迹API][API]

// 获取轨迹信息
        getTrackInfo () {
          var params = {
            ak: '...',
            service_id: '...',
            entity_name: '...',
            start_time: ...,
            end_time: ...,
            dataType: 'jsonp'
          }
          this.$jsonp('http://yingyan.baidu.com/api/v3/track/gettrack', params).then(res => {
            console.log('res',res)
          }).catch(err => {
            console.log('err', err)
          })
        },

[API]: http://lbsyun.baidu.com/index.php?title=yingyan/guide/webmanager

发表评论取消回复

表情：

评论列表（有 0 条评论，2人围观）

还没有评论，来说两句吧...

相关阅读

相关 echarts在vue中的使用

1.使用npm安装依赖包 npm install echarts -S 或者使用淘宝的镜像 npm install -g cnpm --registry=[htt

梦里梦外;/ 2023年06月23日 08:57/ 0 赞/ 37 阅读

相关【Vue】jsonp 在 Vue 中的使用

本期内容在前端访问后端数据的时候经常会出现跨域问题，jsonp 便是其中一种解决的方式，前提是接口能够支持 jsonp 的访问。目录 1、安装 2、添加到 ma

刺骨的言语ヽ痛彻心扉/ 2023年02月13日 03:17/ 0 赞/ 3 阅读

相关在Vue中使用echarts

安装echarts依赖 npm install echarts -S 或者使用淘宝的镜像 npm install -g cnpm --regist

绝地灬酷狼/ 2022年12月27日 08:49/ 0 赞/ 270 阅读

相关在Vue中使用Echarts

前端可视化是一个前端最基本的技能，要想做的好看，还是得借助一下百度家的echarts，那要怎么在Vue中使用echarts？这个官网没有给出实例，实例基本都是在jquery里面

素颜马尾好姑娘i/ 2022年12月20日 01:28/ 0 赞/ 274 阅读

相关 echarts在vue中的使用

安装：cmd进入项目根文件夹 cnpm install echarts --save main.js中全局引入： import echarts from 'echarts'

谁借莪１个温暖的怀抱￠/ 2022年05月28日 09:49/ 0 赞/ 270 阅读

相关在Vue中使用Sass

Sass 是什么？ Sass又称SCSS，它是CSS预处理之一。它在CSS语法的基础上增加了变量、嵌套、混合宏、继承、占位符等等高级功能。那什么是CSS预处理器呢

柔光的暖阳◎/ 2022年01月07日 05:25/ 0 赞/ 397 阅读

相关在vue中使用koa

0.安装Node ,安装完成后可用以下命令查看是否完成安装。查看node版本： node -v 1.搭建环境新建文件夹 koa2，并初始化。初始化完成生

约定不等于承诺〃/ 2021年08月19日 21:36/ 0 赞/ 601 阅读

相关在vue中使用echarts

1. 直接引入echarts npm install echarts –save 1. 全局引入在 main.js 中全局引入 echarts

刺骨的言语ヽ痛彻心扉/ 2021年07月25日 16:13/ 0 赞/ 540 阅读

相关在vue中使用highcharts

安装 highcharts cnpm i highcharts -S charts.vue <template> <div class="x-

àì夳堔傛蜴生んèń/ 2021年07月25日 12:12/ 0 赞/ 730 阅读

相关 axios在vue中的使用

目录一视频二教程三源码四服务端代码结构 1 接口文档.xlsx 2 router.js 五启动并测试服务端六安装yarn 七安装van

我就是我/ 2021年07月24日 22:30/ 0 赞/ 542 阅读