赞
踩
什么是同源,什么是跨域,跨域解决
JS采用的是同源。同源策略是浏览器的一项安全策略,浏览器只允许js代码请求和当前所在的服务器域名,端口,协议相同的数据接口上的数据。
浏览器不可以执行其他网站的脚本。是由浏览器的同源所造成的。也就是说,例如一个网站http://iwenwiki.com,当协议(http://),域名(iwenwiki.com),端口(可以省略:8080)不同时,就会产生跨域问题。
- <template>
- <div class="hello">
- <h1>跨域解决方案之proxy</h1>
- </div>
- </template>
-
- <script>
- import axios from "axios"
-
- export default {
- name: 'HelloWorld',
- mounted(){
- axios.get("http://iwenwiki.com/api/FingerUnion/list.php")
- .then(res=>{
- console.log(res.data);
- })
- }
- }
- </script>
组件中
- <template>
- <div class="hello">
- <h1>跨域解决方案之proxy</h1>
- </div>
- </template>
-
- <script>
- import axios from "axios"
-
- export default {
- name: 'HelloWorld',
- mounted(){
- axios.get("/api/FingerUnion/list.php")
- .then(res=>{
- console.log(res.data);
- })
- }
- }
- </script>
在vue.config.js中
- const { defineConfig } = require('@vue/cli-service')
- module.exports = defineConfig({
- transpileDependencies: true,
- // 前台解决方案:proxy
- devServer:{
- proxy:{
- '/api':{
- target:'http://iwenwiki.com/',
- changeOrigin:true
- }
- }
- }
- })
前台解决:proxy
后台解决:cors
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。