2024年Web前端最新怎么实现跨域?配置vue跨域proxy,jsonp跨域很简单(1),前端开发培训哪个好

最后

除了简历做到位,面试题也必不可少,整理了些题目,前面有117道汇总的面试到的题目,后面包括了HTML、CSS、JS、ES6、vue、微信小程序、项目类问题、笔试编程类题等专题。

如果不设置跨域  需要跨域的接口是

=====================

https://sug.so.360.cn/suggest?word=a

word 是参数

怎么设置跨域

=======

1、vue的跨域第一步在 vue 的根目录创建一个  vue.config.js 文件 ,只要更改了这个 vue.config.js 文件里的内容必须重新启动一下项目。写入一下代码

// 这个文件是vue的配置文件

// 一些额外的配置都放在这里

// 比如 跨域 自动打开浏览器 输出目录

module.exports = {

publicPath: “./”,

devServer: {

open: true, // 自动打开浏览器

// proxy: “https://sug.so.360.cn”, 这个接口必须跨域

// 可以直接设置跨域的地址

proxy: {

“/api”: {

target: “https://sug.so.360.cn”,

changeOrigin: true, //允许跨域

pathRewrite: {

“^/api”: “”,

},

},

},

// 不是所有的接口都要跨域 也可以给需要跨域的接口起一个识别的名字

// 只有前面带/api的接口才会跨域 其他的接口正常访问

},

};

// proxy跨域其实也是一种代理跨域 可以理解为欺骗浏览器 让浏览器以为没有跨域 访问的还是8080 ,但是服务器看到/api就会把地址变成需要跨域的地址

// 该配置文件修改了 要重新启动

封装axios里面

// 封装axios请求的模块

import axios from ‘axios’

// 用axios重新生成了请求的实例

const server = axios.create({

baseURL: ‘’, // 项目发送axios请求的公共地址 值为空

timeout: 5000 // 请求超时时间 这里是请求超过五秒后还没有获得请求结果 提示请求超时

})

server.interceptors.request.use(config => {

// config包含了请求相关的所有信息

// 可以同过config对象给请求配置或者修改信息

config.headers.token = ‘11111’

return config // 将配置完成的token返回 如果不返回 请求不会继续进行

}, err => {

// 请求发生错误时的回调函数

// 这里的意思是请求发送错误时将错误抛出

// throw new Error(err)

// console.error(err) //将错误信息打印在控制台中

Promise.reject(err) // 使用promise将错误信息返回出去

})

// axios 接受到服务器响应信息后的配置

// response 是响应的意思 这里的意思是使用响应拦截

server.interceptors.response.use(res => {

// res包含了服务器返回的所有响应信息 其实就是服务器返回给你的东西

return res.data

}, err => {

// 当服务器响应产生错误时的回调函数

console.error(err) // 这里将服务器发生错误的错误信息打印在控制台中

})

export default server

在请求api的时候

import request from ‘…/network/reques’

const getBanners = async () => {

// /api 加上说明这个接口要跨域

let

最后前端到底应该怎么学才好?

如果你打算靠自己摸索自学,那么你首先要了解学习前端的基本大纲,这是你将要学习的主要内容,理解以及掌握好这些内容,便可以找到一份初级的前端开发工作。你还需要有一套完整的前端学习教程,作为初学者最好的方式就是看视频教程学习,初学者容易理解接受。

不要选择买书学习,这样的方式没有几个人能学会,基本都是看不下去书,也看不懂书。如果喜欢看书的学弟,可以买一些经典的书籍作为辅助即可,主要还是以看教程为主。每天抽出固定几个小时学习,做好长期学习的准备。学习编程并不是每天光看视频,你学习编程最重要的目的是为了编写软件产品,提供给大众使用,所以用手写出代码实现功能才是我们要做的事情。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值