当前位置: 首页 > 编程笔记 >

vue下跨域设置的相关介绍

周飞语
2023-03-14
本文向大家介绍vue下跨域设置的相关介绍,包括了vue下跨域设置的相关介绍的使用技巧和注意事项,需要的朋友参考一下

本文介绍了vue下跨域设置的相关介绍,分享给大家,具体如下:

1、在使用vue开发的时候经常要涉及到跨域的问题,其实在vue cli中是有我们设置跨域请求的文件的。

2、当跨域无法请求的时候我们可以修改工程下config文件夹下的index.js中的dev:{}部分。

dev: {

  env: require('./dev.env'),
  port: 8080,
  autoOpenBrowser: false,
  assetsSubDirectory: 'static',
  assetsPublicPath: '/',
  proxyTable: {
    '/api': {
      target: 'http://api.douban.com/v2',
      changeOrigin: true,
      pathRewrite: {
        '^/api': ''
      }
    }
  },
  // CSS Sourcemaps off by default because relative paths are "buggy"
  // with this option, according to the CSS-Loader README
  // (https://github.com/webpack/css-loader#sourcemaps)
  // In our experience, they generally work as expected,
  // just be aware of this issue when enabling this option.
  cssSourceMap: false
}

将target设置为我们需要访问的域名。

3、然后在main.js中设置全局属性:

Vue.prototype.HOST = '/api'

4、至此,我们就可以在全局使用这个域名了,如下:

var url = this.HOST + '/movie/in_theaters'
  this.$http.get(url).then(res => {
   this.movieList = res.data.subjects;
  },res => {
   console.info('调用失败');
  });

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍Vue中跨域及打包部署到nginx跨域设置方法,包括了Vue中跨域及打包部署到nginx跨域设置方法的使用技巧和注意事项,需要的朋友参考一下 众所周知,我们在做前后端分离项目的时候,经常需要在本地起前端工程,接口希望拉取服务端的实际数据而不是本地的mock数据,而如果本地程序直接访问远程接口, 肯定会遇到跨域问题。 什么是跨域?实现跨域的多种方式? 这里我就不详细介绍了,大家自行百度

  • 如何为Vue应用程序设置跨域配置?我有一个LaravelAPI服务于不同的域。因此,当我尝试发送和API请求时,它并没有将其发送到正确的API目标,而是发送到自己的域(例如,vue在

  • 一、简介 用于站点管理,发布点管理,基本设置,安全配置,PHPSSO配置,邮箱配置,connect,管理员管理,角色管理等基本管理和系统的相关设置等。 二、功能演示 站点管理 发布点管理

  • 问题内容: 我必须从域B.com调用域A.com(使用http设置cookie)。我在B.com域上所做的就是(javascript): 这将在我测试过的所有浏览器(Safari除外)上在A.com上设置Cookie。令人惊讶的是,即使没有P3P标头,它也可以在IE6中使用。 有什么办法可以使它在Safari中工作吗? 问题答案: 来自: Safari附带了一种保守的cookie策略,该策略将co

  • 使用指南 - 统计设置 - 统计规则设置 - 如何设置跨域监控 如图所示,在“管理-统计规则设置”中可以看到“跨域跟踪”功能。在“已设置跨域监控的网站域名”列表下,系统会展示基于您网站访问数据智能生成的受访域名列表,您可以直接将相关域名设置为跨域监控。

  • 本文向大家介绍关于Angularjs中跨域设置白名单问题,包括了关于Angularjs中跨域设置白名单问题的使用技巧和注意事项,需要的朋友参考一下 在config中注入$sceDelegateProvider服务使用resourceUrlWhitelist([])方法添加白名单      跨域时将method的属性设置为"jsonp"就可以访问了 总结 以上所述是小编给大家介绍的关于Angular